From 330bf2857396b15752afadb030c981a1cb2848fe Mon Sep 17 00:00:00 2001 From: Allan Wang Date: Tue, 5 Feb 2019 22:13:41 -0500 Subject: Enhancement/js (#1344) * Attempt to add package json * Add initial typescript components * Convert remaining files * Remove some null checks * Reorganize folders * Add missing js and tests for file paths * Delete unused babelrc * Remove unused packages --- app/src/web/assets/css/components/round_icons.css | 4 + app/src/web/assets/css/components/round_icons.scss | 4 + app/src/web/assets/css/core/_base.scss | 107 +++++++ app/src/web/assets/css/core/_colors.scss | 18 ++ app/src/web/assets/css/core/_core_bg.scss | 86 ++++++ app/src/web/assets/css/core/_core_border.scss | 94 ++++++ app/src/web/assets/css/core/_core_messenger.scss | 20 ++ app/src/web/assets/css/core/_core_text.scss | 39 +++ app/src/web/assets/css/core/_main.scss | 6 + app/src/web/assets/css/core/_svg.scss | 74 +++++ app/src/web/assets/css/core/core.css | 306 +++++++++++++++++++ app/src/web/assets/css/core/core.scss | 54 ++++ app/src/web/assets/css/themes/.gitignore | 2 + app/src/web/assets/css/themes/custom.css | 338 +++++++++++++++++++++ app/src/web/assets/css/themes/custom.scss | 14 + app/src/web/assets/css/themes/material_amoled.css | 338 +++++++++++++++++++++ app/src/web/assets/css/themes/material_amoled.scss | 11 + app/src/web/assets/css/themes/material_dark.css | 338 +++++++++++++++++++++ app/src/web/assets/css/themes/material_dark.scss | 10 + app/src/web/assets/css/themes/material_glass.css | 338 +++++++++++++++++++++ app/src/web/assets/css/themes/material_glass.scss | 10 + app/src/web/assets/css/themes/material_light.css | 338 +++++++++++++++++++++ app/src/web/assets/css/themes/material_light.scss | 15 + 23 files changed, 2564 insertions(+) create mode 100644 app/src/web/assets/css/components/round_icons.css create mode 100644 app/src/web/assets/css/components/round_icons.scss create mode 100644 app/src/web/assets/css/core/_base.scss create mode 100644 app/src/web/assets/css/core/_colors.scss create mode 100644 app/src/web/assets/css/core/_core_bg.scss create mode 100644 app/src/web/assets/css/core/_core_border.scss create mode 100644 app/src/web/assets/css/core/_core_messenger.scss create mode 100644 app/src/web/assets/css/core/_core_text.scss create mode 100644 app/src/web/assets/css/core/_main.scss create mode 100644 app/src/web/assets/css/core/_svg.scss create mode 100644 app/src/web/assets/css/core/core.css create mode 100644 app/src/web/assets/css/core/core.scss create mode 100644 app/src/web/assets/css/themes/.gitignore create mode 100644 app/src/web/assets/css/themes/custom.css create mode 100644 app/src/web/assets/css/themes/custom.scss create mode 100644 app/src/web/assets/css/themes/material_amoled.css create mode 100644 app/src/web/assets/css/themes/material_amoled.scss create mode 100644 app/src/web/assets/css/themes/material_dark.css create mode 100644 app/src/web/assets/css/themes/material_dark.scss create mode 100644 app/src/web/assets/css/themes/material_glass.css create mode 100644 app/src/web/assets/css/themes/material_glass.scss create mode 100644 app/src/web/assets/css/themes/material_light.css create mode 100644 app/src/web/assets/css/themes/material_light.scss (limited to 'app/src/web/assets/css') diff --git a/app/src/web/assets/css/components/round_icons.css b/app/src/web/assets/css/components/round_icons.css new file mode 100644 index 00000000..c765d2ab --- /dev/null +++ b/app/src/web/assets/css/components/round_icons.css @@ -0,0 +1,4 @@ +#threadlist_rows, [role*=presentation] img._1e_c, +i.img.profpic:not(._1_0m), ._42b6._42b6._42b6, ._5i9c.img, img._2cu2, i.img.l, [id*=threadlist] i.img:not(._1_0m) { + border-radius: 50% !important; +} diff --git a/app/src/web/assets/css/components/round_icons.scss b/app/src/web/assets/css/components/round_icons.scss new file mode 100644 index 00000000..c00fe1bf --- /dev/null +++ b/app/src/web/assets/css/components/round_icons.scss @@ -0,0 +1,4 @@ +#threadlist_rows, [role*=presentation] img._1e_c, +i.img.profpic:not(._1_0m), ._42b6._42b6._42b6, ._5i9c.img, img._2cu2, i.img.l, [id*=threadlist] i.img:not(._1_0m) { + border-radius: 50% !important; +} diff --git a/app/src/web/assets/css/core/_base.scss b/app/src/web/assets/css/core/_base.scss new file mode 100644 index 00000000..472319fe --- /dev/null +++ b/app/src/web/assets/css/core/_base.scss @@ -0,0 +1,107 @@ +@mixin placeholder { + ::-webkit-input-placeholder { + @content; + } + + :-moz-placeholder { + @content; + } + + ::-moz-placeholder { + @content; + } + + :-ms-input-placeholder { + @content; + } +} + +@mixin keyframes($name) { + @-webkit-keyframes #{$name} { + @content; + } + + @-moz-keyframes #{$name} { + @content; + } + + //@-ms-keyframes #{$name} { + // @content; + //} + + @keyframes #{$name} { + @content; + } +} + +// Helper function to replace characters in a string +@function str-replace($string, $search, $replace: "") { + $index: str-index($string, $search); + + @return if($index, str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace), $string); +} + +// https://css-tricks.com/probably-dont-base64-svg/ +// SVG optimization thanks to https://codepen.io/jakob-e/pen/doMoML +// Function to create an optimized svg url +// Version: 1.0.6 +@function svg-url($svg) { + // + // Add missing namespace + // + @if not str-index($svg, xmlns) { + $svg: str-replace($svg, "", "%3E"); + + // + // The maybe list + // + // Keep size and compile time down + // ... only add on documented fail + // + // $chunk: str-replace($chunk, '&', '%26'); + // $chunk: str-replace($chunk, '|', '%7C'); + // $chunk: str-replace($chunk, '[', '%5B'); + // $chunk: str-replace($chunk, ']', '%5D'); + // $chunk: str-replace($chunk, '^', '%5E'); + // $chunk: str-replace($chunk, '`', '%60'); + // $chunk: str-replace($chunk, ';', '%3B'); + // $chunk: str-replace($chunk, '?', '%3F'); + // $chunk: str-replace($chunk, ':', '%3A'); + // $chunk: str-replace($chunk, '@', '%40'); + // $chunk: str-replace($chunk, '=', '%3D'); + + $encoded: #{$encoded}#{$chunk}; + $index: $index + $slice; + } + + @return url("data:image/svg+xml,#{$encoded}"); +} + +// Background svg mixin +@mixin background-svg($svg, $extra: "no-repeat") { + background: svg-url($svg) unquote($extra) !important; +} diff --git a/app/src/web/assets/css/core/_colors.scss b/app/src/web/assets/css/core/_colors.scss new file mode 100644 index 00000000..1411a857 --- /dev/null +++ b/app/src/web/assets/css/core/_colors.scss @@ -0,0 +1,18 @@ +$bg_transparent: rgba(#f0f, 0.02) !default; + +//Keep above as first line so partials aren't compiled +//Our default colors are test colors; production files should always import the actual colors + +$text: #d7b0d7 !default; +// must be visible with accent as the background +$accent_text: #76d7c2 !default; +$link: #9266d5 !default; +$accent: #3b5998 !default; +$background: #451515 !default; +// background2 must be transparent +$background2: rgba(lighten($background, 35%), 0.35) !default; //Also change ratio in material_light +$bg_opaque: rgba($background, 1.0) !default; +$bg_opaque2: rgba($background2, 1.0) !default; +$card: #239645 !default; +$tint: #ff4682 !default; // must be different from $background +$divider: rgba($text, 0.3) !default; diff --git a/app/src/web/assets/css/core/_core_bg.scss b/app/src/web/assets/css/core/_core_bg.scss new file mode 100644 index 00000000..21c20bcc --- /dev/null +++ b/app/src/web/assets/css/core/_core_bg.scss @@ -0,0 +1,86 @@ +#viewport { + background: $background !important; +} + +body, :root, #root, #header, #MComposer, [style*="background-color"], ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, +._5lp5, .container, .subpage, ._5n_f, #static_templates, ._22_8, ._1t4h, ._uoq, ._3qdh, ._8ca, ._3h8i, +._6-l ._2us7, ._6-l ._6-p, ._333v, div.sharerSelector, ._529j, ._305j, ._1pph, ._3t_l, ._4pvz, +._1g05, .acy, ._51-g, ._533c, ._ib-, .sharerAttachmentEmpty, .sharerBottomWrapper, ._24e1, ._-j7, +._3bg5 ._56do, ._5hfh, ._52e-, .mQuestionsPollResultsBar, ._5hoc, ._5oxw, ._32_4, ._1hiz, +._38do, .bo, .cq, ._234-, ._a-5, ._2zh4, ._15ks, ._3oyc, ._36dc, ._3iyw ._3iyx, ._6bes, ._55wo, ._4-dy, +.tlBody, #timelineBody, .timelineX, .timeline, .feed, .tlPrelude, .tlFeedPlaceholder, ._4_d0, +.al, ._1gkq, ._5c5b, ._1qxg, ._5luf, ._2new, ._cld, ._3zvb, ._2nk0, .btnD, .btnI, ._2bdb, ._3ci9, +._11ub, ._5p7j, ._55wm, ._5rgs, ._5xuj, ._1sv1, ._45fu, ._18qg, ._1_ac, ._5w3g, ._3e18, ._6be7, +._5q_r, ._5yt8, ._idb, ._2ip_, ._f6s, ._2l5v, ._8i2, ._kr5, ._2q7u, ._2q7v, ._5xp2, div.fullwidthMore, +._577z, ._2u4w, ._3u9p, ._3u9t, ._cw4, ._5_y-, ._5_y_, ._5_z3, ._cwy, ._5_z0, ._voz, ._vos, +._5_z1, ._5_z2, ._2mtc, ._206a, ._1_-1, ._1ybg, .appCenterCategorySelectorButton, ._5_ee, ._3clk, +._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, +._55wm, ._2om3, ._2ol-, ._1f9d, ._vee, ._31a-, ._3r8b, ._3r9d, ._5vq5, ._3tl8, ._65wz, ._4edl, +.acw, ._4_xl, ._1p70, ._1p70, ._1ih_, ._51v6, ._u2c, ._484w, ._3ils, ._rm7, ._32qk, ._d01, ._1glm, +._ue6, ._hdn._hdn, +._2y60, ._5fu3, ._2foa, ._2y5_, ._38o9, ._1kb, .mAppCenterFatLabel, ._3bmj, ._5zmb, ._2x2s, ._3kac, ._3kad, +._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, +._4l9b, ._4gj3, .groupChromeView, ._i3g, ._3jcf, .error, ._1dbp, ._5zma, ._6beq, ._vi6, +._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1, ._35au, ._cwy, +._1rfn ._1rfk ._4vc-, ._1rfk, ._1rfk ._2v9s, ._301x { + background: $bg_transparent !important; +} + +//card related +._31nf, ._2v9s, ._d4i, article._55wo, ._10c_, ._2jl2, ._55wo, ._6150, ._50mi, ._4-dw, ._4_2z { + background: $card !important; +} + +// unread related + +.aclb { + background: $tint !important; +} + +//contains images so must have background-color +._cv_, ._2sq8 { + background-color: $bg_transparent !important; +} + +#page, ._8l7, ._-j8, ._-j9, ._6o5v { + background: transparent !important; +} + +.jewel, .flyout, ._52z5, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p, .mentions-suggest-item, ._2suk, +.mentions-suggest, ._1xoz, ._1xow { + background: $bg_opaque !important; +} + +._403n, ._14v5 ._14v8, ._1-kc { + background: $bg_opaque2 !important; +} + +button:not([style*=image]):not(.privacyButtons), button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, +._590n, ._4g8h, ._2cpp, ._58a0.touched:after, +.timeline .timelinePublisher, .touched, .sharerAttachment, +.item a.primary.touched .primarywrap, ._38nq, ._537a, +._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._55fj, +.excessItem, .acr, ._5-lx, ._3g9-, ._55ws, ._6dsj ._3gin, ._69aj, +._4e8n, ._5pxa._3uj9, ._5n_5, ._u2d, ._56bu::before, ._5h8f, ._d00, ._2066, ._2k51, +._10sb li.selected, ._2z4j, ._ib-, ._1bhl, ._5a5j, +._2b06, ._2tsf, ._3gka, .mCount, ._27vc, ._4pv-, ._6pk5, +._4qax, ._4756, ._w34, ._56bv::before, ._5769, ._34iv, ._z-w, ._t21, .mToken, +#addMembersTypeahead .mToken.mTokenWeakReference, +.acbk { + background: $background2 !important; +} + +.mQuestionsPollResultsBar .shaded { + background: $accent !important; +} + +._220g, ._1_y8:after, ._6pk6, +._2zh4::before, ._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, +._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { + background: $divider !important; +} + +//fab +button ._v89 ._54k8._1fl1 { + background: $accent !important; +} \ No newline at end of file diff --git a/app/src/web/assets/css/core/_core_border.scss b/app/src/web/assets/css/core/_core_border.scss new file mode 100644 index 00000000..c366bc14 --- /dev/null +++ b/app/src/web/assets/css/core/_core_border.scss @@ -0,0 +1,94 @@ +//border between like and comment +._15kl::before, ._37fd .inlineComposerButton, ._1hb:before, +._5j35::after, ._2k4b, ._3to7, ._4nw8 { + border-left: 1px solid $divider !important; +} + +._4_d1, ._5cni { + border-right: 1px solid $divider !important; +} + +//above see more +._1mx0, ._1rbr, ._5yt8, ._idb, ._cld, ._1e8h, ._z-w, ._1ha, ._1n8h ._1oby, ._5f99, ._2t39, +._2pbp, ._5rou:first-child, ._egf:first-child, ._io2, ._3qdi ._48_m::after, +._15n_, ._3-2-, ._27ve, ._2s20, ._gui, ._2s21 > *::after, ._32qk, ._d00, ._d01, ._38o9, +._3u9t, ._55fj, .mEventProfileSection.useBorder td, ._3ils, ._5as0, ._5as2, +._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._56d8, .al { + border-top: 1px solid $divider !important; +} + +._15ny::after, ._z-w, ._8i2, ._2nk0, ._22_8, ._1t4h, ._37fd, ._1ha, ._3bg5 ._56do, ._8he, +._400s, ._5hoc, ._1bhn, ._5ag6, ._4pvz, +._301x, ._x08 ._x0a:after, ._36dc, ._6-l ._57jn, ._527k, ._g_k, +._577z:not(:last-child) ._ygd, ._3u9u, ._3mgz, ._52x6, ._2066, ._5luf, ._2bdc, ._3ci9, +.mAppCenterFatLabel, .appCenterCategorySelectorButton, ._1q6v, ._5q_r, ._5yt8, ._38do, ._38dt, +._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .error, ._35--, ._1wev, +.jx-result, ._1f9d, ._vef, ._55x2 > *, .al, ._44qk, ._5rgs, ._5xuj, ._1sv1, ._idb, +._5lp5, ._3-2-, ._3to6, ._ir5, ._4nw6, ._4nwh, ._27ve, div._51v6::before, +._3c9h::before, ._2s20, ._gui, ._5jku, ._2foa, ._2y60, ._5fu3, ._4en9, ._1kb:not(:last-child) ._1kc, +._5pz4, ._5lp4, ._5lp5, ._5h6z, ._5h6x, ._2om4, ._5fjw > div, ._5fjv > :first-child, +._5fjw > :first-child { + border-bottom: 1px solid $divider !important; +} + +.item a.primary.touched .primarywrap, ._4dwt ._5y33, ._1ih_, ._5_50, ._6beq, ._69aj, +._5fjv, ._3on6, ._2u4w, ._2om3, ._2ol-, ._5fjw, ._4z83, ._1gkq, ._4-dy { + border-top: 1px solid $divider !important; + border-bottom: 1px solid $divider !important; +} + +//friend card border +._d4i, ._f6s, .mentions-suggest-item, .mentions-suggest, .sharerAttachment, +.mToken, #addMembersTypeahead .mToken.mTokenWeakReference, .mQuestionsPollResultsBar, +._15q7, ._2q7v, ._4dwt ._16ii, ._3qdi::after, +._2q7w, .acy, ._58ak, ._3t_l, ._4msa, ._3h8i, ._3clk, ._1kt6, ._1ksq, +._1_y5, ._lr0, ._5hgt, ._2cpp, ._50uu, ._50uw, ._31yd, ._1e3d, ._3xz7, ._1xoz, +._4kcb, ._2lut, .jewel .touchable-notification.touched, .touchable-notification .touchable.touched, +.home-notification .touchable.touched, ._6beo ._6ber, +._73ku ._73jw, +._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, +._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf, ._4756, ._1rrd, ._5n_f { + border: 1px solid $divider !important; +} + +.mQuestionsPollResultsBar .shaded, ._1027._13sm { + border: 1px solid $text !important; +} + +._3gka { + border: 1px dashed $divider !important; +} + +//link card bottom border +._4o58::after, .acr, ._t21, ._2bdb, +.acw, .aclb, ._4qax, ._5h8f { + border-color: $divider !important; +} + +// like, comment, share divider +._15ks ._15kl::before { + border-left: 1px solid transparent !important; +} + +._56bf, .touch .btn { + border-radius: 0 !important; + border: 0 !important; +} + +//page side tab layout +._2cis { + border-left: 10px solid $bg_transparent !important; + border-right: 10px solid $bg_transparent !important; +} + +._2cir.selected, ._42rv, ._5zma, ._2x2s { + border-bottom: 3px solid $text !important; +} + +._1ss6 { + border-left: 2px solid $text !important; +} + +._484w.selected > ._6zf, ._5kqs::after, ._3lvo ._5xum._5xuk, ._x0b { + border-bottom: 1px solid $text !important; +} \ No newline at end of file diff --git a/app/src/web/assets/css/core/_core_messenger.scss b/app/src/web/assets/css/core/_core_messenger.scss new file mode 100644 index 00000000..608fc23d --- /dev/null +++ b/app/src/web/assets/css/core/_core_messenger.scss @@ -0,0 +1,20 @@ +// Not all messenger related components are here; only the main ones. +// Borders for instance are merged into core_border + +// Other person's message bubble +._34ee { + background: $background2 !important; + color: $text !important; + +} + +// Your message bubble; order matters +._34em ._34ee { + background: $accent !important; + color: $accent_text !important; +} + +// Sticker page +._5as0, ._5cni, ._5as2 { + background: $bg_opaque !important; +} \ No newline at end of file diff --git a/app/src/web/assets/css/core/_core_text.scss b/app/src/web/assets/css/core/_core_text.scss new file mode 100644 index 00000000..154cee84 --- /dev/null +++ b/app/src/web/assets/css/core/_core_text.scss @@ -0,0 +1,39 @@ +[style*="color"], body, input, ._42rv, ._4qau, ._dwm .descArea, ._eu5, +._1tcc, ._3g9-, ._29z_, ._3xz7, ._ib-, ._3bg5 ._56dq, ._477i, ._2vxk, +.touched *, ._1_yj, ._1_yl, ._4pj9, ._2bdc, ._3qdh ._3qdn ._3qdk, ._3qdk ._48_q, +._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._2ip_, ._403p, .cq, ._usr, +._5xu2, ._3ml8, ._3mla, ._50vk, ._1m2u, ._31y7, ._4kcb, ._1lf6, ._1lf5, +._1lf4, ._1hiz, ._xod, ._5ag5, ._zmk, ._3t_h, ._5lm6, ._3clv, ._3zlc, ._36rd, +._31zk, ._31zl, ._3xsa, ._3xs9, ._2-4s, ._2fzz ul, ._3z10, +._43mh, .touch .btn, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, +._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, +._18qg, ._1_ac, ._529p, ._4dwt ._1vh3, ._4a5f, ._23_t, ._2rzc, ._23_s, ._2rzd, +._5aga, ._5ag9, ._537a, .acy, ._5ro_, ._6-l ._2us7, ._4mp, ._2b08, ._36e0, ._4-dy, +._14v5 ._14v8, ._1440, ._1442, ._1448, ._4ks_, .mCount, ._27vc, ._24e1, ._2rbw, ._3iyw ._3mzw, +textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, +._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, +._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._38d-, ._3n8y, ._38dt, ._3oyg, +._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, +._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, +._2new, .appCenterCategorySelectorButton, ._1ksq, ._1kt6, ._6ber, ._mxb, ._3oyd, +div.sharerSelector, .footer, ._4pv_, ._1dbp, ._3kad, ._20zc, ._2i5v, ._2i5w, +a, ._5fpq, ._4gux, ._3bg5 ._52x1, ._3bg5 ._52x2, ._6dsj ._3gin, ._hdn._hdn, +.mentions-input, .mentions-placeholder, .largeStatusBox .placeHolder, .fcw, +._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, +._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, +h1, h2, h3, h4, h5, h6 { + color: $text !important; +} + +strong > a, ._15ks ._2q8z._2q8z, ._1e3e, .blueName { + color: $accent !important; +} + +._42nf ._42ng { + color: transparent !important; +} + +// most links do not have a special color. We will highlight those in posts and messages +p > a, .msg span > a { + color: $link !important; +} \ No newline at end of file diff --git a/app/src/web/assets/css/core/_main.scss b/app/src/web/assets/css/core/_main.scss new file mode 100644 index 00000000..3e972f93 --- /dev/null +++ b/app/src/web/assets/css/core/_main.scss @@ -0,0 +1,6 @@ +@import "core"; +@import "svg"; + +//this file is used as the base for all themes +//given that svgs take a lot of characters, we won't compile them when testing +//therefore we use the core scss diff --git a/app/src/web/assets/css/core/_svg.scss b/app/src/web/assets/css/core/_svg.scss new file mode 100644 index 00000000..8c714438 --- /dev/null +++ b/app/src/web/assets/css/core/_svg.scss @@ -0,0 +1,74 @@ +// icons courtesy of https://material.io/icons/ + +$camera: ''; + +// status upload image +._50uu { + @include background-svg($camera); +} + +$video: ''; + +// status upload video +._50uw { + @include background-svg($video); +} + +$like: ''; +$like_selected: ''; + +// 2018/12/29 +// Previously ._15km ._15ko::before and ._15km ._15ko._77la::before; however, reaction changes no longer affect this element +// The robust measure seems to be the parent of a[data-sigil~="like-reaction-flyout"] along with [data-sigil~="like"] for an unliked post +// and [data-sigil~="unlike"] for a liked post +._15km ._15ko::before { + @include background-svg($like); + background-position: center !important; +} + +._15km ._15ko._77la::before { + @include background-svg($like_selected); + background-position: center !important; +} + +$comment: ''; + +._15km ._15kq::before { + @include background-svg($comment); + background-position: center !important; +} + +$share: ''; + +._15km ._15kr::before { + @include background-svg($share); + background-position: center !important; +} + +$more_horiz: ''; + +//$menus: ".sp_89zNula0Qh5", +//".sp_MP2OtCXORz9", +//".sp_NIWBacTn8LF", +//// 2018/12/31 +//".sp_9ZFVhnFyWsw", +//// 2019/01/03 +//".sp_SJIJjSlGEIO"; +// +//$menu_collector: (); +// +//@each $menu in $menus { +// $menu_collector: append($menu_collector, unquote('#{$menu}'), 'comma'); +// $menu_collector: append($menu_collector, unquote('#{$menu}_2x'), 'comma'); +// $menu_collector: append($menu_collector, unquote('#{$menu}_3x'), 'comma'); +//} +// +//#{$menu_collector} { +// @include background-svg($more_horiz); +// background-position: center !important; +//} + +.story_body_container i.img[data-sigil*="story-popup-context"] { + @include background-svg($more_horiz); + background-position: center !important; +} \ No newline at end of file diff --git a/app/src/web/assets/css/core/core.css b/app/src/web/assets/css/core/core.css new file mode 100644 index 00000000..1d48fa35 --- /dev/null +++ b/app/src/web/assets/css/core/core.css @@ -0,0 +1,306 @@ +[style*=color], body, input, ._42rv, ._4qau, ._dwm .descArea, ._eu5, +._1tcc, ._3g9-, ._29z_, ._3xz7, ._ib-, ._3bg5 ._56dq, ._477i, ._2vxk, +.touched *, ._1_yj, ._1_yl, ._4pj9, ._2bdc, ._3qdh ._3qdn ._3qdk, ._3qdk ._48_q, +._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._2ip_, ._403p, .cq, ._usr, +._5xu2, ._3ml8, ._3mla, ._50vk, ._1m2u, ._31y7, ._4kcb, ._1lf6, ._1lf5, +._1lf4, ._1hiz, ._xod, ._5ag5, ._zmk, ._3t_h, ._5lm6, ._3clv, ._3zlc, ._36rd, +._31zk, ._31zl, ._3xsa, ._3xs9, ._2-4s, ._2fzz ul, ._3z10, +._43mh, .touch .btn, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, +._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, +._18qg, ._1_ac, ._529p, ._4dwt ._1vh3, ._4a5f, ._23_t, ._2rzc, ._23_s, ._2rzd, +._5aga, ._5ag9, ._537a, .acy, ._5ro_, ._6-l ._2us7, ._4mp, ._2b08, ._36e0, ._4-dy, +._14v5 ._14v8, ._1440, ._1442, ._1448, ._4ks_, .mCount, ._27vc, ._24e1, ._2rbw, ._3iyw ._3mzw, +textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, +._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, +._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._38d-, ._3n8y, ._38dt, ._3oyg, +._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, +._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, +._2new, .appCenterCategorySelectorButton, ._1ksq, ._1kt6, ._6ber, ._mxb, ._3oyd, +div.sharerSelector, .footer, ._4pv_, ._1dbp, ._3kad, ._20zc, ._2i5v, ._2i5w, +a, ._5fpq, ._4gux, ._3bg5 ._52x1, ._3bg5 ._52x2, ._6dsj ._3gin, ._hdn._hdn, +.mentions-input, .mentions-placeholder, .largeStatusBox .placeHolder, .fcw, +._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, +._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, +h1, h2, h3, h4, h5, h6 { + color: #d7b0d7 !important; +} + +strong > a, ._15ks ._2q8z._2q8z, ._1e3e, .blueName { + color: #3b5998 !important; +} + +._42nf ._42ng { + color: transparent !important; +} + +p > a, .msg span > a { + color: #9266d5 !important; +} + +#viewport { + background: #451515 !important; +} + +body, :root, #root, #header, #MComposer, [style*=background-color], ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, +._5lp5, .container, .subpage, ._5n_f, #static_templates, ._22_8, ._1t4h, ._uoq, ._3qdh, ._8ca, ._3h8i, +._6-l ._2us7, ._6-l ._6-p, ._333v, div.sharerSelector, ._529j, ._305j, ._1pph, ._3t_l, ._4pvz, +._1g05, .acy, ._51-g, ._533c, ._ib-, .sharerAttachmentEmpty, .sharerBottomWrapper, ._24e1, ._-j7, +._3bg5 ._56do, ._5hfh, ._52e-, .mQuestionsPollResultsBar, ._5hoc, ._5oxw, ._32_4, ._1hiz, +._38do, .bo, .cq, ._234-, ._a-5, ._2zh4, ._15ks, ._3oyc, ._36dc, ._3iyw ._3iyx, ._6bes, ._55wo, ._4-dy, +.tlBody, #timelineBody, .timelineX, .timeline, .feed, .tlPrelude, .tlFeedPlaceholder, ._4_d0, +.al, ._1gkq, ._5c5b, ._1qxg, ._5luf, ._2new, ._cld, ._3zvb, ._2nk0, .btnD, .btnI, ._2bdb, ._3ci9, +._11ub, ._5p7j, ._55wm, ._5rgs, ._5xuj, ._1sv1, ._45fu, ._18qg, ._1_ac, ._5w3g, ._3e18, ._6be7, +._5q_r, ._5yt8, ._idb, ._2ip_, ._f6s, ._2l5v, ._8i2, ._kr5, ._2q7u, ._2q7v, ._5xp2, div.fullwidthMore, +._577z, ._2u4w, ._3u9p, ._3u9t, ._cw4, ._5_y-, ._5_y_, ._5_z3, ._cwy, ._5_z0, ._voz, ._vos, +._5_z1, ._5_z2, ._2mtc, ._206a, ._1_-1, ._1ybg, .appCenterCategorySelectorButton, ._5_ee, ._3clk, +._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, +._55wm, ._2om3, ._2ol-, ._1f9d, ._vee, ._31a-, ._3r8b, ._3r9d, ._5vq5, ._3tl8, ._65wz, ._4edl, +.acw, ._4_xl, ._1p70, ._1p70, ._1ih_, ._51v6, ._u2c, ._484w, ._3ils, ._rm7, ._32qk, ._d01, ._1glm, +._ue6, ._hdn._hdn, +._2y60, ._5fu3, ._2foa, ._2y5_, ._38o9, ._1kb, .mAppCenterFatLabel, ._3bmj, ._5zmb, ._2x2s, ._3kac, ._3kad, +._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, +._4l9b, ._4gj3, .groupChromeView, ._i3g, ._3jcf, .error, ._1dbp, ._5zma, ._6beq, ._vi6, +._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1, ._35au, ._cwy, +._1rfn ._1rfk ._4vc-, ._1rfk, ._1rfk ._2v9s, ._301x { + background: rgba(255, 0, 255, 0.02) !important; +} + +._31nf, ._2v9s, ._d4i, article._55wo, ._10c_, ._2jl2, ._55wo, ._6150, ._50mi, ._4-dw, ._4_2z { + background: #239645 !important; +} + +.aclb { + background: #ff4682 !important; +} + +._cv_, ._2sq8 { + background-color: rgba(255, 0, 255, 0.02) !important; +} + +#page, ._8l7, ._-j8, ._-j9, ._6o5v { + background: transparent !important; +} + +.jewel, .flyout, ._52z5, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p, .mentions-suggest-item, ._2suk, +.mentions-suggest, ._1xoz, ._1xow { + background: #451515 !important; +} + +._403n, ._14v5 ._14v8, ._1-kc { + background: #c74646 !important; +} + +button:not([style*=image]):not(.privacyButtons), button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, +._590n, ._4g8h, ._2cpp, ._58a0.touched:after, +.timeline .timelinePublisher, .touched, .sharerAttachment, +.item a.primary.touched .primarywrap, ._38nq, ._537a, +._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._55fj, +.excessItem, .acr, ._5-lx, ._3g9-, ._55ws, ._6dsj ._3gin, ._69aj, +._4e8n, ._5pxa._3uj9, ._5n_5, ._u2d, ._56bu::before, ._5h8f, ._d00, ._2066, ._2k51, +._10sb li.selected, ._2z4j, ._ib-, ._1bhl, ._5a5j, +._2b06, ._2tsf, ._3gka, .mCount, ._27vc, ._4pv-, ._6pk5, +._4qax, ._4756, ._w34, ._56bv::before, ._5769, ._34iv, ._z-w, ._t21, .mToken, +#addMembersTypeahead .mToken.mTokenWeakReference, +.acbk { + background: rgba(199, 70, 70, 0.35) !important; +} + +.mQuestionsPollResultsBar .shaded { + background: #3b5998 !important; +} + +._220g, ._1_y8:after, ._6pk6, +._2zh4::before, ._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, +._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { + background: rgba(215, 176, 215, 0.3) !important; +} + +button ._v89 ._54k8._1fl1 { + background: #3b5998 !important; +} + +._15kl::before, ._37fd .inlineComposerButton, ._1hb:before, +._5j35::after, ._2k4b, ._3to7, ._4nw8 { + border-left: 1px solid rgba(215, 176, 215, 0.3) !important; +} + +._4_d1, ._5cni { + border-right: 1px solid rgba(215, 176, 215, 0.3) !important; +} + +._1mx0, ._1rbr, ._5yt8, ._idb, ._cld, ._1e8h, ._z-w, ._1ha, ._1n8h ._1oby, ._5f99, ._2t39, +._2pbp, ._5rou:first-child, ._egf:first-child, ._io2, ._3qdi ._48_m::after, +._15n_, ._3-2-, ._27ve, ._2s20, ._gui, ._2s21 > *::after, ._32qk, ._d00, ._d01, ._38o9, +._3u9t, ._55fj, .mEventProfileSection.useBorder td, ._3ils, ._5as0, ._5as2, +._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._56d8, .al { + border-top: 1px solid rgba(215, 176, 215, 0.3) !important; +} + +._15ny::after, ._z-w, ._8i2, ._2nk0, ._22_8, ._1t4h, ._37fd, ._1ha, ._3bg5 ._56do, ._8he, +._400s, ._5hoc, ._1bhn, ._5ag6, ._4pvz, +._301x, ._x08 ._x0a:after, ._36dc, ._6-l ._57jn, ._527k, ._g_k, +._577z:not(:last-child) ._ygd, ._3u9u, ._3mgz, ._52x6, ._2066, ._5luf, ._2bdc, ._3ci9, +.mAppCenterFatLabel, .appCenterCategorySelectorButton, ._1q6v, ._5q_r, ._5yt8, ._38do, ._38dt, +._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .error, ._35--, ._1wev, +.jx-result, ._1f9d, ._vef, ._55x2 > *, .al, ._44qk, ._5rgs, ._5xuj, ._1sv1, ._idb, +._5lp5, ._3-2-, ._3to6, ._ir5, ._4nw6, ._4nwh, ._27ve, div._51v6::before, +._3c9h::before, ._2s20, ._gui, ._5jku, ._2foa, ._2y60, ._5fu3, ._4en9, ._1kb:not(:last-child) ._1kc, +._5pz4, ._5lp4, ._5lp5, ._5h6z, ._5h6x, ._2om4, ._5fjw > div, ._5fjv > :first-child, +._5fjw > :first-child { + border-bottom: 1px solid rgba(215, 176, 215, 0.3) !important; +} + +.item a.primary.touched .primarywrap, ._4dwt ._5y33, ._1ih_, ._5_50, ._6beq, ._69aj, +._5fjv, ._3on6, ._2u4w, ._2om3, ._2ol-, ._5fjw, ._4z83, ._1gkq, ._4-dy { + border-top: 1px solid rgba(215, 176, 215, 0.3) !important; + border-bottom: 1px solid rgba(215, 176, 215, 0.3) !important; +} + +._d4i, ._f6s, .mentions-suggest-item, .mentions-suggest, .sharerAttachment, +.mToken, #addMembersTypeahead .mToken.mTokenWeakReference, .mQuestionsPollResultsBar, +._15q7, ._2q7v, ._4dwt ._16ii, ._3qdi::after, +._2q7w, .acy, ._58ak, ._3t_l, ._4msa, ._3h8i, ._3clk, ._1kt6, ._1ksq, +._1_y5, ._lr0, ._5hgt, ._2cpp, ._50uu, ._50uw, ._31yd, ._1e3d, ._3xz7, ._1xoz, +._4kcb, ._2lut, .jewel .touchable-notification.touched, .touchable-notification .touchable.touched, +.home-notification .touchable.touched, ._6beo ._6ber, +._73ku ._73jw, +._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, +._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf, ._4756, ._1rrd, ._5n_f { + border: 1px solid rgba(215, 176, 215, 0.3) !important; +} + +.mQuestionsPollResultsBar .shaded, ._1027._13sm { + border: 1px solid #d7b0d7 !important; +} + +._3gka { + border: 1px dashed rgba(215, 176, 215, 0.3) !important; +} + +._4o58::after, .acr, ._t21, ._2bdb, +.acw, .aclb, ._4qax, ._5h8f { + border-color: rgba(215, 176, 215, 0.3) !important; +} + +._15ks ._15kl::before { + border-left: 1px solid transparent !important; +} + +._56bf, .touch .btn { + border-radius: 0 !important; + border: 0 !important; +} + +._2cis { + border-left: 10px solid rgba(255, 0, 255, 0.02) !important; + border-right: 10px solid rgba(255, 0, 255, 0.02) !important; +} + +._2cir.selected, ._42rv, ._5zma, ._2x2s { + border-bottom: 3px solid #d7b0d7 !important; +} + +._1ss6 { + border-left: 2px solid #d7b0d7 !important; +} + +._484w.selected > ._6zf, ._5kqs::after, ._3lvo ._5xum._5xuk, ._x0b { + border-bottom: 1px solid #d7b0d7 !important; +} + +._34ee { + background: rgba(199, 70, 70, 0.35) !important; + color: #d7b0d7 !important; +} + +._34em ._34ee { + background: #3b5998 !important; + color: #76d7c2 !important; +} + +._5as0, ._5cni, ._5as2 { + background: #451515 !important; +} + +*, *::after, *::before { + text-shadow: none !important; + box-shadow: none !important; +} + +[data-sigil=m_login_upsell], +[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { + display: none !important; +} + +::-webkit-input-placeholder { + color: #d7b0d7 !important; +} + +:-moz-placeholder { + color: #d7b0d7 !important; +} + +::-moz-placeholder { + color: #d7b0d7 !important; +} + +:-ms-input-placeholder { + color: #d7b0d7 !important; +} + +.excessItem { + outline: rgba(215, 176, 215, 0.3) !important; +} + +._3m1m { + background: linear-gradient(transparent, #451515) !important; +} + +@-webkit-keyframes highlightFade { + 0%, 50% { + background: rgba(199, 70, 70, 0.35); + } + 100% { + background: rgba(255, 0, 255, 0.02); + } +} +@-moz-keyframes highlightFade { + 0%, 50% { + background: rgba(199, 70, 70, 0.35); + } + 100% { + background: rgba(255, 0, 255, 0.02); + } +} +@keyframes highlightFade { + 0%, 50% { + background: rgba(199, 70, 70, 0.35); + } + 100% { + background: rgba(255, 0, 255, 0.02); + } +} +@-webkit-keyframes chatHighlightAnimation { + 0%, 100% { + background: rgba(255, 0, 255, 0.02); + } + 50% { + background: rgba(199, 70, 70, 0.35); + } +} +@-moz-keyframes chatHighlightAnimation { + 0%, 100% { + background: rgba(255, 0, 255, 0.02); + } + 50% { + background: rgba(199, 70, 70, 0.35); + } +} +@keyframes chatHighlightAnimation { + 0%, 100% { + background: rgba(255, 0, 255, 0.02); + } + 50% { + background: rgba(199, 70, 70, 0.35); + } +} diff --git a/app/src/web/assets/css/core/core.scss b/app/src/web/assets/css/core/core.scss new file mode 100644 index 00000000..38086529 --- /dev/null +++ b/app/src/web/assets/css/core/core.scss @@ -0,0 +1,54 @@ +@import "colors"; +@import "base"; +@import "core_text"; +@import "core_bg"; +@import "core_border"; +@import "core_messenger"; + +//GLOBAL overrides; use with caution +*, *::after, *::before { + text-shadow: none !important; + box-shadow: none !important; +} + +// .touch .btnS, button, ._94v, ._590n { +// box-shadow: none !important; +// } + +[data-sigil=m_login_upsell], +[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { + display: none !important; +} + +@include placeholder { + color: $text !important; +} + +.excessItem { + outline: $divider !important; +} + +._3m1m { + background: linear-gradient(transparent, $bg_opaque) !important; +} + +//new comment +@include keyframes(highlightFade) { + 0%, 50% { + background: $background2; + } + + 100% { + background: $bg_transparent; + } +} + +@include keyframes(chatHighlightAnimation) { + 0%, 100% { + background: $bg_transparent; + } + + 50% { + background: $background2; + } +} diff --git a/app/src/web/assets/css/themes/.gitignore b/app/src/web/assets/css/themes/.gitignore new file mode 100644 index 00000000..01d06441 --- /dev/null +++ b/app/src/web/assets/css/themes/.gitignore @@ -0,0 +1,2 @@ +test.scss +test.css \ No newline at end of file diff --git a/app/src/web/assets/css/themes/custom.css b/app/src/web/assets/css/themes/custom.css new file mode 100644 index 00000000..e38c6de0 --- /dev/null +++ b/app/src/web/assets/css/themes/custom.css @@ -0,0 +1,338 @@ +[style*=color], body, input, ._42rv, ._4qau, ._dwm .descArea, ._eu5, +._1tcc, ._3g9-, ._29z_, ._3xz7, ._ib-, ._3bg5 ._56dq, ._477i, ._2vxk, +.touched *, ._1_yj, ._1_yl, ._4pj9, ._2bdc, ._3qdh ._3qdn ._3qdk, ._3qdk ._48_q, +._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._2ip_, ._403p, .cq, ._usr, +._5xu2, ._3ml8, ._3mla, ._50vk, ._1m2u, ._31y7, ._4kcb, ._1lf6, ._1lf5, +._1lf4, ._1hiz, ._xod, ._5ag5, ._zmk, ._3t_h, ._5lm6, ._3clv, ._3zlc, ._36rd, +._31zk, ._31zl, ._3xsa, ._3xs9, ._2-4s, ._2fzz ul, ._3z10, +._43mh, .touch .btn, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, +._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, +._18qg, ._1_ac, ._529p, ._4dwt ._1vh3, ._4a5f, ._23_t, ._2rzc, ._23_s, ._2rzd, +._5aga, ._5ag9, ._537a, .acy, ._5ro_, ._6-l ._2us7, ._4mp, ._2b08, ._36e0, ._4-dy, +._14v5 ._14v8, ._1440, ._1442, ._1448, ._4ks_, .mCount, ._27vc, ._24e1, ._2rbw, ._3iyw ._3mzw, +textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, +._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, +._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._38d-, ._3n8y, ._38dt, ._3oyg, +._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, +._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, +._2new, .appCenterCategorySelectorButton, ._1ksq, ._1kt6, ._6ber, ._mxb, ._3oyd, +div.sharerSelector, .footer, ._4pv_, ._1dbp, ._3kad, ._20zc, ._2i5v, ._2i5w, +a, ._5fpq, ._4gux, ._3bg5 ._52x1, ._3bg5 ._52x2, ._6dsj ._3gin, ._hdn._hdn, +.mentions-input, .mentions-placeholder, .largeStatusBox .placeHolder, .fcw, +._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, +._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, +h1, h2, h3, h4, h5, h6 { + color: $T$ !important; +} + +strong > a, ._15ks ._2q8z._2q8z, ._1e3e, .blueName { + color: $A$ !important; +} + +._42nf ._42ng { + color: transparent !important; +} + +p > a, .msg span > a { + color: $TT$ !important; +} + +#viewport { + background: $B$ !important; +} + +body, :root, #root, #header, #MComposer, [style*=background-color], ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, +._5lp5, .container, .subpage, ._5n_f, #static_templates, ._22_8, ._1t4h, ._uoq, ._3qdh, ._8ca, ._3h8i, +._6-l ._2us7, ._6-l ._6-p, ._333v, div.sharerSelector, ._529j, ._305j, ._1pph, ._3t_l, ._4pvz, +._1g05, .acy, ._51-g, ._533c, ._ib-, .sharerAttachmentEmpty, .sharerBottomWrapper, ._24e1, ._-j7, +._3bg5 ._56do, ._5hfh, ._52e-, .mQuestionsPollResultsBar, ._5hoc, ._5oxw, ._32_4, ._1hiz, +._38do, .bo, .cq, ._234-, ._a-5, ._2zh4, ._15ks, ._3oyc, ._36dc, ._3iyw ._3iyx, ._6bes, ._55wo, ._4-dy, +.tlBody, #timelineBody, .timelineX, .timeline, .feed, .tlPrelude, .tlFeedPlaceholder, ._4_d0, +.al, ._1gkq, ._5c5b, ._1qxg, ._5luf, ._2new, ._cld, ._3zvb, ._2nk0, .btnD, .btnI, ._2bdb, ._3ci9, +._11ub, ._5p7j, ._55wm, ._5rgs, ._5xuj, ._1sv1, ._45fu, ._18qg, ._1_ac, ._5w3g, ._3e18, ._6be7, +._5q_r, ._5yt8, ._idb, ._2ip_, ._f6s, ._2l5v, ._8i2, ._kr5, ._2q7u, ._2q7v, ._5xp2, div.fullwidthMore, +._577z, ._2u4w, ._3u9p, ._3u9t, ._cw4, ._5_y-, ._5_y_, ._5_z3, ._cwy, ._5_z0, ._voz, ._vos, +._5_z1, ._5_z2, ._2mtc, ._206a, ._1_-1, ._1ybg, .appCenterCategorySelectorButton, ._5_ee, ._3clk, +._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, +._55wm, ._2om3, ._2ol-, ._1f9d, ._vee, ._31a-, ._3r8b, ._3r9d, ._5vq5, ._3tl8, ._65wz, ._4edl, +.acw, ._4_xl, ._1p70, ._1p70, ._1ih_, ._51v6, ._u2c, ._484w, ._3ils, ._rm7, ._32qk, ._d01, ._1glm, +._ue6, ._hdn._hdn, +._2y60, ._5fu3, ._2foa, ._2y5_, ._38o9, ._1kb, .mAppCenterFatLabel, ._3bmj, ._5zmb, ._2x2s, ._3kac, ._3kad, +._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, +._4l9b, ._4gj3, .groupChromeView, ._i3g, ._3jcf, .error, ._1dbp, ._5zma, ._6beq, ._vi6, +._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1, ._35au, ._cwy, +._1rfn ._1rfk ._4vc-, ._1rfk, ._1rfk ._2v9s, ._301x { + background: $BT$ !important; +} + +._31nf, ._2v9s, ._d4i, article._55wo, ._10c_, ._2jl2, ._55wo, ._6150, ._50mi, ._4-dw, ._4_2z { + background: $C$ !important; +} + +.aclb { + background: $TI$ !important; +} + +._cv_, ._2sq8 { + background-color: $BT$ !important; +} + +#page, ._8l7, ._-j8, ._-j9, ._6o5v { + background: transparent !important; +} + +.jewel, .flyout, ._52z5, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p, .mentions-suggest-item, ._2suk, +.mentions-suggest, ._1xoz, ._1xow { + background: $O$ !important; +} + +._403n, ._14v5 ._14v8, ._1-kc { + background: $OO$ !important; +} + +button:not([style*=image]):not(.privacyButtons), button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, +._590n, ._4g8h, ._2cpp, ._58a0.touched:after, +.timeline .timelinePublisher, .touched, .sharerAttachment, +.item a.primary.touched .primarywrap, ._38nq, ._537a, +._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._55fj, +.excessItem, .acr, ._5-lx, ._3g9-, ._55ws, ._6dsj ._3gin, ._69aj, +._4e8n, ._5pxa._3uj9, ._5n_5, ._u2d, ._56bu::before, ._5h8f, ._d00, ._2066, ._2k51, +._10sb li.selected, ._2z4j, ._ib-, ._1bhl, ._5a5j, +._2b06, ._2tsf, ._3gka, .mCount, ._27vc, ._4pv-, ._6pk5, +._4qax, ._4756, ._w34, ._56bv::before, ._5769, ._34iv, ._z-w, ._t21, .mToken, +#addMembersTypeahead .mToken.mTokenWeakReference, +.acbk { + background: $BBT$ !important; +} + +.mQuestionsPollResultsBar .shaded { + background: $A$ !important; +} + +._220g, ._1_y8:after, ._6pk6, +._2zh4::before, ._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, +._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { + background: $D$ !important; +} + +button ._v89 ._54k8._1fl1 { + background: $A$ !important; +} + +._15kl::before, ._37fd .inlineComposerButton, ._1hb:before, +._5j35::after, ._2k4b, ._3to7, ._4nw8 { + border-left: 1px solid $D$ !important; +} + +._4_d1, ._5cni { + border-right: 1px solid $D$ !important; +} + +._1mx0, ._1rbr, ._5yt8, ._idb, ._cld, ._1e8h, ._z-w, ._1ha, ._1n8h ._1oby, ._5f99, ._2t39, +._2pbp, ._5rou:first-child, ._egf:first-child, ._io2, ._3qdi ._48_m::after, +._15n_, ._3-2-, ._27ve, ._2s20, ._gui, ._2s21 > *::after, ._32qk, ._d00, ._d01, ._38o9, +._3u9t, ._55fj, .mEventProfileSection.useBorder td, ._3ils, ._5as0, ._5as2, +._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._56d8, .al { + border-top: 1px solid $D$ !important; +} + +._15ny::after, ._z-w, ._8i2, ._2nk0, ._22_8, ._1t4h, ._37fd, ._1ha, ._3bg5 ._56do, ._8he, +._400s, ._5hoc, ._1bhn, ._5ag6, ._4pvz, +._301x, ._x08 ._x0a:after, ._36dc, ._6-l ._57jn, ._527k, ._g_k, +._577z:not(:last-child) ._ygd, ._3u9u, ._3mgz, ._52x6, ._2066, ._5luf, ._2bdc, ._3ci9, +.mAppCenterFatLabel, .appCenterCategorySelectorButton, ._1q6v, ._5q_r, ._5yt8, ._38do, ._38dt, +._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .error, ._35--, ._1wev, +.jx-result, ._1f9d, ._vef, ._55x2 > *, .al, ._44qk, ._5rgs, ._5xuj, ._1sv1, ._idb, +._5lp5, ._3-2-, ._3to6, ._ir5, ._4nw6, ._4nwh, ._27ve, div._51v6::before, +._3c9h::before, ._2s20, ._gui, ._5jku, ._2foa, ._2y60, ._5fu3, ._4en9, ._1kb:not(:last-child) ._1kc, +._5pz4, ._5lp4, ._5lp5, ._5h6z, ._5h6x, ._2om4, ._5fjw > div, ._5fjv > :first-child, +._5fjw > :first-child { + border-bottom: 1px solid $D$ !important; +} + +.item a.primary.touched .primarywrap, ._4dwt ._5y33, ._1ih_, ._5_50, ._6beq, ._69aj, +._5fjv, ._3on6, ._2u4w, ._2om3, ._2ol-, ._5fjw, ._4z83, ._1gkq, ._4-dy { + border-top: 1px solid $D$ !important; + border-bottom: 1px solid $D$ !important; +} + +._d4i, ._f6s, .mentions-suggest-item, .mentions-suggest, .sharerAttachment, +.mToken, #addMembersTypeahead .mToken.mTokenWeakReference, .mQuestionsPollResultsBar, +._15q7, ._2q7v, ._4dwt ._16ii, ._3qdi::after, +._2q7w, .acy, ._58ak, ._3t_l, ._4msa, ._3h8i, ._3clk, ._1kt6, ._1ksq, +._1_y5, ._lr0, ._5hgt, ._2cpp, ._50uu, ._50uw, ._31yd, ._1e3d, ._3xz7, ._1xoz, +._4kcb, ._2lut, .jewel .touchable-notification.touched, .touchable-notification .touchable.touched, +.home-notification .touchable.touched, ._6beo ._6ber, +._73ku ._73jw, +._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, +._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf, ._4756, ._1rrd, ._5n_f { + border: 1px solid $D$ !important; +} + +.mQuestionsPollResultsBar .shaded, ._1027._13sm { + border: 1px solid $T$ !important; +} + +._3gka { + border: 1px dashed $D$ !important; +} + +._4o58::after, .acr, ._t21, ._2bdb, +.acw, .aclb, ._4qax, ._5h8f { + border-color: $D$ !important; +} + +._15ks ._15kl::before { + border-left: 1px solid transparent !important; +} + +._56bf, .touch .btn { + border-radius: 0 !important; + border: 0 !important; +} + +._2cis { + border-left: 10px solid $BT$ !important; + border-right: 10px solid $BT$ !important; +} + +._2cir.selected, ._42rv, ._5zma, ._2x2s { + border-bottom: 3px solid $T$ !important; +} + +._1ss6 { + border-left: 2px solid $T$ !important; +} + +._484w.selected > ._6zf, ._5kqs::after, ._3lvo ._5xum._5xuk, ._x0b { + border-bottom: 1px solid $T$ !important; +} + +._34ee { + background: $BBT$ !important; + color: $T$ !important; +} + +._34em ._34ee { + background: $A$ !important; + color: $AT$ !important; +} + +._5as0, ._5cni, ._5as2 { + background: $O$ !important; +} + +*, *::after, *::before { + text-shadow: none !important; + box-shadow: none !important; +} + +[data-sigil=m_login_upsell], +[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { + display: none !important; +} + +::-webkit-input-placeholder { + color: $T$ !important; +} + +:-moz-placeholder { + color: $T$ !important; +} + +::-moz-placeholder { + color: $T$ !important; +} + +:-ms-input-placeholder { + color: $T$ !important; +} + +.excessItem { + outline: $D$ !important; +} + +._3m1m { + background: linear-gradient(transparent, $O$) !important; +} + +@-webkit-keyframes highlightFade { + 0%, 50% { + background: $BBT$; + } + 100% { + background: $BT$; + } +} +@-moz-keyframes highlightFade { + 0%, 50% { + background: $BBT$; + } + 100% { + background: $BT$; + } +} +@keyframes highlightFade { + 0%, 50% { + background: $BBT$; + } + 100% { + background: $BT$; + } +} +@-webkit-keyframes chatHighlightAnimation { + 0%, 100% { + background: $BT$; + } + 50% { + background: $BBT$; + } +} +@-moz-keyframes chatHighlightAnimation { + 0%, 100% { + background: $BT$; + } + 50% { + background: $BBT$; + } +} +@keyframes chatHighlightAnimation { + 0%, 100% { + background: $BT$; + } + 50% { + background: $BBT$; + } +} +._50uu { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="$T$" viewBox="0 -10 50 50"%3E%3Ccircle cx="25" cy="23" r="3.2"/%3E%3Cpath d="M22 13l-1.83 2H17c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V17c0-1.1-.9-2-2-2h-3.17L28 13h-6zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"/%3E%3Cpath fill="none" d="M13 11h24v24H13z"/%3E%3C/svg%3E') no-repeat !important; +} + +._50uw { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="$T$" viewBox="0 0 50 50"%3E%3Cpath fill="none" d="M13 26h24v24H13z"/%3E%3Cpath d="M30 31.5V28c0-.55-.45-1-1-1H17c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4z"/%3E%3C/svg%3E') no-repeat !important; +} + +._15km ._15ko::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="$T$" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-1.91l-.01-.01L23 10z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15ko._77la::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="$A$" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-1.91l-.01-.01L23 10z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15kq::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="$T$" viewBox="0 0 24 24"%3E%3Cpath d="M21.99 4c0-1.1-.89-2-1.99-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4-.01-18z"/%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15kr::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="$T$" viewBox="0 0 24 24"%3E%3Cpath d="M14 9V5l7 7-7 7v-4.1c-5 0-8.5 1.6-11 5.1 1-5 4-10 11-11z"/%3E%3Cpath fill="none" d="M24 0H0v24h24z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +.story_body_container i.img[data-sigil*=story-popup-context] { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath fill="$T$" d="M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} diff --git a/app/src/web/assets/css/themes/custom.scss b/app/src/web/assets/css/themes/custom.scss new file mode 100644 index 00000000..50c029fb --- /dev/null +++ b/app/src/web/assets/css/themes/custom.scss @@ -0,0 +1,14 @@ +$bg_transparent: unquote('$BT$'); +$text: unquote('$T$'); +$link: unquote('$TT$'); +$accent: unquote('$A$'); +$accent_text: unquote('$AT$'); +$background: unquote('$B$'); +$background2: unquote('$BBT$'); +$bg_opaque: unquote('$O$'); +$bg_opaque2: unquote('$OO$'); +$divider: unquote('$D$'); +$card: unquote('$C$'); +$tint: unquote('$TI$'); + +@import "../core/main"; diff --git a/app/src/web/assets/css/themes/material_amoled.css b/app/src/web/assets/css/themes/material_amoled.css new file mode 100644 index 00000000..c821003e --- /dev/null +++ b/app/src/web/assets/css/themes/material_amoled.css @@ -0,0 +1,338 @@ +[style*=color], body, input, ._42rv, ._4qau, ._dwm .descArea, ._eu5, +._1tcc, ._3g9-, ._29z_, ._3xz7, ._ib-, ._3bg5 ._56dq, ._477i, ._2vxk, +.touched *, ._1_yj, ._1_yl, ._4pj9, ._2bdc, ._3qdh ._3qdn ._3qdk, ._3qdk ._48_q, +._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._2ip_, ._403p, .cq, ._usr, +._5xu2, ._3ml8, ._3mla, ._50vk, ._1m2u, ._31y7, ._4kcb, ._1lf6, ._1lf5, +._1lf4, ._1hiz, ._xod, ._5ag5, ._zmk, ._3t_h, ._5lm6, ._3clv, ._3zlc, ._36rd, +._31zk, ._31zl, ._3xsa, ._3xs9, ._2-4s, ._2fzz ul, ._3z10, +._43mh, .touch .btn, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, +._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, +._18qg, ._1_ac, ._529p, ._4dwt ._1vh3, ._4a5f, ._23_t, ._2rzc, ._23_s, ._2rzd, +._5aga, ._5ag9, ._537a, .acy, ._5ro_, ._6-l ._2us7, ._4mp, ._2b08, ._36e0, ._4-dy, +._14v5 ._14v8, ._1440, ._1442, ._1448, ._4ks_, .mCount, ._27vc, ._24e1, ._2rbw, ._3iyw ._3mzw, +textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, +._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, +._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._38d-, ._3n8y, ._38dt, ._3oyg, +._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, +._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, +._2new, .appCenterCategorySelectorButton, ._1ksq, ._1kt6, ._6ber, ._mxb, ._3oyd, +div.sharerSelector, .footer, ._4pv_, ._1dbp, ._3kad, ._20zc, ._2i5v, ._2i5w, +a, ._5fpq, ._4gux, ._3bg5 ._52x1, ._3bg5 ._52x2, ._6dsj ._3gin, ._hdn._hdn, +.mentions-input, .mentions-placeholder, .largeStatusBox .placeHolder, .fcw, +._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, +._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, +h1, h2, h3, h4, h5, h6 { + color: #fff !important; +} + +strong > a, ._15ks ._2q8z._2q8z, ._1e3e, .blueName { + color: #5d86dd !important; +} + +._42nf ._42ng { + color: transparent !important; +} + +p > a, .msg span > a { + color: #5d86dd !important; +} + +#viewport { + background: #000 !important; +} + +body, :root, #root, #header, #MComposer, [style*=background-color], ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, +._5lp5, .container, .subpage, ._5n_f, #static_templates, ._22_8, ._1t4h, ._uoq, ._3qdh, ._8ca, ._3h8i, +._6-l ._2us7, ._6-l ._6-p, ._333v, div.sharerSelector, ._529j, ._305j, ._1pph, ._3t_l, ._4pvz, +._1g05, .acy, ._51-g, ._533c, ._ib-, .sharerAttachmentEmpty, .sharerBottomWrapper, ._24e1, ._-j7, +._3bg5 ._56do, ._5hfh, ._52e-, .mQuestionsPollResultsBar, ._5hoc, ._5oxw, ._32_4, ._1hiz, +._38do, .bo, .cq, ._234-, ._a-5, ._2zh4, ._15ks, ._3oyc, ._36dc, ._3iyw ._3iyx, ._6bes, ._55wo, ._4-dy, +.tlBody, #timelineBody, .timelineX, .timeline, .feed, .tlPrelude, .tlFeedPlaceholder, ._4_d0, +.al, ._1gkq, ._5c5b, ._1qxg, ._5luf, ._2new, ._cld, ._3zvb, ._2nk0, .btnD, .btnI, ._2bdb, ._3ci9, +._11ub, ._5p7j, ._55wm, ._5rgs, ._5xuj, ._1sv1, ._45fu, ._18qg, ._1_ac, ._5w3g, ._3e18, ._6be7, +._5q_r, ._5yt8, ._idb, ._2ip_, ._f6s, ._2l5v, ._8i2, ._kr5, ._2q7u, ._2q7v, ._5xp2, div.fullwidthMore, +._577z, ._2u4w, ._3u9p, ._3u9t, ._cw4, ._5_y-, ._5_y_, ._5_z3, ._cwy, ._5_z0, ._voz, ._vos, +._5_z1, ._5_z2, ._2mtc, ._206a, ._1_-1, ._1ybg, .appCenterCategorySelectorButton, ._5_ee, ._3clk, +._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, +._55wm, ._2om3, ._2ol-, ._1f9d, ._vee, ._31a-, ._3r8b, ._3r9d, ._5vq5, ._3tl8, ._65wz, ._4edl, +.acw, ._4_xl, ._1p70, ._1p70, ._1ih_, ._51v6, ._u2c, ._484w, ._3ils, ._rm7, ._32qk, ._d01, ._1glm, +._ue6, ._hdn._hdn, +._2y60, ._5fu3, ._2foa, ._2y5_, ._38o9, ._1kb, .mAppCenterFatLabel, ._3bmj, ._5zmb, ._2x2s, ._3kac, ._3kad, +._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, +._4l9b, ._4gj3, .groupChromeView, ._i3g, ._3jcf, .error, ._1dbp, ._5zma, ._6beq, ._vi6, +._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1, ._35au, ._cwy, +._1rfn ._1rfk ._4vc-, ._1rfk, ._1rfk ._2v9s, ._301x { + background: #000 !important; +} + +._31nf, ._2v9s, ._d4i, article._55wo, ._10c_, ._2jl2, ._55wo, ._6150, ._50mi, ._4-dw, ._4_2z { + background: rgba(0, 0, 0, 0.35) !important; +} + +.aclb { + background: rgba(255, 255, 255, 0.2) !important; +} + +._cv_, ._2sq8 { + background-color: #000 !important; +} + +#page, ._8l7, ._-j8, ._-j9, ._6o5v { + background: transparent !important; +} + +.jewel, .flyout, ._52z5, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p, .mentions-suggest-item, ._2suk, +.mentions-suggest, ._1xoz, ._1xow { + background: black !important; +} + +._403n, ._14v5 ._14v8, ._1-kc { + background: black !important; +} + +button:not([style*=image]):not(.privacyButtons), button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, +._590n, ._4g8h, ._2cpp, ._58a0.touched:after, +.timeline .timelinePublisher, .touched, .sharerAttachment, +.item a.primary.touched .primarywrap, ._38nq, ._537a, +._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._55fj, +.excessItem, .acr, ._5-lx, ._3g9-, ._55ws, ._6dsj ._3gin, ._69aj, +._4e8n, ._5pxa._3uj9, ._5n_5, ._u2d, ._56bu::before, ._5h8f, ._d00, ._2066, ._2k51, +._10sb li.selected, ._2z4j, ._ib-, ._1bhl, ._5a5j, +._2b06, ._2tsf, ._3gka, .mCount, ._27vc, ._4pv-, ._6pk5, +._4qax, ._4756, ._w34, ._56bv::before, ._5769, ._34iv, ._z-w, ._t21, .mToken, +#addMembersTypeahead .mToken.mTokenWeakReference, +.acbk { + background: rgba(0, 0, 0, 0.35) !important; +} + +.mQuestionsPollResultsBar .shaded { + background: #5d86dd !important; +} + +._220g, ._1_y8:after, ._6pk6, +._2zh4::before, ._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, +._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { + background: rgba(255, 255, 255, 0.3) !important; +} + +button ._v89 ._54k8._1fl1 { + background: #5d86dd !important; +} + +._15kl::before, ._37fd .inlineComposerButton, ._1hb:before, +._5j35::after, ._2k4b, ._3to7, ._4nw8 { + border-left: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._4_d1, ._5cni { + border-right: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._1mx0, ._1rbr, ._5yt8, ._idb, ._cld, ._1e8h, ._z-w, ._1ha, ._1n8h ._1oby, ._5f99, ._2t39, +._2pbp, ._5rou:first-child, ._egf:first-child, ._io2, ._3qdi ._48_m::after, +._15n_, ._3-2-, ._27ve, ._2s20, ._gui, ._2s21 > *::after, ._32qk, ._d00, ._d01, ._38o9, +._3u9t, ._55fj, .mEventProfileSection.useBorder td, ._3ils, ._5as0, ._5as2, +._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._56d8, .al { + border-top: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._15ny::after, ._z-w, ._8i2, ._2nk0, ._22_8, ._1t4h, ._37fd, ._1ha, ._3bg5 ._56do, ._8he, +._400s, ._5hoc, ._1bhn, ._5ag6, ._4pvz, +._301x, ._x08 ._x0a:after, ._36dc, ._6-l ._57jn, ._527k, ._g_k, +._577z:not(:last-child) ._ygd, ._3u9u, ._3mgz, ._52x6, ._2066, ._5luf, ._2bdc, ._3ci9, +.mAppCenterFatLabel, .appCenterCategorySelectorButton, ._1q6v, ._5q_r, ._5yt8, ._38do, ._38dt, +._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .error, ._35--, ._1wev, +.jx-result, ._1f9d, ._vef, ._55x2 > *, .al, ._44qk, ._5rgs, ._5xuj, ._1sv1, ._idb, +._5lp5, ._3-2-, ._3to6, ._ir5, ._4nw6, ._4nwh, ._27ve, div._51v6::before, +._3c9h::before, ._2s20, ._gui, ._5jku, ._2foa, ._2y60, ._5fu3, ._4en9, ._1kb:not(:last-child) ._1kc, +._5pz4, ._5lp4, ._5lp5, ._5h6z, ._5h6x, ._2om4, ._5fjw > div, ._5fjv > :first-child, +._5fjw > :first-child { + border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +.item a.primary.touched .primarywrap, ._4dwt ._5y33, ._1ih_, ._5_50, ._6beq, ._69aj, +._5fjv, ._3on6, ._2u4w, ._2om3, ._2ol-, ._5fjw, ._4z83, ._1gkq, ._4-dy { + border-top: 1px solid rgba(255, 255, 255, 0.3) !important; + border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._d4i, ._f6s, .mentions-suggest-item, .mentions-suggest, .sharerAttachment, +.mToken, #addMembersTypeahead .mToken.mTokenWeakReference, .mQuestionsPollResultsBar, +._15q7, ._2q7v, ._4dwt ._16ii, ._3qdi::after, +._2q7w, .acy, ._58ak, ._3t_l, ._4msa, ._3h8i, ._3clk, ._1kt6, ._1ksq, +._1_y5, ._lr0, ._5hgt, ._2cpp, ._50uu, ._50uw, ._31yd, ._1e3d, ._3xz7, ._1xoz, +._4kcb, ._2lut, .jewel .touchable-notification.touched, .touchable-notification .touchable.touched, +.home-notification .touchable.touched, ._6beo ._6ber, +._73ku ._73jw, +._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, +._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf, ._4756, ._1rrd, ._5n_f { + border: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +.mQuestionsPollResultsBar .shaded, ._1027._13sm { + border: 1px solid #fff !important; +} + +._3gka { + border: 1px dashed rgba(255, 255, 255, 0.3) !important; +} + +._4o58::after, .acr, ._t21, ._2bdb, +.acw, .aclb, ._4qax, ._5h8f { + border-color: rgba(255, 255, 255, 0.3) !important; +} + +._15ks ._15kl::before { + border-left: 1px solid transparent !important; +} + +._56bf, .touch .btn { + border-radius: 0 !important; + border: 0 !important; +} + +._2cis { + border-left: 10px solid #000 !important; + border-right: 10px solid #000 !important; +} + +._2cir.selected, ._42rv, ._5zma, ._2x2s { + border-bottom: 3px solid #fff !important; +} + +._1ss6 { + border-left: 2px solid #fff !important; +} + +._484w.selected > ._6zf, ._5kqs::after, ._3lvo ._5xum._5xuk, ._x0b { + border-bottom: 1px solid #fff !important; +} + +._34ee { + background: rgba(0, 0, 0, 0.35) !important; + color: #fff !important; +} + +._34em ._34ee { + background: #5d86dd !important; + color: #fff !important; +} + +._5as0, ._5cni, ._5as2 { + background: black !important; +} + +*, *::after, *::before { + text-shadow: none !important; + box-shadow: none !important; +} + +[data-sigil=m_login_upsell], +[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { + display: none !important; +} + +::-webkit-input-placeholder { + color: #fff !important; +} + +:-moz-placeholder { + color: #fff !important; +} + +::-moz-placeholder { + color: #fff !important; +} + +:-ms-input-placeholder { + color: #fff !important; +} + +.excessItem { + outline: rgba(255, 255, 255, 0.3) !important; +} + +._3m1m { + background: linear-gradient(transparent, black) !important; +} + +@-webkit-keyframes highlightFade { + 0%, 50% { + background: rgba(0, 0, 0, 0.35); + } + 100% { + background: #000; + } +} +@-moz-keyframes highlightFade { + 0%, 50% { + background: rgba(0, 0, 0, 0.35); + } + 100% { + background: #000; + } +} +@keyframes highlightFade { + 0%, 50% { + background: rgba(0, 0, 0, 0.35); + } + 100% { + background: #000; + } +} +@-webkit-keyframes chatHighlightAnimation { + 0%, 100% { + background: #000; + } + 50% { + background: rgba(0, 0, 0, 0.35); + } +} +@-moz-keyframes chatHighlightAnimation { + 0%, 100% { + background: #000; + } + 50% { + background: rgba(0, 0, 0, 0.35); + } +} +@keyframes chatHighlightAnimation { + 0%, 100% { + background: #000; + } + 50% { + background: rgba(0, 0, 0, 0.35); + } +} +._50uu { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 -10 50 50"%3E%3Ccircle cx="25" cy="23" r="3.2"/%3E%3Cpath d="M22 13l-1.83 2H17c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V17c0-1.1-.9-2-2-2h-3.17L28 13h-6zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"/%3E%3Cpath fill="none" d="M13 11h24v24H13z"/%3E%3C/svg%3E') no-repeat !important; +} + +._50uw { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 50 50"%3E%3Cpath fill="none" d="M13 26h24v24H13z"/%3E%3Cpath d="M30 31.5V28c0-.55-.45-1-1-1H17c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4z"/%3E%3C/svg%3E') no-repeat !important; +} + +._15km ._15ko::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-1.91l-.01-.01L23 10z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15ko._77la::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%235d86dd" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-1.91l-.01-.01L23 10z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15kq::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 24 24"%3E%3Cpath d="M21.99 4c0-1.1-.89-2-1.99-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4-.01-18z"/%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15kr::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 24 24"%3E%3Cpath d="M14 9V5l7 7-7 7v-4.1c-5 0-8.5 1.6-11 5.1 1-5 4-10 11-11z"/%3E%3Cpath fill="none" d="M24 0H0v24h24z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +.story_body_container i.img[data-sigil*=story-popup-context] { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath fill="%23fff" d="M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} diff --git a/app/src/web/assets/css/themes/material_amoled.scss b/app/src/web/assets/css/themes/material_amoled.scss new file mode 100644 index 00000000..19190126 --- /dev/null +++ b/app/src/web/assets/css/themes/material_amoled.scss @@ -0,0 +1,11 @@ +$text: #fff; +$accent_text: #fff; +$link: #5d86dd; +$accent: #5d86dd; +$background: #000; +$background2: rgba($background, 0.35); +$bg_transparent: $background; +$card: $background2; +$tint: rgba(#fff, 0.2); + +@import "../core/main"; diff --git a/app/src/web/assets/css/themes/material_dark.css b/app/src/web/assets/css/themes/material_dark.css new file mode 100644 index 00000000..0dc739eb --- /dev/null +++ b/app/src/web/assets/css/themes/material_dark.css @@ -0,0 +1,338 @@ +[style*=color], body, input, ._42rv, ._4qau, ._dwm .descArea, ._eu5, +._1tcc, ._3g9-, ._29z_, ._3xz7, ._ib-, ._3bg5 ._56dq, ._477i, ._2vxk, +.touched *, ._1_yj, ._1_yl, ._4pj9, ._2bdc, ._3qdh ._3qdn ._3qdk, ._3qdk ._48_q, +._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._2ip_, ._403p, .cq, ._usr, +._5xu2, ._3ml8, ._3mla, ._50vk, ._1m2u, ._31y7, ._4kcb, ._1lf6, ._1lf5, +._1lf4, ._1hiz, ._xod, ._5ag5, ._zmk, ._3t_h, ._5lm6, ._3clv, ._3zlc, ._36rd, +._31zk, ._31zl, ._3xsa, ._3xs9, ._2-4s, ._2fzz ul, ._3z10, +._43mh, .touch .btn, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, +._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, +._18qg, ._1_ac, ._529p, ._4dwt ._1vh3, ._4a5f, ._23_t, ._2rzc, ._23_s, ._2rzd, +._5aga, ._5ag9, ._537a, .acy, ._5ro_, ._6-l ._2us7, ._4mp, ._2b08, ._36e0, ._4-dy, +._14v5 ._14v8, ._1440, ._1442, ._1448, ._4ks_, .mCount, ._27vc, ._24e1, ._2rbw, ._3iyw ._3mzw, +textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, +._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, +._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._38d-, ._3n8y, ._38dt, ._3oyg, +._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, +._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, +._2new, .appCenterCategorySelectorButton, ._1ksq, ._1kt6, ._6ber, ._mxb, ._3oyd, +div.sharerSelector, .footer, ._4pv_, ._1dbp, ._3kad, ._20zc, ._2i5v, ._2i5w, +a, ._5fpq, ._4gux, ._3bg5 ._52x1, ._3bg5 ._52x2, ._6dsj ._3gin, ._hdn._hdn, +.mentions-input, .mentions-placeholder, .largeStatusBox .placeHolder, .fcw, +._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, +._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, +h1, h2, h3, h4, h5, h6 { + color: #fff !important; +} + +strong > a, ._15ks ._2q8z._2q8z, ._1e3e, .blueName { + color: #5d86dd !important; +} + +._42nf ._42ng { + color: transparent !important; +} + +p > a, .msg span > a { + color: #5d86dd !important; +} + +#viewport { + background: #303030 !important; +} + +body, :root, #root, #header, #MComposer, [style*=background-color], ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, +._5lp5, .container, .subpage, ._5n_f, #static_templates, ._22_8, ._1t4h, ._uoq, ._3qdh, ._8ca, ._3h8i, +._6-l ._2us7, ._6-l ._6-p, ._333v, div.sharerSelector, ._529j, ._305j, ._1pph, ._3t_l, ._4pvz, +._1g05, .acy, ._51-g, ._533c, ._ib-, .sharerAttachmentEmpty, .sharerBottomWrapper, ._24e1, ._-j7, +._3bg5 ._56do, ._5hfh, ._52e-, .mQuestionsPollResultsBar, ._5hoc, ._5oxw, ._32_4, ._1hiz, +._38do, .bo, .cq, ._234-, ._a-5, ._2zh4, ._15ks, ._3oyc, ._36dc, ._3iyw ._3iyx, ._6bes, ._55wo, ._4-dy, +.tlBody, #timelineBody, .timelineX, .timeline, .feed, .tlPrelude, .tlFeedPlaceholder, ._4_d0, +.al, ._1gkq, ._5c5b, ._1qxg, ._5luf, ._2new, ._cld, ._3zvb, ._2nk0, .btnD, .btnI, ._2bdb, ._3ci9, +._11ub, ._5p7j, ._55wm, ._5rgs, ._5xuj, ._1sv1, ._45fu, ._18qg, ._1_ac, ._5w3g, ._3e18, ._6be7, +._5q_r, ._5yt8, ._idb, ._2ip_, ._f6s, ._2l5v, ._8i2, ._kr5, ._2q7u, ._2q7v, ._5xp2, div.fullwidthMore, +._577z, ._2u4w, ._3u9p, ._3u9t, ._cw4, ._5_y-, ._5_y_, ._5_z3, ._cwy, ._5_z0, ._voz, ._vos, +._5_z1, ._5_z2, ._2mtc, ._206a, ._1_-1, ._1ybg, .appCenterCategorySelectorButton, ._5_ee, ._3clk, +._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, +._55wm, ._2om3, ._2ol-, ._1f9d, ._vee, ._31a-, ._3r8b, ._3r9d, ._5vq5, ._3tl8, ._65wz, ._4edl, +.acw, ._4_xl, ._1p70, ._1p70, ._1ih_, ._51v6, ._u2c, ._484w, ._3ils, ._rm7, ._32qk, ._d01, ._1glm, +._ue6, ._hdn._hdn, +._2y60, ._5fu3, ._2foa, ._2y5_, ._38o9, ._1kb, .mAppCenterFatLabel, ._3bmj, ._5zmb, ._2x2s, ._3kac, ._3kad, +._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, +._4l9b, ._4gj3, .groupChromeView, ._i3g, ._3jcf, .error, ._1dbp, ._5zma, ._6beq, ._vi6, +._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1, ._35au, ._cwy, +._1rfn ._1rfk ._4vc-, ._1rfk, ._1rfk ._2v9s, ._301x { + background: #303030 !important; +} + +._31nf, ._2v9s, ._d4i, article._55wo, ._10c_, ._2jl2, ._55wo, ._6150, ._50mi, ._4-dw, ._4_2z { + background: #353535 !important; +} + +.aclb { + background: rgba(255, 255, 255, 0.2) !important; +} + +._cv_, ._2sq8 { + background-color: #303030 !important; +} + +#page, ._8l7, ._-j8, ._-j9, ._6o5v { + background: transparent !important; +} + +.jewel, .flyout, ._52z5, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p, .mentions-suggest-item, ._2suk, +.mentions-suggest, ._1xoz, ._1xow { + background: #303030 !important; +} + +._403n, ._14v5 ._14v8, ._1-kc { + background: #898989 !important; +} + +button:not([style*=image]):not(.privacyButtons), button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, +._590n, ._4g8h, ._2cpp, ._58a0.touched:after, +.timeline .timelinePublisher, .touched, .sharerAttachment, +.item a.primary.touched .primarywrap, ._38nq, ._537a, +._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._55fj, +.excessItem, .acr, ._5-lx, ._3g9-, ._55ws, ._6dsj ._3gin, ._69aj, +._4e8n, ._5pxa._3uj9, ._5n_5, ._u2d, ._56bu::before, ._5h8f, ._d00, ._2066, ._2k51, +._10sb li.selected, ._2z4j, ._ib-, ._1bhl, ._5a5j, +._2b06, ._2tsf, ._3gka, .mCount, ._27vc, ._4pv-, ._6pk5, +._4qax, ._4756, ._w34, ._56bv::before, ._5769, ._34iv, ._z-w, ._t21, .mToken, +#addMembersTypeahead .mToken.mTokenWeakReference, +.acbk { + background: rgba(137, 137, 137, 0.35) !important; +} + +.mQuestionsPollResultsBar .shaded { + background: #5d86dd !important; +} + +._220g, ._1_y8:after, ._6pk6, +._2zh4::before, ._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, +._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { + background: rgba(255, 255, 255, 0.3) !important; +} + +button ._v89 ._54k8._1fl1 { + background: #5d86dd !important; +} + +._15kl::before, ._37fd .inlineComposerButton, ._1hb:before, +._5j35::after, ._2k4b, ._3to7, ._4nw8 { + border-left: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._4_d1, ._5cni { + border-right: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._1mx0, ._1rbr, ._5yt8, ._idb, ._cld, ._1e8h, ._z-w, ._1ha, ._1n8h ._1oby, ._5f99, ._2t39, +._2pbp, ._5rou:first-child, ._egf:first-child, ._io2, ._3qdi ._48_m::after, +._15n_, ._3-2-, ._27ve, ._2s20, ._gui, ._2s21 > *::after, ._32qk, ._d00, ._d01, ._38o9, +._3u9t, ._55fj, .mEventProfileSection.useBorder td, ._3ils, ._5as0, ._5as2, +._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._56d8, .al { + border-top: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._15ny::after, ._z-w, ._8i2, ._2nk0, ._22_8, ._1t4h, ._37fd, ._1ha, ._3bg5 ._56do, ._8he, +._400s, ._5hoc, ._1bhn, ._5ag6, ._4pvz, +._301x, ._x08 ._x0a:after, ._36dc, ._6-l ._57jn, ._527k, ._g_k, +._577z:not(:last-child) ._ygd, ._3u9u, ._3mgz, ._52x6, ._2066, ._5luf, ._2bdc, ._3ci9, +.mAppCenterFatLabel, .appCenterCategorySelectorButton, ._1q6v, ._5q_r, ._5yt8, ._38do, ._38dt, +._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .error, ._35--, ._1wev, +.jx-result, ._1f9d, ._vef, ._55x2 > *, .al, ._44qk, ._5rgs, ._5xuj, ._1sv1, ._idb, +._5lp5, ._3-2-, ._3to6, ._ir5, ._4nw6, ._4nwh, ._27ve, div._51v6::before, +._3c9h::before, ._2s20, ._gui, ._5jku, ._2foa, ._2y60, ._5fu3, ._4en9, ._1kb:not(:last-child) ._1kc, +._5pz4, ._5lp4, ._5lp5, ._5h6z, ._5h6x, ._2om4, ._5fjw > div, ._5fjv > :first-child, +._5fjw > :first-child { + border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +.item a.primary.touched .primarywrap, ._4dwt ._5y33, ._1ih_, ._5_50, ._6beq, ._69aj, +._5fjv, ._3on6, ._2u4w, ._2om3, ._2ol-, ._5fjw, ._4z83, ._1gkq, ._4-dy { + border-top: 1px solid rgba(255, 255, 255, 0.3) !important; + border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._d4i, ._f6s, .mentions-suggest-item, .mentions-suggest, .sharerAttachment, +.mToken, #addMembersTypeahead .mToken.mTokenWeakReference, .mQuestionsPollResultsBar, +._15q7, ._2q7v, ._4dwt ._16ii, ._3qdi::after, +._2q7w, .acy, ._58ak, ._3t_l, ._4msa, ._3h8i, ._3clk, ._1kt6, ._1ksq, +._1_y5, ._lr0, ._5hgt, ._2cpp, ._50uu, ._50uw, ._31yd, ._1e3d, ._3xz7, ._1xoz, +._4kcb, ._2lut, .jewel .touchable-notification.touched, .touchable-notification .touchable.touched, +.home-notification .touchable.touched, ._6beo ._6ber, +._73ku ._73jw, +._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, +._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf, ._4756, ._1rrd, ._5n_f { + border: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +.mQuestionsPollResultsBar .shaded, ._1027._13sm { + border: 1px solid #fff !important; +} + +._3gka { + border: 1px dashed rgba(255, 255, 255, 0.3) !important; +} + +._4o58::after, .acr, ._t21, ._2bdb, +.acw, .aclb, ._4qax, ._5h8f { + border-color: rgba(255, 255, 255, 0.3) !important; +} + +._15ks ._15kl::before { + border-left: 1px solid transparent !important; +} + +._56bf, .touch .btn { + border-radius: 0 !important; + border: 0 !important; +} + +._2cis { + border-left: 10px solid #303030 !important; + border-right: 10px solid #303030 !important; +} + +._2cir.selected, ._42rv, ._5zma, ._2x2s { + border-bottom: 3px solid #fff !important; +} + +._1ss6 { + border-left: 2px solid #fff !important; +} + +._484w.selected > ._6zf, ._5kqs::after, ._3lvo ._5xum._5xuk, ._x0b { + border-bottom: 1px solid #fff !important; +} + +._34ee { + background: rgba(137, 137, 137, 0.35) !important; + color: #fff !important; +} + +._34em ._34ee { + background: #5d86dd !important; + color: #fff !important; +} + +._5as0, ._5cni, ._5as2 { + background: #303030 !important; +} + +*, *::after, *::before { + text-shadow: none !important; + box-shadow: none !important; +} + +[data-sigil=m_login_upsell], +[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { + display: none !important; +} + +::-webkit-input-placeholder { + color: #fff !important; +} + +:-moz-placeholder { + color: #fff !important; +} + +::-moz-placeholder { + color: #fff !important; +} + +:-ms-input-placeholder { + color: #fff !important; +} + +.excessItem { + outline: rgba(255, 255, 255, 0.3) !important; +} + +._3m1m { + background: linear-gradient(transparent, #303030) !important; +} + +@-webkit-keyframes highlightFade { + 0%, 50% { + background: rgba(137, 137, 137, 0.35); + } + 100% { + background: #303030; + } +} +@-moz-keyframes highlightFade { + 0%, 50% { + background: rgba(137, 137, 137, 0.35); + } + 100% { + background: #303030; + } +} +@keyframes highlightFade { + 0%, 50% { + background: rgba(137, 137, 137, 0.35); + } + 100% { + background: #303030; + } +} +@-webkit-keyframes chatHighlightAnimation { + 0%, 100% { + background: #303030; + } + 50% { + background: rgba(137, 137, 137, 0.35); + } +} +@-moz-keyframes chatHighlightAnimation { + 0%, 100% { + background: #303030; + } + 50% { + background: rgba(137, 137, 137, 0.35); + } +} +@keyframes chatHighlightAnimation { + 0%, 100% { + background: #303030; + } + 50% { + background: rgba(137, 137, 137, 0.35); + } +} +._50uu { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 -10 50 50"%3E%3Ccircle cx="25" cy="23" r="3.2"/%3E%3Cpath d="M22 13l-1.83 2H17c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V17c0-1.1-.9-2-2-2h-3.17L28 13h-6zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"/%3E%3Cpath fill="none" d="M13 11h24v24H13z"/%3E%3C/svg%3E') no-repeat !important; +} + +._50uw { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 50 50"%3E%3Cpath fill="none" d="M13 26h24v24H13z"/%3E%3Cpath d="M30 31.5V28c0-.55-.45-1-1-1H17c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4z"/%3E%3C/svg%3E') no-repeat !important; +} + +._15km ._15ko::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-1.91l-.01-.01L23 10z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15ko._77la::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%235d86dd" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-1.91l-.01-.01L23 10z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15kq::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 24 24"%3E%3Cpath d="M21.99 4c0-1.1-.89-2-1.99-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4-.01-18z"/%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15kr::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 24 24"%3E%3Cpath d="M14 9V5l7 7-7 7v-4.1c-5 0-8.5 1.6-11 5.1 1-5 4-10 11-11z"/%3E%3Cpath fill="none" d="M24 0H0v24h24z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +.story_body_container i.img[data-sigil*=story-popup-context] { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath fill="%23fff" d="M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} diff --git a/app/src/web/assets/css/themes/material_dark.scss b/app/src/web/assets/css/themes/material_dark.scss new file mode 100644 index 00000000..18b8b461 --- /dev/null +++ b/app/src/web/assets/css/themes/material_dark.scss @@ -0,0 +1,10 @@ +$text: #fff; +$accent_text: #fff; +$link: #5d86dd; +$accent: #5d86dd; +$background: #303030; +$bg_transparent: $background; +$card: #353535; +$tint: rgba(#fff, 0.2); + +@import "../core/main"; diff --git a/app/src/web/assets/css/themes/material_glass.css b/app/src/web/assets/css/themes/material_glass.css new file mode 100644 index 00000000..3bf9530f --- /dev/null +++ b/app/src/web/assets/css/themes/material_glass.css @@ -0,0 +1,338 @@ +[style*=color], body, input, ._42rv, ._4qau, ._dwm .descArea, ._eu5, +._1tcc, ._3g9-, ._29z_, ._3xz7, ._ib-, ._3bg5 ._56dq, ._477i, ._2vxk, +.touched *, ._1_yj, ._1_yl, ._4pj9, ._2bdc, ._3qdh ._3qdn ._3qdk, ._3qdk ._48_q, +._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._2ip_, ._403p, .cq, ._usr, +._5xu2, ._3ml8, ._3mla, ._50vk, ._1m2u, ._31y7, ._4kcb, ._1lf6, ._1lf5, +._1lf4, ._1hiz, ._xod, ._5ag5, ._zmk, ._3t_h, ._5lm6, ._3clv, ._3zlc, ._36rd, +._31zk, ._31zl, ._3xsa, ._3xs9, ._2-4s, ._2fzz ul, ._3z10, +._43mh, .touch .btn, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, +._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, +._18qg, ._1_ac, ._529p, ._4dwt ._1vh3, ._4a5f, ._23_t, ._2rzc, ._23_s, ._2rzd, +._5aga, ._5ag9, ._537a, .acy, ._5ro_, ._6-l ._2us7, ._4mp, ._2b08, ._36e0, ._4-dy, +._14v5 ._14v8, ._1440, ._1442, ._1448, ._4ks_, .mCount, ._27vc, ._24e1, ._2rbw, ._3iyw ._3mzw, +textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, +._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, +._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._38d-, ._3n8y, ._38dt, ._3oyg, +._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, +._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, +._2new, .appCenterCategorySelectorButton, ._1ksq, ._1kt6, ._6ber, ._mxb, ._3oyd, +div.sharerSelector, .footer, ._4pv_, ._1dbp, ._3kad, ._20zc, ._2i5v, ._2i5w, +a, ._5fpq, ._4gux, ._3bg5 ._52x1, ._3bg5 ._52x2, ._6dsj ._3gin, ._hdn._hdn, +.mentions-input, .mentions-placeholder, .largeStatusBox .placeHolder, .fcw, +._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, +._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, +h1, h2, h3, h4, h5, h6 { + color: #fff !important; +} + +strong > a, ._15ks ._2q8z._2q8z, ._1e3e, .blueName { + color: #5d86dd !important; +} + +._42nf ._42ng { + color: transparent !important; +} + +p > a, .msg span > a { + color: #5d86dd !important; +} + +#viewport { + background: rgba(0, 0, 0, 0.1) !important; +} + +body, :root, #root, #header, #MComposer, [style*=background-color], ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, +._5lp5, .container, .subpage, ._5n_f, #static_templates, ._22_8, ._1t4h, ._uoq, ._3qdh, ._8ca, ._3h8i, +._6-l ._2us7, ._6-l ._6-p, ._333v, div.sharerSelector, ._529j, ._305j, ._1pph, ._3t_l, ._4pvz, +._1g05, .acy, ._51-g, ._533c, ._ib-, .sharerAttachmentEmpty, .sharerBottomWrapper, ._24e1, ._-j7, +._3bg5 ._56do, ._5hfh, ._52e-, .mQuestionsPollResultsBar, ._5hoc, ._5oxw, ._32_4, ._1hiz, +._38do, .bo, .cq, ._234-, ._a-5, ._2zh4, ._15ks, ._3oyc, ._36dc, ._3iyw ._3iyx, ._6bes, ._55wo, ._4-dy, +.tlBody, #timelineBody, .timelineX, .timeline, .feed, .tlPrelude, .tlFeedPlaceholder, ._4_d0, +.al, ._1gkq, ._5c5b, ._1qxg, ._5luf, ._2new, ._cld, ._3zvb, ._2nk0, .btnD, .btnI, ._2bdb, ._3ci9, +._11ub, ._5p7j, ._55wm, ._5rgs, ._5xuj, ._1sv1, ._45fu, ._18qg, ._1_ac, ._5w3g, ._3e18, ._6be7, +._5q_r, ._5yt8, ._idb, ._2ip_, ._f6s, ._2l5v, ._8i2, ._kr5, ._2q7u, ._2q7v, ._5xp2, div.fullwidthMore, +._577z, ._2u4w, ._3u9p, ._3u9t, ._cw4, ._5_y-, ._5_y_, ._5_z3, ._cwy, ._5_z0, ._voz, ._vos, +._5_z1, ._5_z2, ._2mtc, ._206a, ._1_-1, ._1ybg, .appCenterCategorySelectorButton, ._5_ee, ._3clk, +._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, +._55wm, ._2om3, ._2ol-, ._1f9d, ._vee, ._31a-, ._3r8b, ._3r9d, ._5vq5, ._3tl8, ._65wz, ._4edl, +.acw, ._4_xl, ._1p70, ._1p70, ._1ih_, ._51v6, ._u2c, ._484w, ._3ils, ._rm7, ._32qk, ._d01, ._1glm, +._ue6, ._hdn._hdn, +._2y60, ._5fu3, ._2foa, ._2y5_, ._38o9, ._1kb, .mAppCenterFatLabel, ._3bmj, ._5zmb, ._2x2s, ._3kac, ._3kad, +._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, +._4l9b, ._4gj3, .groupChromeView, ._i3g, ._3jcf, .error, ._1dbp, ._5zma, ._6beq, ._vi6, +._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1, ._35au, ._cwy, +._1rfn ._1rfk ._4vc-, ._1rfk, ._1rfk ._2v9s, ._301x { + background: transparent !important; +} + +._31nf, ._2v9s, ._d4i, article._55wo, ._10c_, ._2jl2, ._55wo, ._6150, ._50mi, ._4-dw, ._4_2z { + background: rgba(0, 0, 0, 0.25) !important; +} + +.aclb { + background: rgba(255, 255, 255, 0.15) !important; +} + +._cv_, ._2sq8 { + background-color: transparent !important; +} + +#page, ._8l7, ._-j8, ._-j9, ._6o5v { + background: transparent !important; +} + +.jewel, .flyout, ._52z5, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p, .mentions-suggest-item, ._2suk, +.mentions-suggest, ._1xoz, ._1xow { + background: black !important; +} + +._403n, ._14v5 ._14v8, ._1-kc { + background: #595959 !important; +} + +button:not([style*=image]):not(.privacyButtons), button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, +._590n, ._4g8h, ._2cpp, ._58a0.touched:after, +.timeline .timelinePublisher, .touched, .sharerAttachment, +.item a.primary.touched .primarywrap, ._38nq, ._537a, +._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._55fj, +.excessItem, .acr, ._5-lx, ._3g9-, ._55ws, ._6dsj ._3gin, ._69aj, +._4e8n, ._5pxa._3uj9, ._5n_5, ._u2d, ._56bu::before, ._5h8f, ._d00, ._2066, ._2k51, +._10sb li.selected, ._2z4j, ._ib-, ._1bhl, ._5a5j, +._2b06, ._2tsf, ._3gka, .mCount, ._27vc, ._4pv-, ._6pk5, +._4qax, ._4756, ._w34, ._56bv::before, ._5769, ._34iv, ._z-w, ._t21, .mToken, +#addMembersTypeahead .mToken.mTokenWeakReference, +.acbk { + background: rgba(89, 89, 89, 0.35) !important; +} + +.mQuestionsPollResultsBar .shaded { + background: #5d86dd !important; +} + +._220g, ._1_y8:after, ._6pk6, +._2zh4::before, ._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, +._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { + background: rgba(255, 255, 255, 0.3) !important; +} + +button ._v89 ._54k8._1fl1 { + background: #5d86dd !important; +} + +._15kl::before, ._37fd .inlineComposerButton, ._1hb:before, +._5j35::after, ._2k4b, ._3to7, ._4nw8 { + border-left: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._4_d1, ._5cni { + border-right: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._1mx0, ._1rbr, ._5yt8, ._idb, ._cld, ._1e8h, ._z-w, ._1ha, ._1n8h ._1oby, ._5f99, ._2t39, +._2pbp, ._5rou:first-child, ._egf:first-child, ._io2, ._3qdi ._48_m::after, +._15n_, ._3-2-, ._27ve, ._2s20, ._gui, ._2s21 > *::after, ._32qk, ._d00, ._d01, ._38o9, +._3u9t, ._55fj, .mEventProfileSection.useBorder td, ._3ils, ._5as0, ._5as2, +._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._56d8, .al { + border-top: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._15ny::after, ._z-w, ._8i2, ._2nk0, ._22_8, ._1t4h, ._37fd, ._1ha, ._3bg5 ._56do, ._8he, +._400s, ._5hoc, ._1bhn, ._5ag6, ._4pvz, +._301x, ._x08 ._x0a:after, ._36dc, ._6-l ._57jn, ._527k, ._g_k, +._577z:not(:last-child) ._ygd, ._3u9u, ._3mgz, ._52x6, ._2066, ._5luf, ._2bdc, ._3ci9, +.mAppCenterFatLabel, .appCenterCategorySelectorButton, ._1q6v, ._5q_r, ._5yt8, ._38do, ._38dt, +._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .error, ._35--, ._1wev, +.jx-result, ._1f9d, ._vef, ._55x2 > *, .al, ._44qk, ._5rgs, ._5xuj, ._1sv1, ._idb, +._5lp5, ._3-2-, ._3to6, ._ir5, ._4nw6, ._4nwh, ._27ve, div._51v6::before, +._3c9h::before, ._2s20, ._gui, ._5jku, ._2foa, ._2y60, ._5fu3, ._4en9, ._1kb:not(:last-child) ._1kc, +._5pz4, ._5lp4, ._5lp5, ._5h6z, ._5h6x, ._2om4, ._5fjw > div, ._5fjv > :first-child, +._5fjw > :first-child { + border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +.item a.primary.touched .primarywrap, ._4dwt ._5y33, ._1ih_, ._5_50, ._6beq, ._69aj, +._5fjv, ._3on6, ._2u4w, ._2om3, ._2ol-, ._5fjw, ._4z83, ._1gkq, ._4-dy { + border-top: 1px solid rgba(255, 255, 255, 0.3) !important; + border-bottom: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +._d4i, ._f6s, .mentions-suggest-item, .mentions-suggest, .sharerAttachment, +.mToken, #addMembersTypeahead .mToken.mTokenWeakReference, .mQuestionsPollResultsBar, +._15q7, ._2q7v, ._4dwt ._16ii, ._3qdi::after, +._2q7w, .acy, ._58ak, ._3t_l, ._4msa, ._3h8i, ._3clk, ._1kt6, ._1ksq, +._1_y5, ._lr0, ._5hgt, ._2cpp, ._50uu, ._50uw, ._31yd, ._1e3d, ._3xz7, ._1xoz, +._4kcb, ._2lut, .jewel .touchable-notification.touched, .touchable-notification .touchable.touched, +.home-notification .touchable.touched, ._6beo ._6ber, +._73ku ._73jw, +._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, +._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf, ._4756, ._1rrd, ._5n_f { + border: 1px solid rgba(255, 255, 255, 0.3) !important; +} + +.mQuestionsPollResultsBar .shaded, ._1027._13sm { + border: 1px solid #fff !important; +} + +._3gka { + border: 1px dashed rgba(255, 255, 255, 0.3) !important; +} + +._4o58::after, .acr, ._t21, ._2bdb, +.acw, .aclb, ._4qax, ._5h8f { + border-color: rgba(255, 255, 255, 0.3) !important; +} + +._15ks ._15kl::before { + border-left: 1px solid transparent !important; +} + +._56bf, .touch .btn { + border-radius: 0 !important; + border: 0 !important; +} + +._2cis { + border-left: 10px solid transparent !important; + border-right: 10px solid transparent !important; +} + +._2cir.selected, ._42rv, ._5zma, ._2x2s { + border-bottom: 3px solid #fff !important; +} + +._1ss6 { + border-left: 2px solid #fff !important; +} + +._484w.selected > ._6zf, ._5kqs::after, ._3lvo ._5xum._5xuk, ._x0b { + border-bottom: 1px solid #fff !important; +} + +._34ee { + background: rgba(89, 89, 89, 0.35) !important; + color: #fff !important; +} + +._34em ._34ee { + background: #5d86dd !important; + color: #fff !important; +} + +._5as0, ._5cni, ._5as2 { + background: black !important; +} + +*, *::after, *::before { + text-shadow: none !important; + box-shadow: none !important; +} + +[data-sigil=m_login_upsell], +[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { + display: none !important; +} + +::-webkit-input-placeholder { + color: #fff !important; +} + +:-moz-placeholder { + color: #fff !important; +} + +::-moz-placeholder { + color: #fff !important; +} + +:-ms-input-placeholder { + color: #fff !important; +} + +.excessItem { + outline: rgba(255, 255, 255, 0.3) !important; +} + +._3m1m { + background: linear-gradient(transparent, black) !important; +} + +@-webkit-keyframes highlightFade { + 0%, 50% { + background: rgba(89, 89, 89, 0.35); + } + 100% { + background: transparent; + } +} +@-moz-keyframes highlightFade { + 0%, 50% { + background: rgba(89, 89, 89, 0.35); + } + 100% { + background: transparent; + } +} +@keyframes highlightFade { + 0%, 50% { + background: rgba(89, 89, 89, 0.35); + } + 100% { + background: transparent; + } +} +@-webkit-keyframes chatHighlightAnimation { + 0%, 100% { + background: transparent; + } + 50% { + background: rgba(89, 89, 89, 0.35); + } +} +@-moz-keyframes chatHighlightAnimation { + 0%, 100% { + background: transparent; + } + 50% { + background: rgba(89, 89, 89, 0.35); + } +} +@keyframes chatHighlightAnimation { + 0%, 100% { + background: transparent; + } + 50% { + background: rgba(89, 89, 89, 0.35); + } +} +._50uu { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 -10 50 50"%3E%3Ccircle cx="25" cy="23" r="3.2"/%3E%3Cpath d="M22 13l-1.83 2H17c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V17c0-1.1-.9-2-2-2h-3.17L28 13h-6zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"/%3E%3Cpath fill="none" d="M13 11h24v24H13z"/%3E%3C/svg%3E') no-repeat !important; +} + +._50uw { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 50 50"%3E%3Cpath fill="none" d="M13 26h24v24H13z"/%3E%3Cpath d="M30 31.5V28c0-.55-.45-1-1-1H17c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4z"/%3E%3C/svg%3E') no-repeat !important; +} + +._15km ._15ko::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-1.91l-.01-.01L23 10z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15ko._77la::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%235d86dd" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-1.91l-.01-.01L23 10z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15kq::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 24 24"%3E%3Cpath d="M21.99 4c0-1.1-.89-2-1.99-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4-.01-18z"/%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15kr::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23fff" viewBox="0 0 24 24"%3E%3Cpath d="M14 9V5l7 7-7 7v-4.1c-5 0-8.5 1.6-11 5.1 1-5 4-10 11-11z"/%3E%3Cpath fill="none" d="M24 0H0v24h24z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +.story_body_container i.img[data-sigil*=story-popup-context] { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath fill="%23fff" d="M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} diff --git a/app/src/web/assets/css/themes/material_glass.scss b/app/src/web/assets/css/themes/material_glass.scss new file mode 100644 index 00000000..0c61a38c --- /dev/null +++ b/app/src/web/assets/css/themes/material_glass.scss @@ -0,0 +1,10 @@ +$text: #fff; +$accent_text: #fff; +$link: #5d86dd; +$accent: #5d86dd; +$background: rgba(#000, 0.1); +$bg_transparent: transparent; +$card: rgba(#000, 0.25); +$tint: rgba(#fff, 0.15); + +@import "../core/main"; diff --git a/app/src/web/assets/css/themes/material_light.css b/app/src/web/assets/css/themes/material_light.css new file mode 100644 index 00000000..c00dd12f --- /dev/null +++ b/app/src/web/assets/css/themes/material_light.css @@ -0,0 +1,338 @@ +[style*=color], body, input, ._42rv, ._4qau, ._dwm .descArea, ._eu5, +._1tcc, ._3g9-, ._29z_, ._3xz7, ._ib-, ._3bg5 ._56dq, ._477i, ._2vxk, +.touched *, ._1_yj, ._1_yl, ._4pj9, ._2bdc, ._3qdh ._3qdn ._3qdk, ._3qdk ._48_q, +._z-z, ._z-v, ._1e8d, ._36nl, ._36nm, ._2_11, ._2_rf, ._2ip_, ._403p, .cq, ._usr, +._5xu2, ._3ml8, ._3mla, ._50vk, ._1m2u, ._31y7, ._4kcb, ._1lf6, ._1lf5, +._1lf4, ._1hiz, ._xod, ._5ag5, ._zmk, ._3t_h, ._5lm6, ._3clv, ._3zlc, ._36rd, +._31zk, ._31zl, ._3xsa, ._3xs9, ._2-4s, ._2fzz ul, ._3z10, +._43mh, .touch .btn, .fcg, button, ._52j9, ._52jb, ._52ja, ._5j35, +._rnk, ._24u0, ._1g06, ._14ye, .fcb, ._56cz._56c_, ._1gk_, ._55fj, ._45fu, +._18qg, ._1_ac, ._529p, ._4dwt ._1vh3, ._4a5f, ._23_t, ._2rzc, ._23_s, ._2rzd, +._5aga, ._5ag9, ._537a, .acy, ._5ro_, ._6-l ._2us7, ._4mp, ._2b08, ._36e0, ._4-dy, +._14v5 ._14v8, ._1440, ._1442, ._1448, ._4ks_, .mCount, ._27vc, ._24e1, ._2rbw, ._3iyw ._3mzw, +textarea, ._24pi, ._4en9, ._1kb, ._5p7j, ._2klz, ._5780, ._5781, ._5782, +._3u9u, ._3u9_, ._3u9s, ._1hcx, ._2066, ._1_-1, ._cv_, ._1nbx, ._2cuh, +._4ms9, ._4ms5, ._4ms6, ._31b4, ._31b5, ._5q_r, ._idb, ._38d-, ._3n8y, ._38dt, ._3oyg, +._27vp, ._4nwe, ._4nw9, ._27vi, .appCenterAppInfo, .appCenterPermissions, +._3c9l, ._3c9m, ._4jn_, ._32qt, ._3mom, ._3moo, ._-7o, ._d00, ._d01, ._559g, +._2new, .appCenterCategorySelectorButton, ._1ksq, ._1kt6, ._6ber, ._mxb, ._3oyd, +div.sharerSelector, .footer, ._4pv_, ._1dbp, ._3kad, ._20zc, ._2i5v, ._2i5w, +a, ._5fpq, ._4gux, ._3bg5 ._52x1, ._3bg5 ._52x2, ._6dsj ._3gin, ._hdn._hdn, +.mentions-input, .mentions-placeholder, .largeStatusBox .placeHolder, .fcw, +._5-7t, .fcl, ._4qas, .thread-title, .title, ._46pa, ._336p, ._1rrd, ._2om4, +._3m1m, ._2om2, ._5n_e, .appListExplanation, ._5yt8, ._8he, ._2luw, ._5rgs, +h1, h2, h3, h4, h5, h6 { + color: #000 !important; +} + +strong > a, ._15ks ._2q8z._2q8z, ._1e3e, .blueName { + color: #3b5998 !important; +} + +._42nf ._42ng { + color: transparent !important; +} + +p > a, .msg span > a { + color: #3b5998 !important; +} + +#viewport { + background: #fafafa !important; +} + +body, :root, #root, #header, #MComposer, [style*=background-color], ._1upc, input, ._2f9r, ._59e9, ._5pz4, ._5lp4, +._5lp5, .container, .subpage, ._5n_f, #static_templates, ._22_8, ._1t4h, ._uoq, ._3qdh, ._8ca, ._3h8i, +._6-l ._2us7, ._6-l ._6-p, ._333v, div.sharerSelector, ._529j, ._305j, ._1pph, ._3t_l, ._4pvz, +._1g05, .acy, ._51-g, ._533c, ._ib-, .sharerAttachmentEmpty, .sharerBottomWrapper, ._24e1, ._-j7, +._3bg5 ._56do, ._5hfh, ._52e-, .mQuestionsPollResultsBar, ._5hoc, ._5oxw, ._32_4, ._1hiz, +._38do, .bo, .cq, ._234-, ._a-5, ._2zh4, ._15ks, ._3oyc, ._36dc, ._3iyw ._3iyx, ._6bes, ._55wo, ._4-dy, +.tlBody, #timelineBody, .timelineX, .timeline, .feed, .tlPrelude, .tlFeedPlaceholder, ._4_d0, +.al, ._1gkq, ._5c5b, ._1qxg, ._5luf, ._2new, ._cld, ._3zvb, ._2nk0, .btnD, .btnI, ._2bdb, ._3ci9, +._11ub, ._5p7j, ._55wm, ._5rgs, ._5xuj, ._1sv1, ._45fu, ._18qg, ._1_ac, ._5w3g, ._3e18, ._6be7, +._5q_r, ._5yt8, ._idb, ._2ip_, ._f6s, ._2l5v, ._8i2, ._kr5, ._2q7u, ._2q7v, ._5xp2, div.fullwidthMore, +._577z, ._2u4w, ._3u9p, ._3u9t, ._cw4, ._5_y-, ._5_y_, ._5_z3, ._cwy, ._5_z0, ._voz, ._vos, +._5_z1, ._5_z2, ._2mtc, ._206a, ._1_-1, ._1ybg, .appCenterCategorySelectorButton, ._5_ee, ._3clk, +._5c9u, div._5y57::before, ._59f6._55so::before, .structuredPublisher, ._94v, ._vqv, ._5lp5, +._55wm, ._2om3, ._2ol-, ._1f9d, ._vee, ._31a-, ._3r8b, ._3r9d, ._5vq5, ._3tl8, ._65wz, ._4edl, +.acw, ._4_xl, ._1p70, ._1p70, ._1ih_, ._51v6, ._u2c, ._484w, ._3ils, ._rm7, ._32qk, ._d01, ._1glm, +._ue6, ._hdn._hdn, +._2y60, ._5fu3, ._2foa, ._2y5_, ._38o9, ._1kb, .mAppCenterFatLabel, ._3bmj, ._5zmb, ._2x2s, ._3kac, ._3kad, +._3f50, .mentions-placeholder, .mentions, .mentions-shadow, .mentions-measurer, .acg, ._59tu, +._4l9b, ._4gj3, .groupChromeView, ._i3g, ._3jcf, .error, ._1dbp, ._5zma, ._6beq, ._vi6, +._uww, textarea, ._15n_, ._skt, ._5f28, ._14_j, ._3bg5, ._53_-, ._52x1, ._35au, ._cwy, +._1rfn ._1rfk ._4vc-, ._1rfk, ._1rfk ._2v9s, ._301x { + background: #fafafa !important; +} + +._31nf, ._2v9s, ._d4i, article._55wo, ._10c_, ._2jl2, ._55wo, ._6150, ._50mi, ._4-dw, ._4_2z { + background: #fff !important; +} + +.aclb { + background: #ddd !important; +} + +._cv_, ._2sq8 { + background-color: #fafafa !important; +} + +#page, ._8l7, ._-j8, ._-j9, ._6o5v { + background: transparent !important; +} + +.jewel, .flyout, ._52z5, ._13e_, ._5-lw, ._5c0e, .jx-result, ._336p, .mentions-suggest-item, ._2suk, +.mentions-suggest, ._1xoz, ._1xow { + background: #fafafa !important; +} + +._403n, ._14v5 ._14v8, ._1-kc { + background: #e6e6e6 !important; +} + +button:not([style*=image]):not(.privacyButtons), button::before, .touch ._56bt, ._56be::before, .btnS, .touch::before, +._590n, ._4g8h, ._2cpp, ._58a0.touched:after, +.timeline .timelinePublisher, .touched, .sharerAttachment, +.item a.primary.touched .primarywrap, ._38nq, ._537a, +._5xo2, ._5u5a::before, ._4u3j, ._15ks, ._5hua, ._59tt, ._41ft, .jx-tokenizer, ._55fj, +.excessItem, .acr, ._5-lx, ._3g9-, ._55ws, ._6dsj ._3gin, ._69aj, +._4e8n, ._5pxa._3uj9, ._5n_5, ._u2d, ._56bu::before, ._5h8f, ._d00, ._2066, ._2k51, +._10sb li.selected, ._2z4j, ._ib-, ._1bhl, ._5a5j, +._2b06, ._2tsf, ._3gka, .mCount, ._27vc, ._4pv-, ._6pk5, +._4qax, ._4756, ._w34, ._56bv::before, ._5769, ._34iv, ._z-w, ._t21, .mToken, +#addMembersTypeahead .mToken.mTokenWeakReference, +.acbk { + background: rgba(230, 230, 230, 0.35) !important; +} + +.mQuestionsPollResultsBar .shaded { + background: #3b5998 !important; +} + +._220g, ._1_y8:after, ._6pk6, +._2zh4::before, ._2ip_ ._2zh4::before, ._2ip_ ._15kk::before, ._2ip_ ._15kk + ._4u3j::before, +._58a0:before, ._43mh::before, ._43mh::after, ._1_-1::before, ._1kmv:after, ._1_ac:before { + background: rgba(0, 0, 0, 0.3) !important; +} + +button ._v89 ._54k8._1fl1 { + background: #3b5998 !important; +} + +._15kl::before, ._37fd .inlineComposerButton, ._1hb:before, +._5j35::after, ._2k4b, ._3to7, ._4nw8 { + border-left: 1px solid rgba(0, 0, 0, 0.3) !important; +} + +._4_d1, ._5cni { + border-right: 1px solid rgba(0, 0, 0, 0.3) !important; +} + +._1mx0, ._1rbr, ._5yt8, ._idb, ._cld, ._1e8h, ._z-w, ._1ha, ._1n8h ._1oby, ._5f99, ._2t39, +._2pbp, ._5rou:first-child, ._egf:first-child, ._io2, ._3qdi ._48_m::after, +._15n_, ._3-2-, ._27ve, ._2s20, ._gui, ._2s21 > *::after, ._32qk, ._d00, ._d01, ._38o9, +._3u9t, ._55fj, .mEventProfileSection.useBorder td, ._3ils, ._5as0, ._5as2, +._52x1, ._3wjp, ._usq, ._2cul:before, ._13e_, .jewel .flyout, ._3bg5 ._52x6, ._56d8, .al { + border-top: 1px solid rgba(0, 0, 0, 0.3) !important; +} + +._15ny::after, ._z-w, ._8i2, ._2nk0, ._22_8, ._1t4h, ._37fd, ._1ha, ._3bg5 ._56do, ._8he, +._400s, ._5hoc, ._1bhn, ._5ag6, ._4pvz, +._301x, ._x08 ._x0a:after, ._36dc, ._6-l ._57jn, ._527k, ._g_k, +._577z:not(:last-child) ._ygd, ._3u9u, ._3mgz, ._52x6, ._2066, ._5luf, ._2bdc, ._3ci9, +.mAppCenterFatLabel, .appCenterCategorySelectorButton, ._1q6v, ._5q_r, ._5yt8, ._38do, ._38dt, +._ap1, ._52x1, ._59tu, ._usq, ._13e_, ._59f6._55so::before, ._4gj3, .error, ._35--, ._1wev, +.jx-result, ._1f9d, ._vef, ._55x2 > *, .al, ._44qk, ._5rgs, ._5xuj, ._1sv1, ._idb, +._5lp5, ._3-2-, ._3to6, ._ir5, ._4nw6, ._4nwh, ._27ve, div._51v6::before, +._3c9h::before, ._2s20, ._gui, ._5jku, ._2foa, ._2y60, ._5fu3, ._4en9, ._1kb:not(:last-child) ._1kc, +._5pz4, ._5lp4, ._5lp5, ._5h6z, ._5h6x, ._2om4, ._5fjw > div, ._5fjv > :first-child, +._5fjw > :first-child { + border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important; +} + +.item a.primary.touched .primarywrap, ._4dwt ._5y33, ._1ih_, ._5_50, ._6beq, ._69aj, +._5fjv, ._3on6, ._2u4w, ._2om3, ._2ol-, ._5fjw, ._4z83, ._1gkq, ._4-dy { + border-top: 1px solid rgba(0, 0, 0, 0.3) !important; + border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important; +} + +._d4i, ._f6s, .mentions-suggest-item, .mentions-suggest, .sharerAttachment, +.mToken, #addMembersTypeahead .mToken.mTokenWeakReference, .mQuestionsPollResultsBar, +._15q7, ._2q7v, ._4dwt ._16ii, ._3qdi::after, +._2q7w, .acy, ._58ak, ._3t_l, ._4msa, ._3h8i, ._3clk, ._1kt6, ._1ksq, +._1_y5, ._lr0, ._5hgt, ._2cpp, ._50uu, ._50uw, ._31yd, ._1e3d, ._3xz7, ._1xoz, +._4kcb, ._2lut, .jewel .touchable-notification.touched, .touchable-notification .touchable.touched, +.home-notification .touchable.touched, ._6beo ._6ber, +._73ku ._73jw, +._4e8n, ._uww, .mentions-placeholder, .mentions-shadow, .mentions-measurer, +._5whq, ._59tt, ._41ft::after, .jx-tokenizer, ._3uqf, ._4756, ._1rrd, ._5n_f { + border: 1px solid rgba(0, 0, 0, 0.3) !important; +} + +.mQuestionsPollResultsBar .shaded, ._1027._13sm { + border: 1px solid #000 !important; +} + +._3gka { + border: 1px dashed rgba(0, 0, 0, 0.3) !important; +} + +._4o58::after, .acr, ._t21, ._2bdb, +.acw, .aclb, ._4qax, ._5h8f { + border-color: rgba(0, 0, 0, 0.3) !important; +} + +._15ks ._15kl::before { + border-left: 1px solid transparent !important; +} + +._56bf, .touch .btn { + border-radius: 0 !important; + border: 0 !important; +} + +._2cis { + border-left: 10px solid #fafafa !important; + border-right: 10px solid #fafafa !important; +} + +._2cir.selected, ._42rv, ._5zma, ._2x2s { + border-bottom: 3px solid #000 !important; +} + +._1ss6 { + border-left: 2px solid #000 !important; +} + +._484w.selected > ._6zf, ._5kqs::after, ._3lvo ._5xum._5xuk, ._x0b { + border-bottom: 1px solid #000 !important; +} + +._34ee { + background: rgba(230, 230, 230, 0.35) !important; + color: #000 !important; +} + +._34em ._34ee { + background: #3b5998 !important; + color: #fff !important; +} + +._5as0, ._5cni, ._5as2 { + background: #fafafa !important; +} + +*, *::after, *::before { + text-shadow: none !important; + box-shadow: none !important; +} + +[data-sigil=m_login_upsell], +[data-sigil="m-loading-indicator-animate m-loading-indicator-root"] { + display: none !important; +} + +::-webkit-input-placeholder { + color: #000 !important; +} + +:-moz-placeholder { + color: #000 !important; +} + +::-moz-placeholder { + color: #000 !important; +} + +:-ms-input-placeholder { + color: #000 !important; +} + +.excessItem { + outline: rgba(0, 0, 0, 0.3) !important; +} + +._3m1m { + background: linear-gradient(transparent, #fafafa) !important; +} + +@-webkit-keyframes highlightFade { + 0%, 50% { + background: rgba(230, 230, 230, 0.35); + } + 100% { + background: #fafafa; + } +} +@-moz-keyframes highlightFade { + 0%, 50% { + background: rgba(230, 230, 230, 0.35); + } + 100% { + background: #fafafa; + } +} +@keyframes highlightFade { + 0%, 50% { + background: rgba(230, 230, 230, 0.35); + } + 100% { + background: #fafafa; + } +} +@-webkit-keyframes chatHighlightAnimation { + 0%, 100% { + background: #fafafa; + } + 50% { + background: rgba(230, 230, 230, 0.35); + } +} +@-moz-keyframes chatHighlightAnimation { + 0%, 100% { + background: #fafafa; + } + 50% { + background: rgba(230, 230, 230, 0.35); + } +} +@keyframes chatHighlightAnimation { + 0%, 100% { + background: #fafafa; + } + 50% { + background: rgba(230, 230, 230, 0.35); + } +} +._50uu { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 -10 50 50"%3E%3Ccircle cx="25" cy="23" r="3.2"/%3E%3Cpath d="M22 13l-1.83 2H17c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V17c0-1.1-.9-2-2-2h-3.17L28 13h-6zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z"/%3E%3Cpath fill="none" d="M13 11h24v24H13z"/%3E%3C/svg%3E') no-repeat !important; +} + +._50uw { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 0 50 50"%3E%3Cpath fill="none" d="M13 26h24v24H13z"/%3E%3Cpath d="M30 31.5V28c0-.55-.45-1-1-1H17c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4z"/%3E%3C/svg%3E') no-repeat !important; +} + +._15km ._15ko::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-1.91l-.01-.01L23 10z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15ko._77la::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%233b5998" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath d="M1 21h4V9H1v12zm22-11c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-1.91l-.01-.01L23 10z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15kq::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 0 24 24"%3E%3Cpath d="M21.99 4c0-1.1-.89-2-1.99-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h14l4 4-.01-18z"/%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +._15km ._15kr::before { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" fill="%23000" viewBox="0 0 24 24"%3E%3Cpath d="M14 9V5l7 7-7 7v-4.1c-5 0-8.5 1.6-11 5.1 1-5 4-10 11-11z"/%3E%3Cpath fill="none" d="M24 0H0v24h24z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} + +.story_body_container i.img[data-sigil*=story-popup-context] { + background: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"%3E%3Cpath fill="none" d="M0 0h24v24H0z"/%3E%3Cpath fill="%23000" d="M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/%3E%3C/svg%3E') no-repeat !important; + background-position: center !important; +} diff --git a/app/src/web/assets/css/themes/material_light.scss b/app/src/web/assets/css/themes/material_light.scss new file mode 100644 index 00000000..7ec58463 --- /dev/null +++ b/app/src/web/assets/css/themes/material_light.scss @@ -0,0 +1,15 @@ +$text: #000; +$accent_text: #fff; +$link: #3b5998; +$accent: #3b5998; +$background: #fafafa; +// this is actually the inverse of material light (bg should be gray, cards should be white), +// but it looks better than the alternative +$background2: rgba(darken($background, 8%), 0.35); + +$bg_transparent: $background; + +$card: #fff; +$tint: #ddd; + +@import "../core/main"; \ No newline at end of file -- cgit v1.2.3