jaculabilis/danbooru
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

css: add more variables for dark mode.

Browse Source 
Add some more variables that will be needed for dark mode.
This commit is contained in:
evazion
2019-09-19 04:20:44 -05:00
parent e15c5ad217
commit c86a24743a
7 changed files with 22 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
app/javascript/src/styles/base/040_colors.css
View File

@@ -1,16 +1,8 @@
:root {
--very-light-grey: hsl(0, 0%, 95%);
--light-grey: hsl(0, 0%, 90%);
--grey: hsl(0, 0%, 55%);
--dark-grey: hsl(0, 0%, 40%);
--very-dark-grey: hsl(0, 0%, 15%);
}
:root {
--body-background-color: white;
--text-color: var(--very-dark-grey);
--muted-text-color: var(--grey);
--text-color: hsl(0, 0%, 15%);
--muted-text-color: hsl(0, 0%, 55%);
--link-color: hsl(213, 100%, 50%);
--link-hover-color: hsl(213, 100%, 75%);
@@ -61,7 +53,7 @@
--modqueue-sample-warning-color: var(--error-background-color);
--modqueue-quality-warning-color: var(--warning-background-color);
--modqueue-postive-score-background-color: var(--success-background-color);
--modqueue-positive-score-background-color: var(--success-background-color);
--modqueue-negative-score-background-color: var(--error-background-color);
--uploads-dropzone-background: #EEE;
@@ -79,6 +71,7 @@
--comment-sticky-background-color: var(--subnav-menu-background-color);
--post-tooltip-background-color: var(--body-background-color);
--post-tooltip-border-color: #767676;
--post-tooltip-header-background-color: var(--subnav-menu-background-color);
--post-tooltip-info-color: #555;
@@ -118,6 +111,7 @@
--post-artist-commentary-container-border: 1px solid #CCC;
--note-body-background: #FFE;
--note-body-text-color: var(--text-color);
--note-body-border: 1px solid black;
--note-box-border: 1px solid white;
--note-box-background: transparent;
@@ -171,17 +165,21 @@
--bulk-update-request-approved-color: green;
--bulk-update-request-failed-color: red;
--notice-text-color: var(--text-color);
--notice-background: #FFFBBF;
--notice-border: 1px solid #CCC999;
--sign-in-link-color: #E00;
--footer-border: 1px solid #EEE;
--jquery-ui-widget-content-background: var(--body-background-color);
--jquery-ui-widget-content-text-color: var(--text-color);
--jquery-ui-state-error-background: #FDDFDE;
--jquery-ui-state-error-border: 1px solid #FBC7C6;
--jquery-ui-state-error-text-color: var(--text-color);
--jquery-ui-state-highlight-background: #FDF5D9;
--jquery-ui-state-highlight-border: 1px solid #FCEEC1;
--jquery-ui-state-highlight-color: #363636;
--jquery-ui-state-highlight-text-color: var(--text-color);
--jquery-ui-dialog-box-shadow: 2px 2px 1px grey;
--dtext-blockquote-border: 1px solid #666;

2
app/javascript/src/styles/common/dtext.scss
View File

@@ -55,7 +55,7 @@ div.prose {
font-size: 1.2em;
margin: 0.5em 0;
padding: 0.5em 1em;
background: var(--dtext-code-background-color);
background: var(--dtext-code-background);
white-space: pre-wrap;
}

8
app/javascript/src/styles/common/jquery_ui_custom.scss
View File

@@ -8,6 +8,11 @@
}
}
.ui-widget-content {
background: var(--jquery-ui-widget-content-background);
color: var(--jquery-ui-widget-content-text-color);
}
.ui-widget-content a {
color: var(--link-color);
}
@@ -38,7 +43,7 @@ div.ui-dialog {
.ui-state-highlight {
border: var(--jquery-ui-state-highlight-border);
background: var(--jquery-ui-state-highlight-background);
color: var(--jquery-ui-state-highlight-color);
color: var(--jquery-ui-state-highlight-text-color);
a, a:active, a:visited {
color: var(--link-color);
@@ -52,6 +57,7 @@ div.ui-dialog {
.ui-state-error {
border: var(--jquery-ui-state-error-border);
background: var(--jquery-ui-state-error-background);
color: var(--jquery-ui-state-error-text-color);
}
.ui-button {

1
app/javascript/src/styles/common/notices.scss
View File

@@ -19,6 +19,7 @@ div#notice {
&:not(.ui-state-error) {
background: var(--notice-background);
border: var(--notice-border);
color: var(--notice-text-color);
}
}

2
app/javascript/src/styles/specific/error.scss
View File

@@ -2,7 +2,7 @@ ul.backtrace {
font-family: monospace;
font-size: 1.2em;
list-style-type: none;
background: var(--dtext-code-background-color);
background: var(--dtext-code-background);
padding: 1em;
margin-bottom: 1em;
}

1
app/javascript/src/styles/specific/notes.scss
View File

@@ -6,6 +6,7 @@ div#note-container {
position: absolute;
border: var(--note-body-border);
background: var(--note-body-background);
color: var(--note-body-text-color);
min-width: 140px;
min-height: 1em;
line-height: normal;

1
app/javascript/src/styles/specific/post_tooltips.scss
View File

@@ -54,6 +54,7 @@ $tooltip-width: 164px * 3 - 10; // 3 thumbnails wide.
font-size: 11px;
line-height: $tooltip-line-height;
border-color: var(--post-tooltip-border-color);
background-color: var(--post-tooltip-background-color);
.qtip-content {
padding: 0;