style: make text fit aqua color scheme

Uses a dark aqua for light theme and aqua for dark theme.
This commit is contained in:
danda 2024-05-15 16:31:39 -07:00
parent df14092d61
commit 22f06180ae
2 changed files with 42 additions and 1 deletions

View File

@ -1,3 +1,44 @@
/* override color for light color scheme (Default) */
/* Can be forced with data-theme="light" */
[data-theme=light],
:root:not([data-theme=dark]) {
--pico-color: rgb(0, 115, 115);
--pico-h1-color: var(--pico-color);
--pico-h2-color: var(--pico-color);
--pico-h3-color: var(--pico-color);
--pico-h4-color: var(--pico-color);
--pico-h5-color: var(--pico-color);
--pico-h6-color: var(--pico-color);
--pico-accordion-open-summary-color: var(--pico-color);
}
/* override color for dark color scheme (Auto) */
/* Automatically enabled if user has Dark mode enabled */
@media only screen and (prefers-color-scheme: dark) {
:root:not([data-theme]) {
--pico-color: cyan;
--pico-h1-color: var(--pico-color);
--pico-h2-color: var(--pico-color);
--pico-h3-color: var(--pico-color);
--pico-h4-color: var(--pico-color);
--pico-h5-color: var(--pico-color);
--pico-h6-color: var(--pico-color); }
--pico-accordion-open-summary-color: var(--pico-color);
}
/* override color for dark color scheme (Forced) */
/* Enabled if forced with data-theme="dark" */
[data-theme=dark] {
--pico-color: cyan;
--pico-h1-color: var(--pico-color);
--pico-h2-color: var(--pico-color);
--pico-h3-color: var(--pico-color);
--pico-h4-color: var(--pico-color);
--pico-h5-color: var(--pico-color);
--pico-h6-color: var(--pico-color);
--pico-accordion-open-summary-color: var(--pico-color);
}
div.indent {
position: relative;
left: 20px;

View File

@ -1,4 +1,4 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="/css/styles.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/css/pico.min.css" media="screen" />
<link rel="stylesheet" type="text/css" href="/css/styles.css" media="screen" />
<link rel="icon" type="image/png" sizes="48x48" href="/image/neptune-favicon.png">