Update: light theme

This commit is contained in:
hyzen
2026-03-04 03:13:05 +05:30
parent b8d02d6143
commit dd43d29e98
2 changed files with 124 additions and 30 deletions

View File

@@ -58,9 +58,9 @@
gap: 0.2rem; gap: 0.2rem;
padding: 0.2rem 0.4rem; padding: 0.2rem 0.4rem;
border-radius: 3px; border-radius: 3px;
border: 1px solid currentColor; border: 1px solid #f26522;
background-color: var(--foreground-color); background-color: #f26522;
color: var(--background-color) !important; color: #fff !important;
font-size: 0.7rem; font-size: 0.7rem;
font-weight: 340; font-weight: 340;
text-decoration: none !important; text-decoration: none !important;
@@ -71,6 +71,47 @@
color 0.2s ease; color 0.2s ease;
} }
@media (prefers-color-scheme: dark) {
.rss-subscribe__link {
background-color: var(--foreground-color);
border-color: currentColor;
color: var(--background-color) !important;
}
.rss-subscribe__link:hover,
.rss-subscribe__link:focus {
background-color: transparent;
color: var(--foreground-color) !important;
}
}
[data-theme='dark'] .rss-subscribe__link {
background-color: var(--foreground-color);
border-color: currentColor;
color: var(--background-color) !important;
}
[data-theme='dark'] .rss-subscribe__link:hover,
[data-theme='dark'] .rss-subscribe__link:focus {
background-color: transparent;
color: var(--foreground-color) !important;
}
[data-theme='light'] .rss-subscribe__link {
background-color: #f26522;
border-color: #f26522;
color: #fff !important;
}
[data-theme='light'] .rss-subscribe__link:hover,
[data-theme='light'] .rss-subscribe__link:focus {
background-color: transparent;
border-color: #f26522;
color: #f26522 !important;
}
.rss-subscribe__link:hover,
.rss-subscribe__link:focus {
background-color: transparent;
border-color: #f26522;
color: #f26522 !important;
}
.rss-subscribe__link:hover { .rss-subscribe__link:hover {
background-color: transparent; background-color: transparent;
color: var(--foreground-color) !important; color: var(--foreground-color) !important;
@@ -230,8 +271,8 @@
box-sizing: border-box; box-sizing: border-box;
border-radius: 3px; border-radius: 3px;
border: 1px solid #f26522; border: 1px solid #f26522;
background-color: #f26522; background-color: transparent;
color: #fff; color: #f26522;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
transition: transition:
@@ -240,8 +281,8 @@
} }
.brand__mobile-toggle:hover { .brand__mobile-toggle:hover {
background-color: transparent; background-color: #f26522;
color: #f26522; color: #fff;
} }
/* Mobile dropdown panel */ /* Mobile dropdown panel */
@@ -263,6 +304,12 @@
display: flex; display: flex;
} }
.brand__mobile-check:checked ~ .brand__mobile-toggle,
[data-theme='light'] .brand__mobile-check:checked ~ .brand__mobile-toggle {
background-color: #f26522;
color: #fff;
}
.mobile-link { .mobile-link {
display: flex; display: flex;
align-items: center; align-items: center;
@@ -297,13 +344,13 @@
} }
[data-theme='light'] .brand__mobile-toggle { [data-theme='light'] .brand__mobile-toggle {
background-color: #f26522; background-color: transparent;
border-color: #f26522; border-color: #f26522;
color: #fff; color: #f26522;
} }
[data-theme='light'] .brand__mobile-toggle:hover { [data-theme='light'] .brand__mobile-toggle:hover {
background-color: transparent; background-color: #f26522;
color: #f26522; color: #fff;
} }
[data-theme='dark'] .brand__mobile-toggle { [data-theme='dark'] .brand__mobile-toggle {
background-color: transparent; background-color: transparent;
@@ -379,11 +426,11 @@
/* Force light theme */ /* Force light theme */
[data-theme='light'] { [data-theme='light'] {
--background-color: #fbf1c7; --background-color: #fff;
--background-color1: #ebdbb2; --background-color1: #777;
--foreground-color: #3c3836; --foreground-color: #340b0b;
--foreground-color3: #665c54; --foreground-color3: #665c54;
--accent-color: #af3a03; --accent-color: #b11808;
} }
/* Force dark theme */ /* Force dark theme */

View File

@@ -58,9 +58,9 @@
gap: 0.2rem; gap: 0.2rem;
padding: 0.2rem 0.4rem; padding: 0.2rem 0.4rem;
border-radius: 3px; border-radius: 3px;
border: 1px solid currentColor; border: 1px solid #f26522;
background-color: var(--foreground-color); background-color: #f26522;
color: var(--background-color) !important; color: #fff !important;
font-size: 0.7rem; font-size: 0.7rem;
font-weight: 340; font-weight: 340;
text-decoration: none !important; text-decoration: none !important;
@@ -71,6 +71,47 @@
color 0.2s ease; color 0.2s ease;
} }
@media (prefers-color-scheme: dark) {
.rss-subscribe__link {
background-color: var(--foreground-color);
border-color: currentColor;
color: var(--background-color) !important;
}
.rss-subscribe__link:hover,
.rss-subscribe__link:focus {
background-color: transparent;
color: var(--foreground-color) !important;
}
}
[data-theme='dark'] .rss-subscribe__link {
background-color: var(--foreground-color);
border-color: currentColor;
color: var(--background-color) !important;
}
[data-theme='dark'] .rss-subscribe__link:hover,
[data-theme='dark'] .rss-subscribe__link:focus {
background-color: transparent;
color: var(--foreground-color) !important;
}
[data-theme='light'] .rss-subscribe__link {
background-color: #f26522;
border-color: #f26522;
color: #fff !important;
}
[data-theme='light'] .rss-subscribe__link:hover,
[data-theme='light'] .rss-subscribe__link:focus {
background-color: transparent;
border-color: #f26522;
color: #f26522 !important;
}
.rss-subscribe__link:hover,
.rss-subscribe__link:focus {
background-color: transparent;
border-color: #f26522;
color: #f26522 !important;
}
.rss-subscribe__link:hover { .rss-subscribe__link:hover {
background-color: transparent; background-color: transparent;
color: var(--foreground-color) !important; color: var(--foreground-color) !important;
@@ -230,8 +271,8 @@
box-sizing: border-box; box-sizing: border-box;
border-radius: 3px; border-radius: 3px;
border: 1px solid #f26522; border: 1px solid #f26522;
background-color: #f26522; background-color: transparent;
color: #fff; color: #f26522;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
transition: transition:
@@ -240,8 +281,8 @@
} }
.brand__mobile-toggle:hover { .brand__mobile-toggle:hover {
background-color: transparent; background-color: #f26522;
color: #f26522; color: #fff;
} }
/* Mobile dropdown panel */ /* Mobile dropdown panel */
@@ -263,6 +304,12 @@
display: flex; display: flex;
} }
.brand__mobile-check:checked ~ .brand__mobile-toggle,
[data-theme='light'] .brand__mobile-check:checked ~ .brand__mobile-toggle {
background-color: #f26522;
color: #fff;
}
.mobile-link { .mobile-link {
display: flex; display: flex;
align-items: center; align-items: center;
@@ -297,13 +344,13 @@
} }
[data-theme='light'] .brand__mobile-toggle { [data-theme='light'] .brand__mobile-toggle {
background-color: #f26522; background-color: transparent;
border-color: #f26522; border-color: #f26522;
color: #fff; color: #f26522;
} }
[data-theme='light'] .brand__mobile-toggle:hover { [data-theme='light'] .brand__mobile-toggle:hover {
background-color: transparent; background-color: #f26522;
color: #f26522; color: #fff;
} }
[data-theme='dark'] .brand__mobile-toggle { [data-theme='dark'] .brand__mobile-toggle {
background-color: transparent; background-color: transparent;
@@ -379,11 +426,11 @@
/* Force light theme */ /* Force light theme */
[data-theme='light'] { [data-theme='light'] {
--background-color: #fbf1c7; --background-color: #fff;
--background-color1: #ebdbb2; --background-color1: #777;
--foreground-color: #3c3836; --foreground-color: #340b0b;
--foreground-color3: #665c54; --foreground-color3: #665c54;
--accent-color: #af3a03; --accent-color: #b11808;
} }
/* Force dark theme */ /* Force dark theme */