diff --git a/editor/package-lock.json b/editor/package-lock.json index f0e4e51..356f951 100644 --- a/editor/package-lock.json +++ b/editor/package-lock.json @@ -8651,9 +8651,9 @@ } }, "wiki-list-editor": { - "version": "0.7.3", - "resolved": "https://registry.npmjs.org/wiki-list-editor/-/wiki-list-editor-0.7.3.tgz", - "integrity": "sha512-JZTHH0b5Q2O4UO+nBesOUP1C4W3awh4mfMtsga8j1sR65P+I5MIBj/ymrvtZCGVYI2PL3RDA3aGWBsfp7s2u4w==", + "version": "0.7.4", + "resolved": "https://registry.npmjs.org/wiki-list-editor/-/wiki-list-editor-0.7.4.tgz", + "integrity": "sha512-KZOYOu8Niq0ISMCnngEMse4BMr9GcuGuCIXyKeToPTePBznM30MEKq4izRkGNRUVa09CHVmuDF/M4zltIactow==", "requires": { "dragula": "^3.7.2", "he": "^1.2.0", diff --git a/editor/package.json b/editor/package.json index ec92a50..4f890a3 100644 --- a/editor/package.json +++ b/editor/package.json @@ -27,7 +27,7 @@ "prismjs": "^1.20.0", "sass-loader": "^7.3.1", "style-loader": "^1.0.0", - "wiki-list-editor": "^0.7.3" + "wiki-list-editor": "^0.7.4" }, "scripts": { "test": "node_modules/.bin/mocha -r esm", diff --git a/editor/src/index.js b/editor/src/index.js index 6969533..3d73ce6 100644 --- a/editor/src/index.js +++ b/editor/src/index.js @@ -212,6 +212,9 @@ if (holder) { createPageSearch().then(function ({titleSearch, commandSearch, commands}) { editor.on('start-editing', function (input) { const $lc = $('#link-complete'); + + $(input).parents('.list-item').addClass('active'); + $lc.on('popup:selected', function (event, linkName, resultType, element) { let value = input.value let end = input.selectionEnd @@ -337,6 +340,7 @@ if (holder) { }) editor.on('stop-editing', function (input) { + $(input).parents('.list-item').removeClass('active'); $('#link-complete').off() PrismJS.highlightAll() }) diff --git a/editor/src/styles.scss b/editor/src/styles.scss index 886d9d4..5b1c5aa 100644 --- a/editor/src/styles.scss +++ b/editor/src/styles.scss @@ -34,6 +34,7 @@ body { content: "[["; color: #ccc; } + .content a.wiki-link::after { content: "]]"; color: #ccc; @@ -68,20 +69,41 @@ body { #autocomplete.hidden { display: none; } + #result-template.hidden { display: none; } -.fold { - align-self:flex-start; - font-size: 11px; - margin-top: 4px; +.list-item .fold { + visibility: hidden; } -.fold.no-children { + +.list-item:hover .fold { + visibility: visible; +} + +.list-item.editor .fold { + visibility: visible; +} + +.list-item .fold { + align-self: flex-start; + font-size: 10px; + margin-top: 4px; + margin-right: 3px; +} + +.list-item.no-children:hover .fold, +.list-item.no-children.editor .fold, +.list-item.no-children .fold { + visibility: hidden; +} + +.list-item.no-children.fold { color: #cccccc; } -.fold.open { +.list-item.open .fold { transform: rotate(90deg); } @@ -106,9 +128,9 @@ body { margin-top: 4px; border-radius: 50%; - border: 4px solid white; + border: 4px solid #ccc; - background: black; + background: rgba(0, 0, 0, 0.8); } textarea { @@ -124,6 +146,14 @@ textarea { border-color: #ccc; } +.list-item.open .marker { + border-color: white; +} + +.list-item.no-children .marker { + border-color: white; +} + .list-item { border: none; padding: 2px 0px; @@ -138,3 +168,21 @@ textarea { min-height: 19px; word-break: break-word; } + +mark { + background: #ffff99; +} + +.content mark::before { + content: "=="; + color: #999; +} + +.content mark::after { + content: "=="; + color: #999; +} + +.marker, .fold { + user-select: none; +} diff --git a/templates/layout.html b/templates/layout.html index a16c3d4..3354fb5 100644 --- a/templates/layout.html +++ b/templates/layout.html @@ -6,6 +6,7 @@ content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> +