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

css: factor out colors from main css (#4158).

Browse Source
This commit is contained in:
evazion
2019-09-17 00:28:41 -05:00
parent d203a543d0
commit c325bfa199
52 changed files with 519 additions and 332 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
app/javascript/packs/application.js
View File

@@ -15,8 +15,6 @@ require('jquery-hotkeys');
// should start looking for nodejs replacements
importAll(require.context('../vendor', true, /\.js$/));
importAll(require.context('../src/styles/base', true, /\.scss$/));
require("jquery-ui/ui/widgets/autocomplete");
require("jquery-ui/ui/widgets/button");
require("jquery-ui/ui/widgets/dialog");
@@ -31,8 +29,7 @@ require("jquery-ui/themes/base/resizable.css");
require("jquery-ui/themes/base/theme.css");
importAll(require.context('../src/javascripts', true, /\.js(\.erb)?$/));
importAll(require.context('../src/styles/common', true, /\.scss(?:\.erb)?$/));
importAll(require.context('../src/styles/specific', true, /\.scss(?:\.erb)?$/));
importAll(require.context('../src/styles', true, /\.s?css(?:\.erb)?$/));
export { default as Autocomplete } from '../src/javascripts/autocomplete.js.erb';
export { default as Blacklist } from '../src/javascripts/blacklists.js';

24
app/javascript/src/styles/base/000_vars.scss
View File

@@ -1,7 +1,3 @@
$menu_color: #F5F5FF;
$link_color: hsl(213, 100%, 50%);
$link_hover_color: lighten($link_color, 25%);
$highlight_color: lighten($link_color, 45%);
$h1_size: 2em;
$h2_size: 1.5em;
$h3_size: 1.16667em;
@@ -17,26 +13,14 @@ $h2_padding: 0.8em 0 0.25em 0;
$h3_padding: 0.8em 0 0.25em 0;
$h4_padding: 0.8em 0 0.25em 0;
$base_font_family: Verdana, Helvetica, sans-serif;
$preview_has_children_color: #0F0;
$preview_has_parent_color: #CC0;
$preview_deleted_color: #000;
$preview_pending_color: #00F;
$preview_flagged_color: #F00;
$preview_sample_warning_color: hsl(0, 100%, 90%); // light red
$preview_quality_warning_color: hsl(50, 100%, 90%); // light yellow
$note_highlight_color: $preview_pending_color;
$error_color: hsl(0, 100%, 95%); // light red
$success_color: hsl(120, 100%, 95%); // light green
@mixin animated-icon {
content: "►";
position: absolute;
width: 20px;
height: 20px;
color: white;
background-color: rgba(0,0,0,0.5);
color: var(--preview-icon-color);
background: var(--preview-icon-background);
margin: 2px;
text-align: center;
}
@@ -46,8 +30,8 @@ $success_color: hsl(120, 100%, 95%); // light green
position: absolute;
width: 20px;
height: 20px;
color: white;
background-color: rgba(0,0,0,0.5);
color: var(--preview-icon-color);
background: var(--preview-icon-background);
margin: 2px;
text-align: center;
}

2
app/javascript/src/styles/base/010_reset.scss
View File

@@ -1,7 +1,5 @@
// Source: https://github.com/FrogBot/sassy_bootstrap/blob/master/lib/_reset.sass
@import "../base/000_vars.scss";
// Reset.sass
// Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an
// adapted version here that cuts out some of the reset HTML elements we will

15
app/javascript/src/styles/base/020_base.scss
View File

