diff options
| author | andreas kainz <kainz.a@gmail.com> | 2022-04-23 19:57:45 +0200 |
|---|---|---|
| committer | Gökay ŞATIR <gokaysatir@gmail.com> | 2022-05-24 11:59:38 +0300 |
| commit | 08b1d4b1e78fc2560d554b5935452ebb2d025214 (patch) | |
| tree | e1b5d0b94be9a1e8c7d508ccf3a458a41334f298 /browser | |
| parent | writer notebookbar stylesview previews no padding (diff) | |
| download | online-08b1d4b1e78fc2560d554b5935452ebb2d025214.tar.gz online-08b1d4b1e78fc2560d554b5935452ebb2d025214.zip | |
Add color-scheme-dark.css support
@media (prefers-color-scheme: dark) setting
is available by use color-scheme-dark.css
instead of color-scheme.css
sure the scheme need some update
but there are other open points like
use dark color for document
use dark colibre icons
this is only the .css change
so no full dark mode update
Signed-off-by: andreas kainz <kainz.a@gmail.com>
Change-Id: I5c2adcbb75583a952f419af507d7cfe5c1343e3c
Signed-off-by: Gökay Şatır <gokaysatir@collabora.com>
Diffstat (limited to 'browser')
| -rw-r--r-- | browser/Makefile.am | 1 | ||||
| -rw-r--r-- | browser/css/color-palette-dark.css | 52 |
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; + } +} |