summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--browser/Makefile.am1
-rw-r--r--browser/css/color-palette-dark.css52
2 files changed, 53 insertions, 0 deletions
diff --git a/browser/Makefile.am b/browser/Makefile.am
index 6c6b1a15d2..5236a122c4 100644
--- a/browser/Makefile.am
+++ b/browser/Makefile.am
@@ -122,6 +122,7 @@ COOL_CSS_LST =\
$(srcdir)/css/leaflet-spinner.css \
$(srcdir)/css/selectionMarkers.css \
$(srcdir)/css/color-palette.css \
+ $(srcdir)/css/color-palette-dark.css \
$(srcdir)/css/cool.css \
$(srcdir)/css/toolbar.css \
$(srcdir)/css/toolbar-mobile.css \
diff --git a/browser/css/color-palette-dark.css b/browser/css/color-palette-dark.css
new file mode 100644
index 0000000000..c23affd2e8
--- /dev/null
+++ b/browser/css/color-palette-dark.css
@@ -0,0 +1,52 @@
+@media (prefers-color-scheme: dark) {
+ :root {
+ /*LibreOffice Colors: https://wiki.documentfoundation.org/Marketing/Branding#Colors
+ ----------------------------------[to do]*/
+ --blue1-txt-primary-color: 3, 105, 163;
+ --green0-txt-primary-color: 16, 104, 2; /*green1 lacks contrast against white*/
+ --orange1-txt-primary-color: 163, 62, 3;
+ --yellow0-txt-primary-color: 135, 105, 0; /*yellow1 lacks contrast against white*/
+
+ --color-main-text: #e8e8e8;
+ --color-text-dark: #e8e8e8; /* select */
+ --color-text-darker: #c0bfbc; /* hover */
+ --color-text-lighter: #fff; /* secondard text, disabled */
+
+ --color-main-background: #121212;
+ --color-background-dark: #1E1E1E; /* select */
+ --color-background-darker: #000; /* todo: apply to pressed (active), li:hover(top menu on classic mode)*/
+ --color-background-lighter: #262626; /* hover, toolbar, dialog, disabled */
+ --color-overlay: #1c5fa814;
+
+ --color-primary: #0b87e7; /* border-color */
+ --color-primary-text: #fff; /* text color when primary-lighter is background */
+ --color-primary-dark: #0063b1;
+ --color-primary-darker: #004b86;
+ --color-primary-lighter: #83beec; /* background-color */
+
+ --color-border: #121212;
+ --color-border-dark: #1E1E1E; /* select */
+ --color-border-darker: #000; /* hover */
+ --color-border-lighter: #303030; /* disabled */
+
+ --color-btn-border: #b6b6b6;
+ --color-btn-border-dis: #c0bfbc;
+
+ --color-error: #e9322d;
+ --color-warning: #eca700;
+ --color-success: #46ba61;
+
+ --color-box-shadow: rgba(77, 77, 77, 0.5);
+ --border-radius: 4px; /* buttons, widgets */
+ --border-radius-large: 10px; /* dialog */
+
+ --default-font-size: 12px;
+ --header-font-size: 16px;
+
+ --default-height: 24px;
+ --header-height: 38px;
+
+ /* Annotations */
+ --annotation-input-size: 240px;
+ }
+}