colmaris.fr/themes/hugo-blog-awesome/assets/sass/_dark.scss

286 lines
4.2 KiB
SCSS

@mixin dark-mode {
body {
color: $dark-text-base-color;
background-color: $dark-black;
}
// Headings
h1,
h2,
h3,
h4,
h5,
h6 {
color: $dark-white;
}
// Table
table {
thead {
color: $dark-white;
border-color: $dark-light;
}
th,
td,
tr {
border-color: $dark-light;
}
}
// Post
.page-content {
a {
color: $dark-text-link-blue;
&:hover,
&:active,
&:focus {
color: $dark-text-link-blue-active;
}
}
h3 {
border-color: $dark-light;
}
h1,
h2,
h3,
h4,
h5,
h6 {
.anchor-head {
color: $dark-text-link-blue;
}
}
}
// ToC
.toc {
background-color: $dark-toc-bg;
}
// Go to top
#totop {
color: $dark-text-base-color;
background-color: $dark-go-top-bg;
&:hover {
background-color: $dark-go-top-bg-hover;
}
}
// Inline code
li>code,
p>code {
font-size: 0.9em;
padding: 1px 3px;
position: relative;
top: -1px;
color: $dark-inline-code-text;
background-color: $dark-inline-code-bg;
border-radius: 2px;
border: 1px solid rgba(128, 128, 128, 0.1);
}
// kbd tag
kbd {
color: $dark-inline-code-text;
background-color: $dark-inline-code-bg;
}
// horizontal rule
hr {
border-color: $dark-light;
}
// Post Meta
.post-meta {
color: $dark-gray;
time {
&::after {
background-color: $dark-light;
}
}
span[itemprop="author"] {
border-color: $dark-light;
}
}
// Link
a {
color: inherit;
text-decoration-color: $dark-smoke;
&:hover {
color: $dark-text-link-blue;
}
&:focus {
outline-color: rgba(44, 118, 246, 0.6);
}
}
// List
li {
&:before {
color: $dark-white;
}
}
// Blockquote
blockquote {
color: $dark-blockquote-text;
border-color: $dark-bloquote-border;
}
// Strong, Bold
strong,
b {
color: $dark-white;
}
// Navbar
.navbar {
border-color: $dark-light;
.menu {
a#mode {
.mode-sunny {
display: block;
}
.mode-moon {
display: none;
}
}
.menu-link {
color: $dark-white;
}
@include media-query($on-mobile) {
background-color: $dark-black;
border-color: $dark-light;
input[type="checkbox"]:checked~.trigger {
background: $dark-black;
}
}
}
}
// Post Item
.post-item {
&:not(:first-child) {
border-color: $dark-light;
}
.post-item-date {
color: $dark-white;
}
.post-item-title {
a {
color: $dark-text-base-color;
&:hover,
&focus {
color: $dark-white;
}
}
}
}
// Post Navigation
.post-nav {
border-color: $dark-light;
.post-nav-item {
font-weight: $bold-weight;
.post-title {
color: $dark-white;
opacity: 0.9;
}
&:hover,
&:focus {
.post-title {
color: $dark-text-link-blue-active;
}
}
.nav-arrow {
color: $dark-gray;
}
}
@include media-query($on-mobile) {
.post-nav-item:nth-child(even) {
border-color: $dark-light;
}
}
}
// Footer
.footer {
span.footer_item {
color: $dark-white;
}
a.footer_item:not(:last-child) {
color: $dark-white;
}
.footer_copyright {
color: $dark-gray;
opacity: 1;
}
}
// 404 Page
.not-found {
.title {
color: $dark-white;
text-shadow: 1px 0px 0px $dark-text-link-blue;
}
.phrase {
color: $dark-text-base-color;
}
.solution {
color: $dark-text-link-blue;
}
.solution:hover {
color: $dark-text-link-blue-active;
}
}
.search-article {
input[type="search"] {
color: $dark-text-base-color;
&::-webkit-input-placeholder {
color: rgba(128, 128, 128, 0.8);
}
}
}
}
// support JS disabled environment with media query
@media (prefers-color-scheme: dark) {
// use "light" class to avoid style conflicts in js enabled environment
html:not(.light) {
@include dark-mode()
}
}
html.dark {
@include dark-mode()
}