99 lines
2.3 KiB
CSS
99 lines
2.3 KiB
CSS
.theme-dark:root {
|
|
--primary-text-color: #e2e2e2;
|
|
--secondary-text-color: #868686;
|
|
--white-color: #282c35;
|
|
--color-white: #282c35;
|
|
--lighter-gray-color: #2f333c;
|
|
--color-lighter-gray: #2f333c;
|
|
--light-gray-color: #3b3e46;
|
|
--color-light-gray: #3b3e46;
|
|
--color-light-color: #3b3e46;
|
|
--mid-gray-color: #666;
|
|
--color-mid-gray: #666;
|
|
--dark-gray-color: #e6e6e6;
|
|
--color-dark-gray: #e6e6e6;
|
|
--darker-gray-color: #fff;
|
|
--color-darker-gray: #fff;
|
|
}
|
|
|
|
.theme-dark .gh-head-logo img:first-child:not(:only-child) {
|
|
opacity: 0;
|
|
}
|
|
|
|
.theme-dark .gh-head-logo img + img {
|
|
opacity: 1;
|
|
}
|
|
|
|
.theme-dark .sticky {
|
|
background-color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
|
|
.theme-dark .form-button,
|
|
.theme-dark .pswp__counter {
|
|
color: var(--darker-gray-color);
|
|
}
|
|
|
|
.theme-dark .share-link {
|
|
background-color: var(--darker-gray-color);
|
|
}
|
|
|
|
.theme-dark .share-link-facebook {
|
|
color: var(--facebook-color);
|
|
}
|
|
|
|
.theme-dark .share-link-twitter {
|
|
color: var(--twitter-color);
|
|
}
|
|
|
|
.theme-dark .kg-audio-card button {
|
|
color: var(--darker-gray-color);
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
html:not(.theme-light):root {
|
|
--primary-text-color: #e2e2e2;
|
|
--secondary-text-color: #868686;
|
|
--white-color: #282c35;
|
|
--color-white: #282c35;
|
|
--lighter-gray-color: #2f333c;
|
|
--light-gray-color: #3b3e46;
|
|
--mid-gray-color: #666;
|
|
--dark-gray-color: #e6e6e6;
|
|
--darker-gray-color: #fff;
|
|
--color-darker-gray: #fff;
|
|
}
|
|
|
|
html:not(.theme-light) .gh-head-logo img:first-child:not(:only-child) {
|
|
opacity: 0;
|
|
}
|
|
|
|
html:not(.theme-light) .gh-head-logo img + img {
|
|
opacity: 1;
|
|
}
|
|
|
|
html:not(.theme-light) .sticky {
|
|
background-color: rgba(0, 0, 0, 0.6);
|
|
}
|
|
|
|
html:not(.theme-light) .form-button,
|
|
html:not(.theme-light) .pswp__counter {
|
|
color: var(--darker-gray-color);
|
|
}
|
|
|
|
html:not(.theme-light) .share-link {
|
|
background-color: var(--darker-gray-color);
|
|
}
|
|
|
|
html:not(.theme-light) .share-link-facebook {
|
|
color: var(--facebook-color);
|
|
}
|
|
|
|
html:not(.theme-light) .share-link-twitter {
|
|
color: var(--twitter-color);
|
|
}
|
|
|
|
html:not(.theme-light) .kg-audio-card button {
|
|
color: var(--darker-gray-color);
|
|
}
|
|
}
|