aboutsummaryrefslogtreecommitdiff
path: root/app/src/web/scss
diff options
context:
space:
mode:
authorAllan Wang <me@allanwang.ca>2021-01-12 23:57:16 -0800
committerAllan Wang <me@allanwang.ca>2021-01-12 23:57:16 -0800
commit31dc27d568d40d37cccb09e31c8a8c8b9cf8f897 (patch)
treeeb54cb834a419167e6e25b9d3702d36fd5594515 /app/src/web/scss
parent5aec10ce0fe191d78399869074c7e118256848ea (diff)
downloadfrost-31dc27d568d40d37cccb09e31c8a8c8b9cf8f897.tar.gz
frost-31dc27d568d40d37cccb09e31c8a8c8b9cf8f897.tar.bz2
frost-31dc27d568d40d37cccb09e31c8a8c8b9cf8f897.zip
Update messenger theme
Diffstat (limited to 'app/src/web/scss')
-rw-r--r--app/src/web/scss/core/_colors.scss1
-rw-r--r--app/src/web/scss/messenger/core/_core_vars.scss38
-rw-r--r--app/src/web/scss/palette/_custom.scss1
3 files changed, 31 insertions, 9 deletions
diff --git a/app/src/web/scss/core/_colors.scss b/app/src/web/scss/core/_colors.scss
index 7610572c..ea75cc15 100644
--- a/app/src/web/scss/core/_colors.scss
+++ b/app/src/web/scss/core/_colors.scss
@@ -4,6 +4,7 @@ $bg_transparent: rgba(#f0f, 0.02) !default;
//Our default colors are test colors; production files should always import the actual colors
$text: #d7b0d7 !default;
+$text_disabled: rgba($text, 0.6) !default;
// must be visible with accent as the background
$accent_text: #76d7c2 !default;
$link: #9266d5 !default;
diff --git a/app/src/web/scss/messenger/core/_core_vars.scss b/app/src/web/scss/messenger/core/_core_vars.scss
index f15c936c..cdc5b7cf 100644
--- a/app/src/web/scss/messenger/core/_core_vars.scss
+++ b/app/src/web/scss/messenger/core/_core_vars.scss
@@ -1,10 +1,30 @@
:root, .__fb-light-mode {
- // Main background; needs to be opaque to hide gradient used for sender card
- --messenger-card-background: $bg_transparent !important;
- // Date
- --placeholder-text: $text !important;
- // Emoji background
- --surface-background: $bg_opaque2 !important;
- --primary-text: $text !important;
- --web-wash: #f0f !important;
-} \ No newline at end of file
+ --attachment-footer-background: #{$bg_opaque} !important;
+ --card-background-flat: #{$bg_opaque} !important;
+ --card-background: #{$bg_opaque} !important;
+ --comment-background: #{$bg_opaque} !important;
+ --comment-footer-background: #{$bg_opaque} !important;
+ --disabled-button-background: #{$bg_opaque} !important;
+ --disabled-icon: #{$text_disabled} !important;
+ --disabled-text: #{$text_disabled} !important;
+ --divider: #{$divider} !important;
+ --hero-banner-background: #{$bg_opaque} !important;
+ --highlight-bg: #{$bg_opaque2} !important;
+ --media-outer-border: #{$bg_opaque} !important;
+ --messenger-card-background: #{$bg_opaque} !important;
+ --messenger-card-background: #{$bg_opaque} !important; // Main background; needs to be opaque to hide gradient used for sender card
+ --messenger-reply-background: #{$bg_opaque2} !important;
+ --nav-bar-background-gradient-wash: #{$bg_opaque} !important;
+ --nav-bar-background-gradient: #{$bg_opaque} !important;
+ --nav-bar-background: #{$bg_opaque} !important;
+ --new-notification-background: #{$bg_opaque2} !important;
+ --placeholder-text: #{$text} !important; // Date
+ --primary-icon: #{$text} !important;
+ --primary-text: #{$text} !important;
+ --secondary-icon: #{$text} !important;
+ --secondary-text: #{$text} !important;
+ --surface-background: #{$bg_opaque2} !important; // Emoji background
+ --toggle-active-background: #{$bg_opaque2} !important;
+ --web-wash: #{$bg_opaque2} !important;
+ --web-wash: #{$bg_opaque2} !important;
+}
diff --git a/app/src/web/scss/palette/_custom.scss b/app/src/web/scss/palette/_custom.scss
index b35bdfa1..0adb7768 100644
--- a/app/src/web/scss/palette/_custom.scss
+++ b/app/src/web/scss/palette/_custom.scss
@@ -1,5 +1,6 @@
$bg_transparent: unquote('$BT$');
$text: unquote('$T$');
+$text_disabled: unquote('$TD$');
$link: unquote('$TT$');
$accent: unquote('$A$');
$accent_text: unquote('$AT$');