Add tab hover shadow definition. Intended to have better hover accents for light theme.

This commit is contained in:
SML 2023-02-09 07:03:09 +08:00
parent c111d93840
commit 94eff28fda
2 changed files with 18 additions and 4 deletions

View File

@ -6,10 +6,11 @@
--sanic-yellow: #ffde41; --sanic-yellow: #ffde41;
--sanic-purple: #7e22ce; --sanic-purple: #7e22ce;
--sanic-green: #4d7c0f; --sanic-green: #4d7c0f;
--sanic-background: #e2e8f0; --sanic-background: #f1f5f9;
--sanic-text: #1f2937; --sanic-text: #1f2937;
--sanic-tab-background: #f8fafc; --sanic-tab-background: #fff;
--sanic-tab-text: #0f172a; --sanic-tab-text: #0f172a;
--sanic-tab-shadow: #adadad;
--sanic-highlight-background: var(--sanic-yellow); --sanic-highlight-background: var(--sanic-yellow);
--sanic-highlight-text: var(--sanic-text); --sanic-highlight-text: var(--sanic-text);
} }
@ -25,6 +26,7 @@
--sanic-text: #f1f5f9; --sanic-text: #f1f5f9;
--sanic-tab-background: #383d4d; --sanic-tab-background: #383d4d;
--sanic-tab-text: #cbd5e1; --sanic-tab-text: #cbd5e1;
--sanic-tab-shadow: #000;
--sanic-highlight-background: var(--sanic-yellow); --sanic-highlight-background: var(--sanic-yellow);
--sanic-highlight-text: #1f2937; --sanic-highlight-text: #1f2937;
} }

View File

@ -5,12 +5,15 @@
text-align: justify; text-align: justify;
/*text-justify: both;*/ /*text-justify: both;*/
} }
#enduser a { #enduser a {
color: var(--sanic-blue); color: var(--sanic-blue);
} }
#enduser p:last-child { #enduser p:last-child {
text-align: right; text-align: right;
} }
summary { summary {
margin-top: 3em; margin-top: 3em;
color: var(--sanic-blue); color: var(--sanic-blue);
@ -37,10 +40,14 @@ summary {
background: var(--tracerite-tab) !important; background: var(--tracerite-tab) !important;
color: var(--tracerite-tab-text) !important; color: var(--tracerite-tab-text) !important;
transition: 0.3s; transition: 0.3s;
cursor: pointer;
} }
.tracerite .traceback-labels {
padding-top: 5px;
}
.tracerite .traceback-labels button:hover { .tracerite .traceback-labels button:hover {
filter: brightness(120%); filter: contrast(150%) brightness(120%) drop-shadow(0 -0 2px var(--sanic-tab-shadow));
} }
.tracerite .traceback-details mark span { .tracerite .traceback-details mark span {
@ -52,11 +59,13 @@ summary {
h1 { h1 {
/*margin-left: -1.5rem; !* Emoji partially in the left margin *!*/ /*margin-left: -1.5rem; !* Emoji partially in the left margin *!*/
} }
h2 { h2 {
margin: 1em 0 0.2em 0; margin: 1em 0 0.2em 0;
font-size: 1.25rem; font-size: 1.25rem;
color: var(--sanic-text); color: var(--sanic-text);
} }
dl.key-value-table { dl.key-value-table {
width: 100%; width: 100%;
margin: 0; margin: 0;
@ -65,13 +74,16 @@ dl.key-value-table {
grid-gap: .3em; grid-gap: .3em;
white-space: pre-wrap; white-space: pre-wrap;
} }
dl.key-value-table * { dl.key-value-table * {
margin: 0; margin: 0;
} }
dl.key-value-table dt { dl.key-value-table dt {
color: #888; color: #888;
word-break: break-word; word-break: break-word;
} }
dl.key-value-table dd { dl.key-value-table dd {
word-break: break-all; /* Better breaking for cookies header and such */ word-break: break-all; /* Better breaking for cookies header and such */
} }