website/css/dark.css

98 lines
1.9 KiB
CSS

:root {
--dark-primary-color: 34, 39, 46;
--dark-secondary-color: #2d333b;
--dark-tertiary-color: #646464;
--dark-text-color: #24ea25;
}
html {
background-color: rgb(var(--dark-primary-color));
color: var(--dark-text-color);
fill: var(--dark-text-color);
}
.header {
background-color: rgba(var(--dark-primary-color), 0.95);
}
.nav-hamburger-list {
background: rgba(var(--dark-primary-color), 1);
}
.nav-links .nav-icons-divider {
color: var(--dark-secondary-color);
}
a:hover .feather-moon {
fill: white;
color: white;
}
.social-icons-list .social-icon,
.social-icons-list .social-icon a:visited {
fill: var(--dark-text-color);
}
.social-icons-list .social-icon a:hover {
fill: var(--accent-color);
}
.post-tags .post-tag:hover {
background-color: var(--dark-text-color);
color: rgb(var(--dark-primary-color));
}
.tags-list .post-tags .post-tag a .tag-posts-count {
background-color: var(--dark-secondary-color);
}
.tags-list .post-tags .post-tag:hover a .tag-posts-count {
background-color: var(--dark-text-color);
color: rgb(var(--dark-primary-color));
}
.footer {
border-top-color: var(--dark-header-bg-color);
}
blockquote {
color: darkgrey;
border-left-color: var(--dark-secondary-color);
}
hr {
color: var(--dark-secondary-color);
}
table thead {
background-color: var(--dark-secondary-color);
}
table td,
table th {
border-bottom-color: var(--dark-secondary-color);
}
code,
pre {
background-color: var(--dark-secondary-color) !important;
}
:not(pre) > code {
background-color: var(--dark-tertiary-color) !important;
color: var(--dark-text-color);
}
.header-shadow {
box-shadow: rgb(33, 38, 45) 0px -1px 0px 0px inset;
}
/* TODO: Check if this is needed or not */
/*
img,
video {
filter: hue-rotate(180deg) contrast(100%) invert(100%);
-webkit-filter: hue-rotate(180deg) contrast(100%) invert(100%);
}
*/