about summary refs log tree commit diff
path: root/app
diff options
context:
space:
mode:
authorThibaut Girka <thib@sitedethib.com>2018-05-05 21:58:19 +0200
committerThibaut Girka <thib@sitedethib.com>2018-05-05 22:33:02 +0200
commitf7a076eded6517c9cf235524dd95e6bcdad4974a (patch)
tree14765ef3c41d30762dde1fa26b547d270a111557 /app
parentcaebf69e77e1d7be9102e0bc9f59412462fed3ae (diff)
[Glitch] Add high-contrast theme
Diffstat (limited to 'app')
-rw-r--r--app/javascript/flavours/glitch/styles/contrast.scss3
-rw-r--r--app/javascript/flavours/glitch/styles/contrast/diff.scss14
-rw-r--r--app/javascript/flavours/glitch/styles/contrast/variables.scss22
-rw-r--r--app/javascript/skins/glitch/contrast/common.scss1
-rw-r--r--app/javascript/skins/glitch/contrast/names.yml4
5 files changed, 44 insertions, 0 deletions
diff --git a/app/javascript/flavours/glitch/styles/contrast.scss b/app/javascript/flavours/glitch/styles/contrast.scss
new file mode 100644
index 000000000..4de31db9a
--- /dev/null
+++ b/app/javascript/flavours/glitch/styles/contrast.scss
@@ -0,0 +1,3 @@
+@import 'contrast/variables';
+@import 'index';
+@import 'contrast/diff';
diff --git a/app/javascript/flavours/glitch/styles/contrast/diff.scss b/app/javascript/flavours/glitch/styles/contrast/diff.scss
new file mode 100644
index 000000000..eee9ecc3e
--- /dev/null
+++ b/app/javascript/flavours/glitch/styles/contrast/diff.scss
@@ -0,0 +1,14 @@
+// components.scss
+.compose-form {
+  .compose-form__modifiers {
+    .compose-form__upload {
+      &-description {
+        input {
+          &::placeholder {
+            opacity: 1.0;
+          }
+        }
+      }
+    }
+  }
+}
diff --git a/app/javascript/flavours/glitch/styles/contrast/variables.scss b/app/javascript/flavours/glitch/styles/contrast/variables.scss
new file mode 100644
index 000000000..35d11060e
--- /dev/null
+++ b/app/javascript/flavours/glitch/styles/contrast/variables.scss
@@ -0,0 +1,22 @@
+// Dependent colors
+$black: #000000;
+
+$classic-base-color: #282c37;
+$classic-primary-color: #9baec8;
+$classic-secondary-color: #d9e1e8;
+
+$ui-base-color: $classic-base-color !default;
+$ui-primary-color: $classic-primary-color !default;
+$ui-secondary-color: $classic-secondary-color !default;
+
+// Differences
+$ui-highlight-color: #2b5fd9;
+
+$darker-text-color: lighten($ui-primary-color, 20%) !default;
+$dark-text-color: lighten($ui-primary-color, 12%) !default;
+$secondary-text-color: lighten($ui-secondary-color, 6%) !default;
+$action-button-color: #8d9ac2;
+
+$inverted-text-color: $black !default;
+$lighter-text-color: darken($ui-base-color,6%) !default;
+$light-text-color: darken($ui-primary-color, 40%) !default;
diff --git a/app/javascript/skins/glitch/contrast/common.scss b/app/javascript/skins/glitch/contrast/common.scss
new file mode 100644
index 000000000..90919d6d4
--- /dev/null
+++ b/app/javascript/skins/glitch/contrast/common.scss
@@ -0,0 +1 @@
+@import 'flavours/glitch/styles/contrast';
diff --git a/app/javascript/skins/glitch/contrast/names.yml b/app/javascript/skins/glitch/contrast/names.yml
new file mode 100644
index 000000000..f60c4acd0
--- /dev/null
+++ b/app/javascript/skins/glitch/contrast/names.yml
@@ -0,0 +1,4 @@
+en:
+  skins:
+    glitch:
+      contrast: High contrast