@@ -1,7 +1,7 @@
@import "../base/000_vars.scss";
body {
background-color: #FFF;
background-color: var(--body-background-color);
font-family: $base_font_family;
font-size: 87.5%;
line-height: 1.25em;
@@ -11,13 +11,6 @@ abbr[title=required] {
display: none;
}
blockquote {
margin: 0 0 1em 0;
padding: 1em 1em 0.2em;
border: 1px solid #666;
background: #EEE;
}
code {
font-family: monospace;
font-size: 1.2em;
@@ -88,17 +81,17 @@ table tfoot {
}
.hint {
color: #666;
color: var(--hint-color);
font-style: italic;
}
.tn {
font-size: 0.8em;
color: gray;
color: var(--translation-note-color);
}
p.info {
color: #AAA;
color: var(--info-color);
font-style: italic;
font-size: 80%;
}

10
app/javascript/src/styles/base/030_links.scss
View File

@@ -1,22 +1,20 @@
@import "../base/000_vars.scss";
a:link {
color: $link_color;
color: var(--link-color);
text-decoration: none;
}
a:visited {
color: $link_color;
color: var(--link-color);
text-decoration: none;
}
a:hover {
color: $link_hover_color;
color: var(--link-hover-color);
text-decoration: none;
}
a:active {
color: $link_color;
color: var(--link-color);
text-decoration: none;
}

261
app/javascript/src/styles/base/040_colors.css Normal file
View File

@@ -0,0 +1,261 @@
:root {
--body-background-color: white;
--hint-color: #666;
--translation-note-color: gray;
--info-color: #AAA;
--link-color: hsl(213, 100%, 50%);
--link-hover-color: hsl(213, 100%, 75%);
--note-highlight-color: var(--preview-pending-color);
--subnav-menu-background-color: #F5F5FF;
--responsive-menu-background-color: var(--link-hover-color);
--responsive-sidebar-submit-button-background-color: #EEE;
--responsive-sidebar-submit-button-border: 1px solid rgb(197, 197, 197);
--responsive-form-input-border: 1px solid #c5c5c5;
--user-upgrade-gold-background-color: #FFF380;
--user-upgrade-platinum-background-color: #EEE;
--user-upgrade-table-row-hover-background-color: #FEF;
--user-upgrade-cost-footnote-color: gray;
--table-header-border: 2px solid #666;
--table-header-text-color: #333;
--table-row-border: 1px solid #CCC;
--table-row-hover-background: hsl(213, 100%, 95%);
--table-even-row-background: #FAFAFA;
--preview-pending-color: #00F;
--preview-flagged-color: #F00;
--preview-deleted-color: black;
--preview-has-children-color: #0F0;
--preview-has-parent-color: #CC0;
--preview-icon-color: white;
--preview-icon-background: rgba(0, 0, 0, 0.5);
--modqueue-sample-warning-color: hsl(0, 100%, 90%); // light red
--modqueue-quality-warning-color: hsl(50, 100%, 90%); // light yellow
--modqueue-postive-score-background-color: rgb(230, 255, 230);
--modqueue-negative-score-background-color: rgb(255, 230, 230);
--uploads-dropzone-border: 4xp dashed #DDD;
--uploads-dropzone-placeholder-color: #333;
--uploads-dropzone-error-border-color: hsl(0, 43%, 61%);
--uploads-dropzone-error-background-color: hsl(0, 43%, 91%);
--uploads-dropzone-success-border-color: hsl(103, 44%, 59%);
--uploads-dropzone-success-background-color: hsl(103, 44%, 89%);
--uploads-dropzone-progress-border: 1px solid #CCC;
--uploads-dropzone-progress-background-color: 1px solid #CCC;
--forum-new-topic-color: red;
--forum-locked-topic-color: gray;
--forum-level-restricted-topic-color: #F66;
--forum-deleted-topic-color: gray;
--forum-info-color: #AAA;
--forum-vote-up-color: green;
--forum-vote-meh-color: goldrenrod;
--forum-vote-down-color: red;
--forum-post-box-shadow: 1px 1px 2px #AAA;
--forum-post-border: 1px solid #AAA;
--forum-post-highlight-background-color: #FFC;
--comment-sticky-background-color: var(--subnav-menu-background-color);
--post-tooltip-border-color: #767676;
--post-tooltip-header-background-color: var(--subnav-menu-background-color);
--post-tooltip-info-color: #555;
--post-tooltip-inactive-color: #777;
--post-tooltip-scrollbar-background: #999999;
--post-tooltip-scrollbar-border: 0px none white;
--post-tooltip-scrollbar-thumb-color: #AAAAAA;
--post-tooltip-scrollbar-track-background: #EEEEEE;
--post-tooltip-scrollbar-track-border: 0px none white;
--iqdb-preview-border: 1px solid lightgrey;
--preview-current-post-background: rgba(0, 0, 0, 0.1);
--error-color: hsl(0, 100%, 95%); // light red
--error-hover-color: hsl(0, 100%, 90%);
--success-color: hsl(120, 100%, 95%); // light green
--success-hover-color: hsl(120, 100%, 90%);
--autocomplete-background-color: #F0F0F0;
--autocomplete-border-color: #C5C5C5;
--diff-list-added-color: green;
--diff-list-removed-color: red;
--diff-list-obsolete-added-color: darkGreen;
--diff-list-obsolete-removed-color: darkRed;
--wiki-page-versions-diff-del-background: #FCC;
--wiki-page-versions-diff-ins-background: #CFC;
--wiki-page-versions-version-color: #AAA;
--post-parent-notice-border-color: #C0FCC0;
--post-parent-notice-background: #D8FCD9;
--post-child-notice-border-color: #FCFCC0;
--post-child-notice-background: #FBFCD8;
--post-pending-notice-border-color: #C0C0FC;
--post-pending-notice-background: #D8D8FC;
--post-flagged-notice-border-color: #FCC0C0;
--post-flagged-notice-background: #FCD9D8;
--post-deleted-notice-border-color: #FF8C8C;
--post-deleted-notice-background: #FFA7A5;
--post-appealed-notice-border-color: #C0ECFC;
--post-appealed-notice-background: #D8F2FC;
--post-resized-notice-border-color: #E4C0FC;
--post-resized-notice-background: #EED8FC;
--post-nav-notice-background: #EEE;
--post-nav-notice-border: 1px solid #AAA;
--post-seq-nav-hover-background: rgb(250, 250, 250);
--post-artist-commentary-container-background: #F8F8F8;
--post-artist-commentary-container-border: 1px solid #CCC;
--post-artist-commentary-disabled-color: gray;
--note-body-background: #FFE;
--note-body-border: 1px solid black;
--note-box-border: 1px solid white;
--note-box-background: transparent;
--note-box-inner-border: 1px solid black;
--unsaved-note-box-inner-border: 1px solid red;
--note-preview-border: 1px solid red;
--note-preview-background: white;
--note-highlight-color: blue;
--note-tn-color: gray;
--post-events-resolved-background: #DDD;
--post-events-unresolved-background: white;
--user-name-change-requests-positive-background: #DDFFDD;
--user-name-change-requests-negative-background: #FFDDDD;
--series-pool-color: #A0A;
--series-pool-hover-color: #B6B;
--collection-pool-color: var(--general-tag-color);
--collection-pool-hover-color: var(--general-tag-hover-color);
--profile-page-header-color: #333;
--settings-page-active-tab-color: black;
--fetch-source-data-border-color: #666;
--post-mode-menu-view-background: white;
--post-mode-menu-edit-background: #5C5;
--post-mode-menu-tag-script-background: #D6D;
--post-mode-menu-add-fav-background: #FFA;
--post-mode-menu-remove-fav-background: #FFA;
--post-mode-menu-vote-up-background: #AFA;
--post-mode-menu-vote-down-background: #FAA;
--post-mode-menu-lock-rating-background: #AA3;
--post-mode-menu-lock-note-background: #3AA;
--post-mode-menu-approve-background: #48C;
--post-mode-menu-translation-background: #5CD;
--post-mode-menu-ban-background: #F33;
--tag-count-color: #CCC;
--low-post-count-color: red;
--tag-count-indicator-frown-color: red;
--tag-count-indicator-meh-color: darkkhaki;
--tag-count-indicator-smile-color: green;
--remove-favorite-button: deeppink;
--ugoira-seek-slider-background: #EEE;
--ugoira-seek-slider-progressbar-background: white;
// used for "(deleted)" messages
--inactive-color: #AAA;
// used for "page N" links in /forum_topics and /pools
--last-page-link-color: #666;
--keyboard-shortcut-color: white;
--keyboard-shortcut-background-color: #333;
// XXX unused?
--error-color: red;
--error-message-color: #A00;
--new-artist-color: #A00;
--bulk-update-request-approved-color: green;
--bulk-update-request-failed-color: red;
--dmail-preview-border-color: #CCC;
--notice-background: #FFFBBF;
--notice-border: 1px solid #CCC999;
--sign-in-link-color: #E00;
--search-box-button-color: white;
--sidebar-submit-button-color: #EEE;
--footer-border: 1px solid #EEE;
--jquery-ui-button-border: 1px solid darkgrey;
--jquery-ui-button-background: #f6f6f6;
--jquery-ui-button-hover-background: #fefefe;
--jquery-ui-button-hover-box-shadow: grey;
--jquery-ui-state-error-background: #FDDFDE;
--jquery-ui-state-error-border: 1px solid #FBC7C6;
--jquery-ui-state-highlight-background: #FDF5D9;
--jquery-ui-state-highlight-border: 1px solid #FCEEC1;
--jquery-ui-state-highlight-color: #363636;
--jquery-ui-dialog-box-shadow: 2px 2px 1px grey;
--dtext-blockquote-border: 1px solid #666;
--dtext-blockquote-background: #EEE;
--dtext-code-background: #EEE;
--dtext-expand-border: 1px inset #666;
--dtext-spoiler-color: black;
--dtext-spoiler-background-color: black;
--dtext-spoiler-hover-color: white;
--wiki-page-other-name-background-color: #EEE;
--user-feedback-positive-background-color: #DDFFDD !important;
--user-feedback-negative-background-color: #FFDDDD !important;
--user-feedback-neutral-background-color: #FFFFFF !important;
--paginator-ellipsis-color: grey;
--paginator-arrow-background-color: white;
--paginator-arrow-color: var(--link-color);
--general-tag-color: var(--link-color);
--general-tag-hover-color: var(--link-hover-color);
--character-tag-color: #0A0;
--character-tag-hover-color: #6B6;
--copyright-tag-color: #A0A;
--copyright-tag-hover-color: #B6B;
--artist-tag-color: #A00;
--artist-tag-hover-color: #B66;
--meta-tag-color: #F80;
--meta-tag-hover-color: #FA6;
--selected-tag-color: white;
--user-admin-color: red;
--user-moderator-color: orange;
--user-builder-color: #6633FF;
--user-platinum-color: gray;
--user-gold-color: blue;
--user-member-color: auto;
--news-updates-background: #EEE;
--news-updates-border: 2px solid #666;
--related-tags-container-background: #EEE;
--selected-related-tag-background-color: var(--link-color);
--selected-related-tag-color: white;
}

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

@@ -1,14 +1,12 @@
@import "../base/000_vars.scss";
.ui-autocomplete {
font-size: 0.9em;
.ui-state-active {
border: none;
margin: 0 -1px;
background-color: #F0F0F0;
border-left: 1px solid #C5C5C5;
border-right: 1px solid #C5C5C5;
background-color: var(--autocomplete-background-color);
border-left: 1px solid var(--autocomplete-border-color);
border-right: 1px solid var(--autocomplete-border-color);
}
.ui-menu-item-wrapper {

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

@@ -1,5 +1,3 @@
@import "../base/000_vars.scss";
#blacklist-box {
display: none;
margin-bottom: 1em;

16
app/javascript/src/styles/common/diffs.scss
View File

@@ -1,43 +1,43 @@
.diff-list {
.added, .added a {
color: green;
color: var(--diff-list-added-color);
text-decoration: none;
margin-right: 0.5em;
}
.added.obsolete, .added.obsolete a {
color: darkGreen;
color: var(--diff-list-obsolete-added-color);
}
.removed, .removed a {
color: red;
color: var(--dif-list-removed-color);
text-decoration: line-through;
margin-right: 0.5em;
}
.removed.obsolete, .removed.obsolete a {
color: darkRed;
color: var(--diff-list-obsolete-removed-color);
}
}
.diff-list {
ins, ins a {
color: green;
color: var(--diff-list-added-color);
text-decoration: none;
margin-right: 0.5em;
}
del, del a {
color: red;
color: var(--diff-list-removed-color);
text-decoration: line-through;
margin-right: 0.5em;
}
ins.obsolete, ins.obsolete a {
color: darkGreen;
color: var(--diff-list-obsolete-added-color);
}
del.obsolete, del.obsolete a {
color: darkRed;
color: var(--diff-list-obsolete-removed-color);
}
}

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

@@ -55,18 +55,25 @@ div.prose {
font-size: 1.2em;
margin: 0.5em 0;
padding: 0.5em 1em;
background: #EEE;
background: var(--dtext-code-background-color);
white-space: pre-wrap;
}
blockquote {
margin-bottom: 1em;
padding: 1em 1em 0.2em;
border: var(--dtext-blockquote-border);
background: var(--dtext-blockquote-background);
}
code {
font-family: monospace;
background: #EEE;
background: var(--dtext-code-background);
}
div.expandable {
margin-bottom: 1em;
border: 1px inset #666;
border: var(--dtext-expand-border);
}
div.expandable-header {
@@ -81,7 +88,7 @@ div.prose {
div.expandable-content {
display: none;
padding: 0.4em;
border-top: 1px solid #666;
border-top: 1px solid var(--dtext-expand-border-color);
> :last-child {
margin-bottom: 0;

18
app/javascript/src/styles/common/inline.scss
View File

@@ -1,26 +1,24 @@
@import "../base/000_vars.scss";
span.error {
display: block;
font-weight: bold;
color: red;
color: var(--error-color);
}
span.link {
color: $link_color;
color: var(--link-color);
cursor: pointer;
}
span.count {
color: #CCC;
color: var(--tag-count-color);
margin-left: 0.5em;
}
kbd.key {
background: #333;
border: 1px solid #333;
background: var(--keyboard-shortcut-background-color);
border: 1px solid var(--keyboard-shortcut-background-color);
padding: 1px 6px;
color: white;
color: var(--keyboard-shortcut-color);
/* width: 1em;*/
text-align: center;
display: inline-block;
@@ -28,9 +26,9 @@ kbd.key {
}
span.inactive {
color: #AAA;
color: var(--inactive-color);
}
td a.last-page {
color: #666;
color: var(--last-page-link-color);
}

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

@@ -9,11 +9,11 @@
}
.ui-widget-content a {
color: $link_color;
color: var(--link-color);
}
.ui-widget-content a:hover {
color: $link_hover_color;
color: var(--link-hover-color);
}
div.ui-dialog {
@@ -21,7 +21,7 @@ div.ui-dialog {
overflow: visible;
font-size: 1em;
z-index: 999 !important;
box-shadow: 2px 2px 1px grey;
box-shadow: var(--jquery-ui-dialog-box-shadow);
padding: 0;
.ui-dialog-titlebar {
@@ -36,33 +36,29 @@ div.ui-dialog {
}
.ui-state-highlight {
border: 1px solid #FCEEC1;
background: #FDF5D9;
color: #363636;
border: var(--jquery-ui-state-highlight-border);
background: var(--jquery-ui-state-highlight-background);
color: var(--jquery-ui-state-highlight-color);
a, a:active, a:visited {
color: $link_color;
color: var(--link-color);
}
a:hover {
color: $link_hover_color;
color: var(--link-hover-color);
}
}
.ui-state-error {
border: 1px solid #FBC7C6;
background: #FDDFDE;
border: var(--jquery-ui-state-error-border);
background: var(--jquery-ui-state-error-background);
}
.ui-button {
margin: 0;
padding: 0.25em 1em;
background-color: #f6f6f6;
border-top: 1px solid silver;
border-left: 1px solid silver;
border-bottom: 1px solid darkgrey;
border-right: 1px solid darkgrey;
background: linear-gradient(#f6f6f6, #e5e5e5);
border: var(--jquery-ui-button-border);
background: var(--jquery-ui-button-background);
&.sub {
font-size: 90%;
@@ -75,8 +71,8 @@ div.ui-dialog {
}
.ui-button:hover {
box-shadow: 1px 1px grey;
background: linear-gradient(#fefefe, #f0f0f0);
box-shadow: var(--jquery-ui-button-hover-box-shadow);
background: var(--jquery-ui-button-hover-background);
}
.ui-front {

14
app/javascript/src/styles/common/main_layout.scss
View File

@@ -6,12 +6,12 @@ div#search {
div#search-box button {
-webkit-appearance: button;
border: 1px solid $link_color;
background-color: $link_color;
color: #FFF;
border: 1px solid var(--link-color);
background-color: var(--link-color);
color: var(--search-box-button-color);
&:hover, &:focus {
border: 1px solid $link_hover_color;
background-color: $link_hover_color;
border: 1px solid var(--link-hover-color);
background-color: var(--link-hover-color);
}
}
@@ -55,7 +55,7 @@ div#page {
button[type=submit] {
padding: 2px 6px;
background: #EEE;
background: var(--sidebar-submit-button-color);
}
#search-box button[type=submit] {
@@ -84,7 +84,7 @@ footer#page-footer {
margin-top: 1em;
text-align: center;
padding: 1em 0 1em;
border-top: 1px solid #EEE;
border-top: var(--footer-border);
}
div.clearfix {

4
app/javascript/src/styles/common/news.scss
View File

@@ -1,7 +1,7 @@
div#news-updates {
padding: 5px;
background: #EEE;
border-bottom: 2px solid #666;
background: var(--news-updates-background);
border-bottom: var(--news-updates-border);
overflow: hidden;
font-size: 0.8em;

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

@@ -4,7 +4,7 @@ div.error-messages {
h1 {
font-size: 1em;
color: #A00;
color: var(--error-message-color);
}
}
@@ -17,8 +17,8 @@ div#notice {
z-index: 100;
&:not(.ui-state-error) {
background-color: #FFFBBF;
border: 1px solid #CCC999;
background: var(--notice-background);
border: var(--notice-border);
}
}

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

@@ -1,5 +1,3 @@
@import "../base/000_vars.scss";
#maintoggle {
display: none;
}
@@ -12,7 +10,7 @@ header#top {
menu {
margin-top: -2px;
background: $menu_color;
background: var(--subnav-menu-background-color);
padding: 6px 20px;
form {
@@ -39,13 +37,13 @@ header#top {
background: none;
li.current a {
background: $menu_color;
background: var(--subnav-menu-background-color);
font-weight: bold;
}
li#nav-sign-in a {
font-weight: bold;
color: #e00;
color: var(--sign-in-link-color);
}
li.forum-updated a {

12
app/javascript/src/styles/common/paginator.scss
View File

@@ -1,5 +1,3 @@
@import "../base/000_vars.scss";
div.paginator {
display: block;
padding: 2em 0 1em 0;
@@ -13,17 +11,17 @@ div.paginator {
}
&.more {
color: grey;
color: var(--paginator-ellipsis-color);
}
a.arrow:hover {
background: white;
color: $link_color;
background: var(--paginator-arrow-background-color);
color: var(--paginator-arrow-color);
}
a:hover {
background: $link_color;
color: white;
background: var(--paginator-arrow-color);
color: var(--paginator-arrow-background-color);
}
span {

18
app/javascript/src/styles/common/spoiler.scss
View File

@@ -1,16 +1,8 @@
.spoiler {
color: black;
background: black;
.spoiler, .spoiler a {
color: var(--dtext-spoiler-color);
background: var(--dtext-spoiler-background-color);
}
.spoiler a {
color: black;
}
.spoiler:hover {
color: white;
}
.spoiler:hover a{
color: white;
.spoiler:hover, .spoiler:hover a {
color: var(--dtext-spoiler-hover-color);
}

12
app/javascript/src/styles/common/tables.scss
View File

@@ -1,5 +1,3 @@
@import "../base/000_vars.scss";
table.striped {
td, th {
padding: 4px 6px;
@@ -7,10 +5,10 @@ table.striped {
tbody {
tr {
border-bottom: 1px solid #CCC;
border-bottom: var(--table-row-border);
&:hover {
background-color: $highlight_color;
background: var(--table-row-hover-background);
}
}
}
@@ -21,18 +19,18 @@ table.striped {
thead {
tr {
border-bottom: 2px solid #666;
border-bottom: var(--table-header-border);
}
th {
font-weight: bold;
text-align: left;
color: #333;
color: var(--table-header-text-color);
}
}
tr:nth-child(even) {
background-color: #FAFAFA;
background: var(--table-even-row-background);
}
}

6
app/javascript/src/styles/common/tags.scss.erb
View File

@@ -1,5 +1,3 @@
@import "../base/000_vars.scss";
<% TagCategory.css_mapping.each do |category,cssmap| %>
.category-<%= category %> a,
a.tag-type-<%= category %>,
@@ -16,7 +14,7 @@
}
&.selected {
color: white;
color: var(--selected-tag-color);
}
}
@@ -32,7 +30,7 @@
}
&.selected {
color: white;
color: var(--selected-tag-color);
}
}
<% end %>

16
app/javascript/src/styles/common/user_styles.scss
View File

@@ -1,27 +1,23 @@
a.user-admin.with-style {
color: red;
color: var(--user-admin-color);
}
a.user-moderator.with-style {
color: orange;
}
a.user-contributor.with-style {
color: purple;
color: var(--user-moderator-color);
}
a.user-builder.with-style {
color: #6633FF;
color: var(--user-builder-color);
}
a.user-platinum.with-style {
color: gray;
color: var(--user-platinum-color);
}
a.user-gold.with-style {
color: #0000FF;
color: var(--user-gold-color);
}
a.user-member.with-style {
color: auto;
color: var(--user-member-color);
}

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

@@ -3,7 +3,7 @@
div#c-artists, div#excerpt {
span.new-artist {
font-weight: bold;
color: #A00;
color: var(--new-artist-color);
}
ul ul {

10
app/javascript/src/styles/specific/bans.scss
View File

@@ -1,19 +1,17 @@
@import "../base/000_vars.scss";
#c-bans #a-index {
tr[data-expired="true"] {
background-color: $success_color !important;
background-color: var(--success-color) !important;
&:hover {
background-color: darken($success_color, 5%) !important;
background-color: var(--success-hover-color) !important;
}
}
tr[data-expired="false"] {
background-color: $error_color !important;
background-color: var(--error-color) !important;
&:hover {
background-color: darken($error_color, 5%) !important;
background-color: var(--error-hover-color) !important;
}
}
}

6
app/javascript/src/styles/specific/bulk_update_requests.scss
View File

@@ -1,9 +1,9 @@
#c-bulk-update-requests {
s.approved {
color: green;
color: var(--bulk-update-request-approved-color);
}
s.failed {
color: red;
color: var(--bulk-update-request-rejected-color);
}
}
}

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

@@ -12,7 +12,7 @@ div.comments-for-post {
padding: 5px;
&[data-is-sticky="true"] {
background: $menu_color;
background: var(--comment-sticky-background-color);
}
&[data-is-voted="true"] {

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

@@ -7,7 +7,7 @@ div#c-dmails {
div#preview {
margin: 1em 0;
border: 1px solid #CCC;
border: 1px solid var(--dmail-preview-border-color);
padding: 1em;
width: 40em;

18
app/javascript/src/styles/specific/dropzone.scss
View File

@@ -1,5 +1,5 @@
#filedropzone {
border: 4px dashed #DDD;
border: var(--uploads-dropzone-border);
padding: 0;
min-height: 100px;
display: flex;
@@ -9,18 +9,18 @@
.placeholder {
font-style: italic;
color: #333;
color: var(--uploads-dropzone-place-holder-color);
height: 100%;
}
&.error {
border-color: darken(#f2dede, 30%);
background-color: #f2dede;
border-color: var(--uploads-dropzone-error-border-color);
background-color: var(--uploads-dropzone-error-background-color);
}
&.success {
border-color: darken(#dff0d8, 30%);
background-color: #dff0d8;
border-color: var(--uploads-dropzone-success-border-color);
background-color: var(--uploads-dropzone-success-background-color);
}
}
@@ -31,11 +31,11 @@
.dz-progress {
height: 20px;
width: 300px;
border: 1px solid #CCC;
background-color: var(--uploads-dropzone-progress-border);
.dz-upload {
background-color: #F5F5FF;
background-color: var(--uploads-dropzone-progress-background-color);
display: block;
height: 20px;
}
}
}

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: #EEE;
background: var(--dtext-code-background-color);
padding: 1em;
margin-bottom: 1em;
}

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

@@ -1,5 +1,3 @@
@import "../base/000_vars.scss";
div#c-explore-posts {
header {
text-align: center;

26
app/javascript/src/styles/specific/forum.scss
View File

@@ -1,32 +1,28 @@
div.list-of-forum-posts {
article {
border: 1px solid #AAA;
border: var(--forum-post-border);
margin: 1em 0em;
word-wrap: break-word;
box-shadow: 1px 1px 2px #AAA;
box-shadow: var(--forum-post-box-shadow);
a.voted {
font-weight: bold;
}
span.desc {
color: grey;
}
&:target {
background-color: #FFC;
background-color: var(--forum-post-highlight-background-color);
}
.vote-score-up {
color: green;
color: var(--forum-vote-up-color);
}
.vote-score-meh {
color: goldenrod;
color: var(--forum-vote-meh-color);
}
.vote-score-down {
color: red;
color: var(--forum-vote-down-color);
}
div.author {
@@ -64,21 +60,21 @@ div.list-of-forum-posts {
div#c-forum-topics {
span.info {
color: #AAA;
color: var(--forum-info-color);
}
span.new {
font-size: 80%;
color: red;
color: var(--forum-new-topic-color);
margin-right: 0.5em;
}
span.locked-topic {
color: gray;
color: var(--forum-locked-topic-color);
}
span.level-topic {
color: #f66;
color: var(--forum-level-restricted-topic-color);
font-weight: bold;
}
@@ -91,6 +87,6 @@ div#c-forum-topics {
tr[data-topic-is-deleted="true"] .forum-post-topic-title::after,
tr[data-is-deleted="true"] .forum-post-excerpt::after {
content: " (deleted)";
color: gray;
color: var(--forum-deleted-topic-color);
}
}

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

@@ -3,7 +3,7 @@ div#c-iqdb-queries {
article.post-preview {
height: 180px;
width: 180px;
border: lightgrey solid 1px;
border: var(--iqdb-preview-border);
img {
margin-top: 10px;

8
app/javascript/src/styles/specific/mod_queue.scss.erb
View File

@@ -6,11 +6,11 @@ div#c-moderator-post-queues {
overflow: hidden;
&.post-pos-score {
background: rgb(230, 255, 230);
background: var(--modqueue-positive-score-background-color);
}
&.post-neg-score {
background: rgb(255, 230, 230);
background: var(--modqueue-negative-score-background-color);
}
aside {
@@ -27,13 +27,13 @@ div#c-moderator-post-queues {
<% Danbooru.config.modqueue_quality_warning_tags.each do |tag| %>
&[data-tags~="<%= tag %>"] {
background-color: $preview_quality_warning_color;
background-color: var(--modqueue-quality-warning-color);
}
<% end %>
<% Danbooru.config.modqueue_sample_warning_tags.each do |tag| %>
&[data-tags~="<%= tag %>"] {
background-color: $preview_sample_warning_color;
background-color: var(--modqueue-sample-warning-color);
}
<% end %>

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

@@ -1,13 +1,11 @@
@import "../base/000_vars.scss";
div#note-container {
position: absolute;
z-index: 50;
div.note-body {
position: absolute;
border: 1px solid black;
background: #FFE;
border: var(--note-body-border);
background: var(--note-body-background);
min-width: 140px;
min-height: 1em;
line-height: normal;
@@ -62,22 +60,22 @@ div#note-container {
div.note-box {
position: absolute;
border: 1px solid white;
border: var(--note-box-border);
min-width: 5px;
min-height: 5px;
width: 100px;
height: 100px;
cursor: move;
background: transparent;
background: var(--note-box-background);
line-height: normal;
div.note-box-inner-border {
border: 1px solid black;
background: #FFE;
border: var(--note-box-inner-border);
background: var(--note-body-background);
}
div.note-box-inner-border.unsaved {
border: 1px solid red;
border: var(--unsaved-note-box-inner-border);
}
&.embedded {
@@ -96,17 +94,17 @@ div#note-container {
}
&.note-box-highlighted {
outline: 2px solid $note_highlight_color;
outline: 2px solid var(--note-highlight-color);
}
}
}
div#note-preview {
position: absolute;
border: 1px solid red;
border: var(--note-preview-border);
opacity: 0.6;
display: none;
background: white;
background: var(--note-preview-background);
}
div.note-edit-dialog {

8
app/javascript/src/styles/specific/pools.scss
View File

@@ -1,18 +1,18 @@
@import "../base/000_vars.scss";
a.pool-category-series, .pool-category-series a {
color: #A0A;
color: var(--series-pool-color);
&:hover {
color: #B6B;
color: var(--series-pool-hover-color);
}
}
a.pool-category-collection, .pool-category-collection a {
color: $link_color;
color: var(--collection-pool-color);
&:hover {
color: $link_hover_color;
color: var(--collection-pool-hover-color);
}
}

4
app/javascript/src/styles/specific/post_events.scss
View File

@@ -1,11 +1,11 @@
div#c-post-events {
#a-index {
tr.resolved-true {
background: #DDD;
background: var(--post-events-resolved-background);
}
tr.resolved-false {
background: #FFF;
background: var(--post-events-unresolved-background);
}
}
}

4
app/javascript/src/styles/specific/post_flags.scss
View File

@@ -1,9 +1,9 @@
div#c-post-flags {
tr.resolved-true {
background: #DDD !important;
background: var(--post-events-resolved-background) !important;
}
tr.resolved-false {
background: #FFF !important;
background: var(--post-events-unresolved-background) !important;
}
}

26
app/javascript/src/styles/specific/post_mode_menu.scss
View File

@@ -1,51 +1,51 @@
body.mode-view {
background-color: #FFF;
background-color: var(--post-mode-menu-view-background);
}
body.mode-edit {
background-color: #5C5;
background-color: var(--post-mode-menu-edit-background);
}
body.mode-tag-script {
background-color: #D6D;
background-color: var(--post-mode-menu-tag-script-background);
}
body.mode-add-fav {
background-color: #FFA;
background-color: var(--post-mode-menu-add-fav-background);
}
body.mode-remove-fav {
background-color: #FFA;
background-color: var(--post-mode-menu-remove-fav-background);
}
body.mode-vote-up {
background-color: #AFA;
background-color: var(--post-mode-menu-vote-up-background);
}
body.mode-vote-down {
background-color: #FAA;
background-color: var(--post-mode-menu-vote-down-background);
}
body.mode-lock-rating {
background-color: #AA3;
background-color: var(--post-mode-menu-lock-rating-background);
}
body.mode-lock-note {
background-color: #3AA;
background-color: var(--post-mode-menu-lock-note-background);
}
body.mode-approve {
background-color: #48C;
background-color: var(--post-mode-menu-approve-background);
}
body.mode-translation {
background-color: #5CD;
background-color: var(--post-mode-menu-translation-background);
}
body.mode-ban {
background-color: #F33;
background-color: var(--post-mode-menu-ban-background);
}
#page, #top, #page-footer {
background-color: white;
background-color: var(--body-background-color);
}

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

@@ -1,5 +1,3 @@
@import "../base/000_vars.scss";
$tooltip-line-height: 16px;
$tooltip-body-height: $tooltip-line-height * 6; // 6 lines high.
$tooltip-width: 164px * 3 - 10; // 3 thumbnails wide.
@@ -16,31 +14,31 @@ $tooltip-width: 164px * 3 - 10; // 3 thumbnails wide.
}
&::-webkit-scrollbar-thumb {
background: #999999;
border: 0px none #FFFFFF;
background: var(--post-tooltip-scrollbar-background);
border: none;
border-radius: 0px;
}
&::-webkit-scrollbar-thumb:hover {
background: #AAAAAA;
background: var(--post-tooltip-scrollbar-thumb-color);
}
&::-webkit-scrollbar-thumb:active {
background: #AAAAAA;
background: var(--post-tooltip-scrollbar-thumb-color);
}
&::-webkit-scrollbar-track {
background: #EEEEEE;
border: 0px none #ffffff;
background: var(--post-tooltip-scrollbar-track-background);
border: none;
border-radius: 0px;
}
&::-webkit-scrollbar-track:hover {
background: #EEEEEE;
background: var(--post-tooltip-scrollbar-track-background);
}
&::-webkit-scrollbar-track:active {
background: #EEEEEE;
background: var(--post-tooltip-scrollbar-track-background);
}
&::-webkit-scrollbar-corner {
@@ -55,7 +53,7 @@ $tooltip-width: 164px * 3 - 10; // 3 thumbnails wide.
box-sizing: border-box;
font-size: 11px;
line-height: $tooltip-line-height;
border-color: #767676;
border-color: var(--post-tooltip-border-color);
.qtip-content {
padding: 0;
@@ -75,7 +73,7 @@ $tooltip-width: 164px * 3 - 10; // 3 thumbnails wide.
}
.post-tooltip-header {
background-color: $menu_color;
background-color: var(--post-tooltip-header-background-color);
display: flex;
white-space: nowrap;
overflow: hidden;
@@ -100,14 +98,14 @@ $tooltip-width: 164px * 3 - 10; // 3 thumbnails wide.
.post-tooltip-info {
margin-left: 0.5em;
color: #555;
color: var(--post-tooltip-info-color);
font-size: 10px;
}
}
&:not(:hover) {
a, span {
color: #777 !important;
color: var(--post-tooltip-inactive-color) !important;
}
}

4
app/javascript/src/styles/specific/post_versions.scss
View File

@@ -1,9 +1,7 @@
@import "../base/000_vars.scss";
div#c-post-versions {
div#a-index {
tr.hilite {
background: $highlight_color;
background: var(--table-row-hover-color);
}
}
}

84
app/javascript/src/styles/specific/posts.scss
View File

@@ -76,78 +76,78 @@ article.post-preview {
}
&.post-status-has-children img {
border-color: $preview_has_children_color;
border-color: var(--preview-has-children-color);
}
&.post-status-has-parent img {
border-color: $preview_has_parent_color;
border-color: var(--preview-has-parent-color);
}
&.post-status-has-children.post-status-has-parent img {
border-color: $preview_has_children_color $preview_has_parent_color $preview_has_parent_color $preview_has_children_color;
border-color: var(--preview-has-children-color) var(--preview-has-parent-color) var(--preview-has-parent-color) var(--preview-has-children-color);
}
&.post-status-deleted img {
border-color: $preview_deleted_color;
border-color: var(--preview-deleted-color);
}
&.post-status-has-children.post-status-deleted img {
border-color: $preview_has_children_color $preview_deleted_color $preview_deleted_color $preview_has_children_color;
border-color: var(--preview-has-children-color) var(--preview-deleted-color) var(--preview-deleted-color) var(--preview-has-children-color);
}
&.post-status-has-parent.post-status-deleted img {
border-color: $preview_has_parent_color $preview_deleted_color $preview_deleted_color $preview_has_parent_color;
border-color: var(--preview-has-parent-color) var(--preview-deleted-color) var(--preview-deleted-color) var(--preview-has-parent-color);
}
&.post-status-has-children.post-status-has-parent.post-status-deleted img {
border-color: $preview_has_children_color $preview_deleted_color $preview_deleted_color $preview_has_parent_color;
border-color: var(--preview-has-children-color) var(--preview-deleted-color) var(--preview-deleted-color) var(--preview-has-parent-color);
}
/* Pending and flagged posts have blue borders (except in the modqueue). */
&.post-status-pending:not(.mod-queue-preview) img,
&.post-status-flagged:not(.mod-queue-preview) img {
border-color: $preview_pending_color;
border-color: var(--preview-pending-color);
}
&.post-status-has-children.post-status-pending:not(.mod-queue-preview) img,
&.post-status-has-children.post-status-flagged:not(.mod-queue-preview) img {
border-color: $preview_has_children_color $preview_pending_color $preview_pending_color $preview_has_children_color;
border-color: var(--preview-has-children-color) var(--preview-pending-color) var(--preview-pending-color) var(--preview-has-children-color);
}
&.post-status-has-parent.post-status-pending:not(.mod-queue-preview) img,
&.post-status-has-parent.post-status-flagged:not(.mod-queue-preview) img {
border-color: $preview_has_parent_color $preview_pending_color $preview_pending_color $preview_has_parent_color;
border-color: var(--preview-has-parent-color) var(--preview-pending-color) var(--preview-pending-color) var(--preview-has-parent-color);
}
&.post-status-has-children.post-status-has-parent.post-status-pending:not(.mod-queue-preview) img,
&.post-status-has-children.post-status-has-parent.post-status-flagged:not(.mod-queue-preview) img {
border-color: $preview_has_children_color $preview_pending_color $preview_pending_color $preview_has_parent_color;
border-color: var(--preview-has-children-color) var(--preview-pending-color) var(--preview-pending-color) var(--preview-has-parent-color);
}
}
/* Flagged posts have red borders for approvers. */
body[data-user-can-approve-posts="true"] .post-preview {
&.post-status-flagged img {
border-color: $preview_flagged_color;
border-color: var(--preview-flagged-color);
}
&.post-status-has-children.post-status-flagged img {
border-color: $preview_has_children_color $preview_flagged_color $preview_flagged_color $preview_has_children_color;
border-color: var(--preview-has-children-color) var(--preview-flagged-color) var(--preview-flagged-color) var(--preview-has-children-color);
}
&.post-status-has-parent.post-status-flagged img {
border-color: $preview_has_parent_color $preview_flagged_color $preview_flagged_color $preview_has_parent_color;
border-color: var(--preview-has-parent-color) var(--preview-flagged-color) var(--preview-flagged-color) var(--preview-has-parent-color);
}
&.post-status-has-children.post-status-has-parent.post-status-flagged img {
border-color: $preview_has_children_color $preview_flagged_color $preview_flagged_color $preview_has_parent_color;
border-color: var(--preview-has-children-color) var(--preview-flagged-color) var(--preview-flagged-color) var(--preview-has-parent-color);
}
}
.post-preview.current-post {
background-color: rgba(0,0,0,0.1);
background-color: var(--preview-current-post-background);
}
#has-parent-relationship-preview, #has-children-relationship-preview {
@@ -163,12 +163,12 @@ body[data-user-can-approve-posts="true"] .post-preview {
}
.post-count {
color: #CCC;
color: var(--tag-count-color);
margin-left: 0.2em;
}
.low-post-count {
color: red;
color: var(--low-post-count-color);
}
div#c-posts {
@@ -186,7 +186,7 @@ div#c-posts {
}
#remove-fav-button i.fa-heart {
color: deeppink;
color: var(--remove-favorite-button);
}
#remove-fav-button.animate i {
@@ -206,10 +206,10 @@ div#c-posts {
margin-top: 0.5em;
float: right;
overflow: visible;
background: #EEE;
background: var(--ugoira-seek-slider-background);
.ui-progressbar-value {
background: white;
background: var(--ugoira-seek-slider-progressbar-background);
}
}
@@ -251,46 +251,46 @@ div#c-posts {
}
&.notice-parent {
border-color: #C0FCC0;
background: #D8FCD9;
border-color: var(--post-parent-notice-border-color);
background: var(--post-parent-notice-background);
}
&.notice-child {
border-color: #FCFCC0;
background: #FBFCD8;
border-color: var(--post-child-notice-border-color);
background: var(--post-child-notice-background);
}
&.notice-pending {
border-color: #C0C0FC;
background: #D8D8FC;
border-color: var(--post-pending-notice-border-color);
background: var(--post-pending-notice-background);
}
&.notice-flagged {
border-color: #FCC0C0;
background: #FCD9D8;
border-color: var(--post-flagged-notice-border-color);
background: var(--post-flagged-notice-background);
}
&.notice-deleted {
border-color: #FF8C8C;
background: #FFA7A5;
border-color: var(--post-deleted-notice-border-color);
background: var(--post-deleted-notice-background);
}
&.notice-appealed {
border-color: #C0ECFC;
background: #D8F2FC;
border-color: var(--post-appealed-notice-border-color);
background: var(--post-appealed-notice-background);
}
&.notice-resized {
border-color: #E4C0FC;
background: #EED8FC;
border-color: var(--post-resized-notice-border-color);
background: var(--post-resized-notice-background);
}
}
div.nav-notice {
padding: 0.5em;
margin: 1em 0;
background: #EEE;
border: 1px solid #AAA;
background: var(--post-nav-notice-background);
border: var(--post-nav-notice-border);
position: relative;
p {
@@ -416,7 +416,7 @@ div#c-posts {
}
&:hover {
background: rgb(250, 250, 250);
background: var(--post-seq-nav-hover-background);
}
}
}
@@ -433,9 +433,9 @@ div#c-posts {
}
#artist-commentary {
border: 1px solid #CCC;
border: var(--post-artist-commentary-container-border);
border-radius: 8px;
background-color: #F8F8F8;
background: var(--post-artist-commentary-container-background);
margin-top: 1em;
padding: 0.5em;
@@ -445,7 +445,7 @@ div#c-posts {
}
.disabled {
color: gray;
color: var(--post-artist-commentary-disabled-color);
}
}
}
@@ -473,7 +473,7 @@ div#c-posts, div#c-uploads {
border-radius: 4px;
margin: 1em 0;
padding: 1em;
border: 1px solid #666;
border: 1px solid var(--fetch-source-data-border-color);
&:not(.loading) #source-info-loading { display: none; }
&.loading #source-info-content { display: none; }

8
app/javascript/src/styles/specific/related_tags.scss
View File

@@ -1,5 +1,3 @@
@import "../base/000_vars.scss";
div#related-tags-container {
&.visible a#show-related-tags-link,
&.hidden a#hide-related-tags-link,
@@ -12,7 +10,7 @@ div.related-tags {
width: 100%;
margin-bottom: 1em;
padding: 1em;
background: #EEE;
background: var(--related-tags-container-background);
overflow: auto;
border-radius: 4px;
display: flex;
@@ -52,8 +50,8 @@ div.related-tags {
}
a.selected {
background-color: $link_color;
color: white;
background: var(--selected-related-tag-background-color);
color: var(--selected-related-tag-color);
}
}
}

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

@@ -1,5 +1,3 @@
@import "../base/000_vars.scss";
div#c-sessions {
div#a-new {
label#remember-label {

8
app/javascript/src/styles/specific/tags.scss
View File

@@ -30,7 +30,7 @@ div#c-tags {
justify-self: end;
.count {
color: gray;
color: var(--tag-count-color);
text-decoration: italic;
margin-left: 0.25em;
padding-bottom: 0.2em;
@@ -42,15 +42,15 @@ div#c-tags {
}
.fa-frown {
color: red;
color: var(--tag-count-indicator-frown-color);
}
.fa-meh {
color: darkkhaki;
color: var(--tag-count-indicator-meh-color);
}
.fa-smile {
color: green;
color: var(--tag-count-indicator-smile-color);
}
}
}

6
app/javascript/src/styles/specific/user_feedback.scss
View File

@@ -1,14 +1,14 @@
div#c-user-feedbacks, div#c-moderator-dashboards div#col2 {
.feedback-category-positive {
background: #DDFFDD !important;
background: var(--user-feedback-positive-background-color);
}
.feedback-category-negative {
background: #FFDDDD !important;
background: var(--user-feedback-negative-background-color);
}
.feedback-category-neutral {
background: #FFFFFF !important;
background: var(--user-feedback-neutral-background-color);
}
#negative-policy {

4
app/javascript/src/styles/specific/user_name_change_requests.scss
View File

@@ -1,10 +1,10 @@
#c-user-name-change-requests {
.feedback-category-positive {
background: #DDFFDD !important;
background: var(--user-name-change-requests-positive-background) !important;
}
.feedback-category-negative {
background: #FFDDDD !important;
background: var(--user-name-change-requests-negative-background) !important;
}
li {

8
app/javascript/src/styles/specific/user_upgrades.scss
View File

@@ -26,11 +26,11 @@ div#c-user-upgrades {
}
colgroup#gold {
background-color: #FFF380;
background-color: var(--user-upgrade-gold-background-color);
}
colgroup#platinum {
background-color: #eee;
background-color: var(--user-upgrade-platinum-background-color);
}
td, th {
@@ -41,13 +41,13 @@ div#c-user-upgrades {
tbody {
tr:hover {
background-color: #FEF;
background-color: var(--user-upgrade-table-row-hover-background-color);
}
}
p.cost-footnote {
font-size: 80%;
color: gray;
color: var(--user-upgrade-cost-footnote-color);
margin: 0;
}
}

6
app/javascript/src/styles/specific/users.scss
View File

@@ -1,10 +1,8 @@
@import "../base/000_vars.scss";
div#c-users {
div#a-show {
div.box {
h2, h3 {
color: #333;
color: var(--profile-page-header-color);
}
margin-bottom: 2em;
@@ -57,7 +55,7 @@ div#c-users {
}
.active {
color: black;
color: var(--settings-page-active-tab-color);
}
}

6
app/javascript/src/styles/specific/wiki_page_versions.scss
View File

@@ -1,12 +1,12 @@
div#c-wiki-page-versions {
#a-diff {
del {
background: #FCC;
background: var(--wiki-page-versions-diff-del-background);
text-decoration: none;
}
ins {
background: #CFC;
background: var(--wiki-page-versions-diff-ins-background);
text-decoration: none;
}
}
@@ -19,7 +19,7 @@ div#c-wiki-page-versions {
#a-show {
span.version {
color: #AAA;
color: var(--wiki-page-versions-version-color);
}
}
}

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

