diff options
Diffstat (limited to 'assets/css/default.css')
-rw-r--r-- | assets/css/default.css | 105 |
1 files changed, 84 insertions, 21 deletions
diff --git a/assets/css/default.css b/assets/css/default.css index 761c64d..af1c360 100644 --- a/assets/css/default.css +++ b/assets/css/default.css @@ -290,7 +290,8 @@ object { border-radius: 0.5rem; } -details { +details, +micro-metadata-menu context-control label { cursor: pointer; } @@ -308,6 +309,13 @@ a { a:hover { color: #111; color: var(--foreground); +} + +a:hover, +micro-metadata-menu:hover span, +micro-metadata-view a:hover span, +micro-metadata-draft a:hover span, +micro-metadata-handle a:hover span { text-decoration-thickness: 0.15rem !important; } @@ -365,7 +373,7 @@ abbr[title]:hover { border-bottom: 2px dashed; } -[type="checkbox"]:checked ~ abbr[title]::after { +input[type="checkbox"]:checked ~ abbr[title]::after { content: " (" attr(title) ")"; } @@ -706,7 +714,7 @@ micro-metadata { color: #444; color: var(--fade); display: flex; - line-height: 1.25; + line-height: 1.4; margin-bottom: 0.5rem; } @@ -714,19 +722,24 @@ micro-metadata h2 { display: inline; } -micro-metadata section { +micro-metadata header { word-break: break-all; word-break: break-word; } -micro-metadata section a { +micro-metadata header a { color: inherit; } -micro-metadata section > *:not(:last-child) { +micro-metadata header > *:not(:last-child) { margin-right: 0.5rem; } +micro-metadata header > *:hover { + color: #111; + color: var(--foreground); +} + micro-metadata-expiry, micro-metadata-draft em, micro-metadata word-limit em { @@ -740,7 +753,7 @@ micro-metadata-draft em { } micro-header footer svg, -micro-metadata section svg { +micro-metadata header svg { height: 1rem; width: 1rem; stroke-width: 0.1rem; @@ -753,9 +766,10 @@ micro-metadata unlisted-entry { s label, abbr[title], abbr[title] label, -micro-metadata read-time, +micro-metadata-expiry, +micro-metadata-readtime, +micro-metadata-datetime, micro-metadata word-limit, -micro-metadata expiry-date, micro-metadata unlisted-entry { cursor: help; } @@ -765,7 +779,6 @@ micro-metadata-anchored { color: var(--foreground); display: flex; margin-bottom: 0.25rem; - margin-top: -0.5rem; width: 100%; } @@ -780,6 +793,43 @@ micro-metadata-anchored svg { margin-right: 0.25rem; } +micro-metadata-menu { + display: inline-block; +} + +micro-metadata-menu context-menu svg { + margin-right: 0.25rem; +} + +micro-metadata-menu context-menu a { + display: block; + padding: 0.5rem 1rem; +} + +micro-metadata-menu context-menu a:hover { + background-color: #eee; + background-color: var(--hover-background); + border-radius: 0.25rem; +} + +micro-metadata a:focus > span, +micro-metadata-view a, +micro-metadata-name a, +micro-metadata-draft a, +micro-metadata-handle a, +micro-metadata context-menu a, +micro-metadata context-menu a span { + text-decoration: none; +} + +micro-metadata-name a:hover, +micro-metadata-menu span, +micro-metadata-view a span, +micro-metadata-draft a span, +micro-metadata-handle a span { + text-decoration: underline; +} + anchored-via { color: #444; color: var(--fade); @@ -1387,22 +1437,24 @@ context-menu { border-color: var(--border-lighter); border-radius: 0.5rem; box-shadow: 0 0 1rem -0.5rem var(--shadow); - padding-bottom: 0.5rem; - padding-top: 0.5rem; min-width: 6.25rem; position: absolute; z-index: 99; - max-width: 20rem; visibility: hidden; opacity: 0; } -context-profile context-menu { - color: #111; - color: var(--foreground); - display: block; - padding: 1rem; - text-align: left; +context-menu[right] { + right: 0; +} + +context-menu[left] { + left: 0; +} + +context-menu[left], +context-menu[right] { + top: 1rem; } context-profile a { @@ -1424,6 +1476,16 @@ context-profile aside:nth-child(2) { line-height: 1.25; } +context-profile context-menu { + color: #111; + color: var(--foreground); + display: block; + padding: 1rem; + text-align: left; + max-width: 20rem; +} + +input:checked + context-menu, micro-card figure:hover context-menu { margin-right: 1rem; opacity: 1; @@ -1537,7 +1599,7 @@ s { color: transparent; } -[type="checkbox"]:checked ~ s { +input[type="checkbox"]:checked ~ s { background-color: inherit; color: inherit; } @@ -1587,7 +1649,8 @@ kbd { outline: none; } -[hidden] { +[hidden], +[data-page] micro-metadata-view { display: none; } |