diff --git a/web/index.html b/web/index.html index 1a9d63b83e..5a4be098d6 100644 --- a/web/index.html +++ b/web/index.html @@ -48,6 +48,9 @@ --text: black; --background: white; --backgroundLight: #F3F3F8; + --blue: #0085ff; + --teal: #9AD5CA; + --yellow: #FED766; } html.colorMode--dark { --text: white; @@ -133,10 +136,42 @@ input:focus { outline: 0; } + /* TODO make this more obvious */ .tippy-content .items { width: fit-content; } + /* Hashtags in ProseMirror */ + .ProseMirror .inline-tag, + .ProseMirror .mention { + position: relative; + margin: 0 3px; + } + .ProseMirror .inline-tag::after, + .ProseMirror .mention::after { + content: ''; + position: absolute; + top: -1px; + bottom: -2px; + left: -3px; + right: -3px; + z-index: -1; + opacity: 0.3; + border-radius: 4px; + } + .ProseMirror .inline-tag { + color: var(--teal); + } + .ProseMirror .inline-tag::after { + background-color: var(--teal); + } + .ProseMirror .mention { + color: var(--yellow); + } + .ProseMirror .mention::after { + background-color: var(--yellow); + } + /* Tooltips */ [data-tooltip] { position: relative;