diff --git a/app/javascript/src/styles/base/020_base.scss b/app/javascript/src/styles/base/020_base.scss
index 76a03ff52..23de8c808 100644
--- a/app/javascript/src/styles/base/020_base.scss
+++ b/app/javascript/src/styles/base/020_base.scss
@@ -1,6 +1,7 @@
@import "../base/000_vars.scss";
body {
+ color: var(--text-color);
background-color: var(--body-background-color);
font-family: $base_font_family;
font-size: 87.5%;
@@ -81,7 +82,7 @@ table tfoot {
}
.fineprint {
- color: var(--fineprint-color);
+ color: var(--muted-text-color);
font-style: italic;
font-size: 0.8em;
}
diff --git a/app/javascript/src/styles/base/040_colors.css b/app/javascript/src/styles/base/040_colors.css
index f8d67b2cd..84fdf0041 100644
--- a/app/javascript/src/styles/base/040_colors.css
+++ b/app/javascript/src/styles/base/040_colors.css
@@ -1,14 +1,23 @@
+: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);
+
--link-color: hsl(213, 100%, 50%);
--link-hover-color: hsl(213, 100%, 75%);
- --fineprint-color: #888;
-
- --error-background-color: hsl(0, 100%, 95%); // light red
- --success-background-color: hsl(120, 100%, 95%); // light green
- --warning-background-color: hsl(50, 100%, 95%); // light yellow
+ --error-background-color: hsl(0, 100%, 95%); /* light red */
+ --success-background-color: hsl(120, 100%, 95%); /* light green */
+ --warning-background-color: hsl(50, 100%, 95%); /* light yellow */
--subnav-menu-background-color: #F5F5FF;
@@ -22,7 +31,6 @@
--user-upgrade-table-row-hover-background-color: #FEF;
--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;
@@ -46,9 +54,7 @@
--uploads-dropzone-progress-bar-background-color: var(--link-hover-color);
--forum-new-topic-color: red;
- --forum-locked-topic-color: gray;
--forum-level-restricted-topic-color: #F66;
- --forum-deleted-topic-color: gray;
--forum-vote-up-color: green;
--forum-vote-meh-color: goldrenrod;
--forum-vote-down-color: red;
@@ -72,7 +78,7 @@
--autocomplete-selected-background-color: var(--subnav-menu-background-color);
--autocomplete-border: 1px solid #CCC;
- --autocomplete-arrow-color: black;
+ --autocomplete-arrow-color: var(--text-color);
--diff-list-added-color: green;
--diff-list-removed-color: red;
@@ -96,7 +102,6 @@
--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;
@@ -107,7 +112,7 @@
--note-preview-border: 1px solid red;
--note-preview-background: white;
--note-highlight-color: blue;
- --note-tn-color: gray;
+ --note-tn-color: var(--muted-text-color);
--series-pool-color: #A0A;
--series-pool-hover-color: #B6B;
@@ -115,10 +120,7 @@
--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;
+ --fetch-source-data-border: 1px solid #666;
--post-mode-menu-view-background: white;
--post-mode-menu-edit-background: #5C5;
@@ -133,7 +135,7 @@
--post-mode-menu-translation-background: #5CD;
--post-mode-menu-ban-background: #F33;
- --tag-count-color: #CCC;
+ --tag-count-color: var(--muted-text-color);
--low-post-count-color: red;
--tag-count-indicator-frown-color: red;
@@ -145,12 +147,6 @@
--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;
diff --git a/app/javascript/src/styles/common/inline.scss b/app/javascript/src/styles/common/inline.scss
index e265b99a8..d3d74cbf8 100644
--- a/app/javascript/src/styles/common/inline.scss
+++ b/app/javascript/src/styles/common/inline.scss
@@ -25,10 +25,12 @@ kbd.key {
border-radius: 3px;
}
+/* used for "(deleted)" messages */
span.inactive {
- color: var(--inactive-color);
+ color: var(--muted-text-color);
}
+/* used for "page N" links in /forum_topics and /pools */
td a.last-page {
- color: var(--last-page-link-color);
+ color: var(--muted-text-color);
}
diff --git a/app/javascript/src/styles/common/tables.scss b/app/javascript/src/styles/common/tables.scss
index 80f762617..b07932cc6 100644
--- a/app/javascript/src/styles/common/tables.scss
+++ b/app/javascript/src/styles/common/tables.scss
@@ -25,7 +25,6 @@ table.striped {
th {
font-weight: bold;
text-align: left;
- color: var(--table-header-text-color);
}
}
diff --git a/app/javascript/src/styles/specific/forum.scss b/app/javascript/src/styles/specific/forum.scss
index 0fb2509d4..8b69221e1 100644
--- a/app/javascript/src/styles/specific/forum.scss
+++ b/app/javascript/src/styles/specific/forum.scss
@@ -64,7 +64,7 @@ div#c-forum-topics {
}
span.locked-topic {
- color: var(--forum-locked-topic-color);
+ color: var(--muted-text-color);
}
span.level-topic {
@@ -81,7 +81,7 @@ 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: var(--forum-deleted-topic-color);
+ color: var(--muted-text-color);
}
}
diff --git a/app/javascript/src/styles/specific/posts.scss b/app/javascript/src/styles/specific/posts.scss
index f947ba31c..6becd8a03 100644
--- a/app/javascript/src/styles/specific/posts.scss
+++ b/app/javascript/src/styles/specific/posts.scss
@@ -395,10 +395,6 @@ div#c-posts {
max-height: 20em;
overflow-y: auto;
}
-
- .disabled {
- color: var(--post-artist-commentary-disabled-color);
- }
}
}
@@ -425,7 +421,7 @@ div#c-posts, div#c-uploads {
border-radius: 4px;
margin: 1em 0;
padding: 1em;
- border: 1px solid var(--fetch-source-data-border-color);
+ border: var(--fetch-source-data-border);
&:not(.loading) #source-info-loading { display: none; }
&.loading #source-info-content { display: none; }
diff --git a/app/javascript/src/styles/specific/users.scss b/app/javascript/src/styles/specific/users.scss
index 9ebb25719..b525d6f38 100644
--- a/app/javascript/src/styles/specific/users.scss
+++ b/app/javascript/src/styles/specific/users.scss
@@ -1,10 +1,6 @@
div#c-users {
div#a-show {
div.box {
- h2, h3 {
- color: var(--profile-page-header-color);
- }
-
margin-bottom: 2em;
}
@@ -55,7 +51,7 @@ div#c-users {
}
.active {
- color: var(--settings-page-active-tab-color);
+ color: var(--text-color);
}
}
diff --git a/app/views/artist_commentaries/_show.html.erb b/app/views/artist_commentaries/_show.html.erb
index 7dbe40d2c..3566ce84b 100644
--- a/app/views/artist_commentaries/_show.html.erb
+++ b/app/views/artist_commentaries/_show.html.erb
@@ -26,14 +26,14 @@
<% if artist_commentary.translated_title.present? %>
<%= artist_commentary.translated_title %>
<% else %>
- <%= artist_commentary.original_title %>
+ <%= artist_commentary.original_title %>
<% end %>
<% if artist_commentary.translated_description.present? %>
<%= format_text(artist_commentary.translated_description, :disable_mentions => true) %>
<% else %>
- <%= format_text(artist_commentary.original_description, :disable_mentions => true) %>
+ <%= format_text(artist_commentary.original_description, :disable_mentions => true) %>
<% end %>