From 16fbc41e6e1e3fa0cf6d89578d78621ba86f14c3 Mon Sep 17 00:00:00 2001 From: Hsieh Chin Fan Date: Fri, 20 Sep 2024 17:11:23 +0800 Subject: chore: update CSS files by stylelint --- src/css/index.css | 50 ++++++++++++++++++++++++++++++++------------------ 1 file changed, 32 insertions(+), 18 deletions(-) (limited to 'src/css/index.css') diff --git a/src/css/index.css b/src/css/index.css index c754600..3b8a51f 100644 --- a/src/css/index.css +++ b/src/css/index.css @@ -3,11 +3,15 @@ --content-border-radius: 5px; } +.editor { + display: none; +} + body { width: 100%; height: 100vh; - &[data-layout=editing] { + &[data-layout="editing"] { display: flex; align-items: stretch; gap: 0.5em; @@ -17,37 +21,38 @@ body { .DumbyMap { order: 1; flex: 1 0 calc(50% - 0.5em); + height: 100%; overflow-y: scroll; + border: var(--content-border); border-radius: var(--content-border-radius); } + .editor { display: block; order: 2; flex: 1 0 50%; max-width: calc(50% - 0.5em); + height: 100%; } } } -.editor { - display: none; -} - .EasyMDEContainer { display: flex; + box-sizing: border-box; + height: 100%; align-items: stretch; gap: 0.5em; - height: 100%; flex-direction: column; - box-sizing: border-box; .CodeMirror { order: 1; flex: 1 0 0; + border: var(--content-border); border-radius: var(--content-border-radius); padding-inline: 0; @@ -58,6 +63,7 @@ body { span { white-space: pre; } + .invalid-input { text-decoration: red wavy underline 1px; } @@ -79,7 +85,7 @@ body { /* FIXME For those empty line (no child with cm-comment) */ .inside-code-block, .CodeMirror-line:has(.cm-formatting-code-block) { - background: rgba(0,0,0,.05) !important; + background: rgb(0 0 0 / 5%) !important; .cm-comment { background: none !important; @@ -88,24 +94,27 @@ body { .container__suggestions { display: none; - position: absolute; width: fit-content; - min-width: 10rem; - max-height: 40vh; - overflow-y: scroll; + + position: absolute; + z-index: 100; + border: 2px solid lightgray; border-radius: 0.5rem; - z-index: 100; - background: #fff; + background: white; + min-width: 10rem; + max-height: 40vh; + overflow-y: scroll; } + .container__suggestion { - cursor: pointer; display: flex; - justify-content: space-between; overflow: hidden; - height: fit-content; + + cursor: pointer; + justify-content: space-between; min-height: 2rem; white-space: nowrap; align-items: center; @@ -113,23 +122,28 @@ body { &:not(:first-child) { border-top: 1px solid rgb(203 213 225); } + &.focus { background: rgb(226 232 240); } * { flex-shrink: 0; + display: inline-block; overflow: hidden; padding-inline: 1em; } + .info { - color: #4682B4; + color: steelblue; font-weight: bold; } + .truncate { flex-shrink: 1; text-overflow: ellipsis; + ::before { width: 2rem } -- cgit v1.2.3-70-g09d2