Add dark theme

This commit is contained in:
arnaucube
2021-08-25 22:40:13 +02:00
parent e043736ee6
commit f6323e7ca4
13 changed files with 584 additions and 45 deletions

View File

@@ -7,6 +7,15 @@ body {
font-family: 'Roboto', sans-serif;
}
.dark-theme { /* used for body class */
filter: invert(100%) hue-rotate(180deg);
background-color: #111;
}
.dark-theme img, .dark-theme video, .dark-theme iframe, .dark-theme .onoffswitch-label, .dark-theme code {
filter: invert(100%) hue-rotate(180deg);
}
a {
text-decoration:none!important;
}
@@ -24,3 +33,45 @@ h1,h2, h3, h4, h5 {
padding-top: 20px;
}
.postThumb {
color:#000000;
text-decoration:none;
}
.postThumb:hover {
background: #f9f9f9;
}
/* switch button */
.onoffswitch {
position: relative; width: 46px;
-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
display: none;
}
.onoffswitch-label {
display: block; overflow: hidden; cursor: pointer;
height: 20px; padding: 0; line-height: 20px;
border: 2px solid #FFFFFF; border-radius: 20px;
background-color: #9E9E9E;
transition: background-color 0.3s ease-in;
margin-bottom: 0;
}
.onoffswitch-label:before {
content: "";
display: block; width: 20px; margin: 0px;
background: #FFFFFF;
position: absolute; top: 0; bottom: 0;
right: 24px;
border: 2px solid #FFFFFF; border-radius: 20px;
transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
background-color: #fbc5a0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
border-color: #fbc5a0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
right: 0px;
}