flex/static/stylesheet/dark-theme-styles.less

160 lines
3.4 KiB
Text
Raw Normal View History

//
// Dark Theme CSS styles.
//
// Don't directly include this file, instead, use the `dark-theme-class` or
// `dark-theme-override` files.
//
@import "variables.less";
body {
background-color: @body-bg-dark-theme;
color: @text-color-dark-theme;
}
hr {
background-color: @solid-dark-grey;
color: @solid-dark-grey;
}
aside {
background-color: @sidebar-bg-dark-theme;
color: @sidebar-text-color;
form.navbar-search input#tipue_search_input {
background-color: @very-dark-grey;
color: @light-grey;
}
}
main {
nav {
border-bottom-color: @nav-border-color-dark-theme;
}
nav, .translations {
a {
border-color: @nav-border-color-dark-theme;
}
}
article {
kbd {
background-color: #080808;
color: @light-grey;
}
blockquote, pre {
border-left: 8px solid #ffffff33;
}
*:not(pre) > code {
background-color: #080808;
border-color: #000;
}
2020-04-16 19:07:03 +02:00
div#tipue_search_content .tipue_search_result {
span.tipue_search_content_bold {
color: white;
}
}
2020-04-16 19:07:03 +02:00
section#isso-thread {
div.textarea,
.auth-section p.input-wrapper input,
.notification-section input {
background: @very-dark-grey;
color: @light-grey;
}
>h4 {
color: @light-grey;
}
.isso-postbox > .form-wrapper .preview {
background: repeating-linear-gradient(
-45deg,
@solid-dark-grey, @solid-dark-grey 10px,
@very-dark-grey 10px, @very-dark-grey 20px
);
}
.isso-comment > div.text-wrapper {
> .isso-comment-header {
.author {
color: @light-grey;
}
.spacer, a.permalink, .note, a.parent {
color: @med-grey;
&:hover {
color: @light-grey;
}
}
}
> .isso-comment-footer a:hover {
// Unfortunately, Isso uses a lot of !important in its styles, so I
// have to override that.
text-shadow: @dark-grey 0 0 1px !important;
}
}
}
}
footer {
border-top-color: @footer-border-color-dark-theme;
}
}
div.related-posts {
border-color: @rel-post-border-color-dark-theme;
}
// Admonition
div.admonition.attention {
color: @admonition-attention-color-dark-theme;
background-color: @admonition-attention-bg-color-dark-theme;
}
div.admonition.caution {
color: @admonition-caution-color-dark-theme;
background-color: @admonition-caution-bg-color-dark-theme;
}
div.admonition.danger {
color: @admonition-danger-color-dark-theme;
background-color: @admonition-danger-bg-color-dark-theme;
}
div.admonition.error {
color: @admonition-error-color-dark-theme;
background-color: @admonition-error-bg-color-dark-theme;
}
div.admonition.hint {
color: @admonition-hint-color-dark-theme;
background-color: @admonition-hint-bg-color-dark-theme;
}
div.admonition.important {
color: @admonition-important-color-dark-theme;
background-color: @admonition-important-bg-color-dark-theme;
}
div.admonition.note {
color: @admonition-note-color-dark-theme;
background-color: @admonition-note-bg-color-dark-theme;
}
div.admonition.tip {
color: @admonition-tip-color-dark-theme;
background-color: @admonition-tip-bg-color-dark-theme;
}
div.admonition.warning {
color: @admonition-warning-color-dark-theme;
background-color: @admonition-warning-bg-color-dark-theme;
}