@@ -9,7 +9,7 @@ div#c-wiki-pages {
}
.wiki-other-name {
background-color: #EEE;
background-color: var(--wiki-page-other-name-background-color);
padding: 3px;
border-radius: 3px;
}

15
app/javascript/src/styles/specific/z_responsive.scss
View File

@@ -38,10 +38,10 @@
button[type=submit] {
font-size: 1.2em;
background-color: #EEE;
background-color: var(--responsive-sidebar-submit-button-background-color);
height: 42px;
padding: 2px 10px;
border: 1px solid rgb(197, 197, 197);
border: var(--responsive-sidebar-submit-button-border);
}
}
@@ -74,11 +74,6 @@
top: 2vw;
right: 3vw;
font-size: 2em;
&.toggler-active {
background-color: lighten($link_color, 25%);
color: #000;
}
}
/* Make the quick search box in the navbar full width. */
@@ -94,12 +89,12 @@
input[type=text] {
vertical-align: top;
font-size: 24pt;
border: 1px solid #c5c5c5;
border: var(--responsive-form-input-border);
}
textarea {
vertical-align: top;
border: 1px solid #c5c5c5;
border: var(--responsive-form-input-border);
}
input[type=submit] {
@@ -245,7 +240,7 @@
}
header#top menu.main {
background-color: lighten($link_color, 25%);
background-color: var(--responsive-menu-background-color);
padding: 5px 10px;
}