Update themes and started theme settings

10 files changed, 164 insertions, 124 deletions

diff --git a/app/src/main/assets/css/themes/main.compact.css b/app/src/main/assets/css/themes/main.compact.css
deleted file mode 100644
index 4697ccf1..00000000
--- a/app/src/main/assets/css/themes/main.compact.css
+++ /dev/null
@@ -1,37 +0,0 @@
-#viewport { background: #451515 !important; }
-
-body, #root, #header, .aclb, ._55wo, ._1upc, input, ._2f9r, ._59e9, ._d4i, .acw, ._3f50, ._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1 { background: rgba(255, 0, 255, 0.02) !important; }
-
-.jewel, .flyout { background: #451515 !important; }
-
-button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, ._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._2v9s, ._4e8n { background: rgba(108, 33, 33, 0.1) !important; }
-
-body, input, ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye, textarea, .mentions-input, .mentions-placeholder, .fcw, ._5-7t, h1, h2, h3, h4, h5, h6 { color: #d7b0d7 !important; }
-
-::-webkit-input-placeholder { color: #d7b0d7 !important; }
-
-:-moz-placeholder { color: #d7b0d7 !important; }
-
-::-moz-placeholder { color: #d7b0d7 !important; }
-
-:-ms-input-placeholder { color: #d7b0d7 !important; }
-
-a { color: #8c8dd6 !important; }
-
-._15kl::before, ._5j35::after { border-left: 1px solid rgba(215, 176, 215, 0.3) !important; }
-
-._1mx0, ._15n_, ._52x1 { border-top: 1px solid rgba(215, 176, 215, 0.3) !important; }
-
-._15ny::after, ._ap1, ._52x1 { border-bottom: 1px solid rgba(215, 176, 215, 0.3) !important; }
-
-._d4i, ._4e8n, ._uww { border: 1px solid rgba(215, 176, 215, 0.3) !important; }
-
-._4o58::after { border-color: rgba(215, 176, 215, 0.3) !important; }
-
-._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before { background: rgba(215, 176, 215, 0.3) !important; }
-
-._56bf, .touch .btn { border-radius: 0 !important; border: 0 !important; }
-
-.touch ._56bt { text-shadow: none !important; }
-
-.touch .btnS { box-shadow: none !important; }
diff --git a/app/src/main/assets/css/themes/main.scss b/app/src/main/assets/css/themes/main.scss
deleted file mode 100644
index d4bba560..00000000
--- a/app/src/main/assets/css/themes/main.scss
+++ /dev/null
@@ -1,87 +0,0 @@
-@import "../core/colors";
-@import "../core/base";
-
-#viewport {
-  background: $background !important;
-}
-
-body, #root, #header, .aclb, ._55wo, ._1upc, input, ._2f9r, ._59e9,
-._d4i,
-.acw, ._3f50,
-._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1 {
-  background: $bg_transparent !important;
-}
-
-.jewel, .flyout {
-  background: $bg_opaque !important;
-}
-
-button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before,
-._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._2v9s,
-._4e8n {
-  background: $background2 !important;
-}
-
-body, input, ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye,
-textarea, .mentions-input, .mentions-placeholder, .fcw, ._5-7t,
-h1, h2, h3, h4, h5, h6 {
-  color: $text !important;
-}
-
-@include placeholder {
-  color: $text !important;
-}
-
-a {
-  color: $link !important;
-}
-
-//border between like and comment
-._15kl::before,
-._5j35::after {
-  border-left: 1px solid $divider !important;
-}
-
-//above see more
-._1mx0,
-._15n_, ._52x1 {
-  border-top: 1px solid $divider !important;
-}
-
-._15ny::after, ._ap1, ._52x1 {
-  border-bottom: 1px solid $divider !important;
-}
-
-//friend card border
-._d4i,
-._4e8n,
-._uww {
-  border: 1px solid $divider !important;
-}
-
-//link card bottom border
-._4o58::after {
-  border-color: $divider !important;
-}
-
-._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before {
-  background: $divider !important;
-}
-
-._56bf, .touch .btn {
-  border-radius: 0 !important;
-  border: 0 !important;
-}
-
-.touch ._56bt {
-  text-shadow: none !important;
-}
-
-.touch .btnS {
-  box-shadow: none !important;
-}
-
-//menu spinner
-[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] {
-  display: none !important;
-}
diff --git a/app/src/main/assets/css/themes/material_amoled.compact.css b/app/src/main/assets/css/themes/material_amoled.compact.css
new file mode 100644
index 00000000..26affc81
--- /dev/null
+++ b/app/src/main/assets/css/themes/material_amoled.compact.css
@@ -0,0 +1,39 @@
+#viewport { background: #000 !important; }
+
+body, #root, #header, .aclb, ._55wo, ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, ._5lp5, ._d4i, ._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, ._55wm, .acw, ._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, ._52z5, ._4l9b, ._4gj3, .groupChromeView, ._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1 { background: #000 !important; }
+
+.jewel, .flyout, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p { background: black !important; }
+
+button, button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, ._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._2v9s, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._4e8n, ._5pxa._3uj9, ._4qax { background: rgba(51, 51, 51, 0.2) !important; }
+
+body, input, ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye, textarea, .mentions-input, .mentions-placeholder, .fcw, ._5-7t, .fcl, ._4qas, .thread-title, ._46pa, ._336p, h1, h2, h3, h4, h5, h6 { color: #fff !important; }
+
+::-webkit-input-placeholder { color: #fff !important; }
+
+:-moz-placeholder { color: #fff !important; }
+
+::-moz-placeholder { color: #fff !important; }
+
+:-ms-input-placeholder { color: #fff !important; }
+
+a, ._5fpq { color: #B3E5FC !important; }
+
+._15kl::before, ._5j35::after { border-left: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._1mx0, ._15n_, ._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._3on6 { border-top: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._15ny::after, ._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .jx-result, ._5lp5, ._5pz4, ._5lp4, ._5lp5, ._3on6, ._5h6z, ._5h6x { border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._d4i, ._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, ._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf { border: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._4o58::after, .acw, .aclb, ._4qax { border-color: rgba(255, 255, 255, 0.3) !important; }
+
+._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, ._58a0:before { background: rgba(255, 255, 255, 0.3) !important; }
+
+._56bf, .touch .btn { border-radius: 0 !important; border: 0 !important; }
+
+.touch, ._56bt, ._56bu { text-shadow: none !important; }
+
+.touch .btnS, button, ._94v { box-shadow: none !important; }
+
+[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { display: none !important; }
diff --git a/app/src/main/assets/css/themes/material_amoled.scss b/app/src/main/assets/css/themes/material_amoled.scss
new file mode 100644
index 00000000..20ac414c
--- /dev/null
+++ b/app/src/main/assets/css/themes/material_amoled.scss
@@ -0,0 +1,2 @@
+@import "../core/colors_amoled";
+@import "../core/main";
diff --git a/app/src/main/assets/css/themes/material_dark.compact.css b/app/src/main/assets/css/themes/material_dark.compact.css
new file mode 100644
index 00000000..ce1684e1
--- /dev/null
+++ b/app/src/main/assets/css/themes/material_dark.compact.css
@@ -0,0 +1,39 @@
+#viewport { background: #303030 !important; }
+
+body, #root, #header, .aclb, ._55wo, ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, ._5lp5, ._d4i, ._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, ._55wm, .acw, ._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, ._52z5, ._4l9b, ._4gj3, .groupChromeView, ._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1 { background: #303030 !important; }
+
+.jewel, .flyout, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p { background: #303030 !important; }
+
+button, button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, ._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._2v9s, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._4e8n, ._5pxa._3uj9, ._4qax { background: rgba(99, 99, 99, 0.2) !important; }
+
+body, input, ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye, textarea, .mentions-input, .mentions-placeholder, .fcw, ._5-7t, .fcl, ._4qas, .thread-title, ._46pa, ._336p, h1, h2, h3, h4, h5, h6 { color: #fff !important; }
+
+::-webkit-input-placeholder { color: #fff !important; }
+
+:-moz-placeholder { color: #fff !important; }
+
+::-moz-placeholder { color: #fff !important; }
+
+:-ms-input-placeholder { color: #fff !important; }
+
+a, ._5fpq { color: #B3E5FC !important; }
+
+._15kl::before, ._5j35::after { border-left: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._1mx0, ._15n_, ._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._3on6 { border-top: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._15ny::after, ._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .jx-result, ._5lp5, ._5pz4, ._5lp4, ._5lp5, ._3on6, ._5h6z, ._5h6x { border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._d4i, ._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, ._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf { border: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._4o58::after, .acw, .aclb, ._4qax { border-color: rgba(255, 255, 255, 0.3) !important; }
+
+._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, ._58a0:before { background: rgba(255, 255, 255, 0.3) !important; }
+
+._56bf, .touch .btn { border-radius: 0 !important; border: 0 !important; }
+
+.touch, ._56bt, ._56bu { text-shadow: none !important; }
+
+.touch .btnS, button, ._94v { box-shadow: none !important; }
+
+[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { display: none !important; }
diff --git a/app/src/main/assets/css/themes/material_dark.scss b/app/src/main/assets/css/themes/material_dark.scss
new file mode 100644
index 00000000..ad6263d5
--- /dev/null
+++ b/app/src/main/assets/css/themes/material_dark.scss
@@ -0,0 +1,2 @@
+@import "../core/colors_dark";
+@import "../core/main";
diff --git a/app/src/main/assets/css/themes/material_glass.compact.css b/app/src/main/assets/css/themes/material_glass.compact.css
new file mode 100644
index 00000000..3a6f4a8e
--- /dev/null
+++ b/app/src/main/assets/css/themes/material_glass.compact.css
@@ -0,0 +1,39 @@
+#viewport { background: rgba(0, 0, 0, 0.3) !important; }
+
+body, #root, #header, .aclb, ._55wo, ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, ._5lp5, ._d4i, ._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, ._55wm, .acw, ._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, ._52z5, ._4l9b, ._4gj3, .groupChromeView, ._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1 { background: transparent !important; }
+
+.jewel, .flyout, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p { background: black !important; }
+
+button, button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, ._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._2v9s, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._4e8n, ._5pxa._3uj9, ._4qax { background: rgba(51, 51, 51, 0.2) !important; }
+
+body, input, ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye, textarea, .mentions-input, .mentions-placeholder, .fcw, ._5-7t, .fcl, ._4qas, .thread-title, ._46pa, ._336p, h1, h2, h3, h4, h5, h6 { color: #fff !important; }
+
+::-webkit-input-placeholder { color: #fff !important; }
+
+:-moz-placeholder { color: #fff !important; }
+
+::-moz-placeholder { color: #fff !important; }
+
+:-ms-input-placeholder { color: #fff !important; }
+
+a, ._5fpq { color: #B3E5FC !important; }
+
+._15kl::before, ._5j35::after { border-left: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._1mx0, ._15n_, ._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._3on6 { border-top: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._15ny::after, ._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .jx-result, ._5lp5, ._5pz4, ._5lp4, ._5lp5, ._3on6, ._5h6z, ._5h6x { border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._d4i, ._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, ._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf { border: 1px solid rgba(255, 255, 255, 0.3) !important; }
+
+._4o58::after, .acw, .aclb, ._4qax { border-color: rgba(255, 255, 255, 0.3) !important; }
+
+._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, ._58a0:before { background: rgba(255, 255, 255, 0.3) !important; }
+
+._56bf, .touch .btn { border-radius: 0 !important; border: 0 !important; }
+
+.touch, ._56bt, ._56bu { text-shadow: none !important; }
+
+.touch .btnS, button, ._94v { box-shadow: none !important; }
+
+[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { display: none !important; }
diff --git a/app/src/main/assets/css/themes/material_glass.scss b/app/src/main/assets/css/themes/material_glass.scss
new file mode 100644
index 00000000..273a66a6
--- /dev/null
+++ b/app/src/main/assets/css/themes/material_glass.scss
@@ -0,0 +1,2 @@
+@import "../core/colors_glass";
+@import "../core/main";
diff --git a/app/src/main/assets/css/themes/material_light.compact.css b/app/src/main/assets/css/themes/material_light.compact.css
new file mode 100644
index 00000000..973c7880
--- /dev/null
+++ b/app/src/main/assets/css/themes/material_light.compact.css
@@ -0,0 +1,39 @@
+#viewport { background: #fafafa !important; }
+
+body, #root, #header, .aclb, ._55wo, ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, ._5lp5, ._d4i, ._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, ._55wm, .acw, ._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, ._52z5, ._4l9b, ._4gj3, .groupChromeView, ._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1 { background: #fafafa !important; }
+
+.jewel, .flyout, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p { background: #fafafa !important; }
+
+button, button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, ._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._2v9s, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._4e8n, ._5pxa._3uj9, ._4qax { background: rgba(255, 255, 255, 0.2) !important; }
+
+body, input, ._43mh, .touch .btn, p, span, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, ._rnk, ._24u0, ._1g06, ._14ye, textarea, .mentions-input, .mentions-placeholder, .fcw, ._5-7t, .fcl, ._4qas, .thread-title, ._46pa, ._336p, h1, h2, h3, h4, h5, h6 { color: #000 !important; }
+
+::-webkit-input-placeholder { color: #000 !important; }
+
+:-moz-placeholder { color: #000 !important; }
+
+::-moz-placeholder { color: #000 !important; }
+
+:-ms-input-placeholder { color: #000 !important; }
+
+a, ._5fpq { color: #263238 !important; }
+
+._15kl::before, ._5j35::after { border-left: 1px solid rgba(0, 0, 0, 0.3) !important; }
+
+._1mx0, ._15n_, ._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._3on6 { border-top: 1px solid rgba(0, 0, 0, 0.3) !important; }
+
+._15ny::after, ._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .jx-result, ._5lp5, ._5pz4, ._5lp4, ._5lp5, ._3on6, ._5h6z, ._5h6x { border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important; }
+
+._d4i, ._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, ._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf { border: 1px solid rgba(0, 0, 0, 0.3) !important; }
+
+._4o58::after, .acw, .aclb, ._4qax { border-color: rgba(0, 0, 0, 0.3) !important; }
+
+._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, ._58a0:before { background: rgba(0, 0, 0, 0.3) !important; }
+
+._56bf, .touch .btn { border-radius: 0 !important; border: 0 !important; }
+
+.touch, ._56bt, ._56bu { text-shadow: none !important; }
+
+.touch .btnS, button, ._94v { box-shadow: none !important; }
+
+[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { display: none !important; }
diff --git a/app/src/main/assets/css/themes/material_light.scss b/app/src/main/assets/css/themes/material_light.scss
new file mode 100644
index 00000000..624a57a4
--- /dev/null
+++ b/app/src/main/assets/css/themes/material_light.scss
@@ -0,0 +1,2 @@
+@import "../core/colors_light";
+@import "../core/main";