From df811401515b879adc2574f2d17c4b7763b47708 Mon Sep 17 00:00:00 2001 From: SpiritCroc Date: Sun, 13 Oct 2024 12:33:26 +0200 Subject: [PATCH] Initial compound-based SC theme bringup --- matrix-react-sdk | 2 +- ...hildi-fetch-package.ts-modifications.patch | 2 +- ...Add-fields-for-media-caption-support.patch | 2 +- .../0001-Disable-sticky-rooms.patch | 2 +- .../0002-Bring-back-unified-room-list.patch | 2 +- ...-rooms-to-bottom-I-still-want-to-see.patch | 2 +- ...rendering-captions-in-media-messages.patch | 2 +- .../0005-Don-t-preview-reactions.patch | 2 +- ...tification-state-the-same-way-as-the.patch | 2 +- ...llow-muted-rooms-to-render-as-unread.patch | 2 +- .../0008-Increase-default-visible-tiles.patch | 2 +- ...paceDMBadges-setting-force-enabled-f.patch | 2 +- ...m-reactions-from-tadzik-freeform-rea.patch | 2 +- ...1-Allow-reactions-to-take-more-space.patch | 2 +- ...don-t-automatically-show-last-opened.patch | 2 +- ...0013-Exclude-spaces-from-breadcrumbs.patch | 2 +- .../0014-Stop-the-search-bar-wobble.patch | 2 +- ...6-Import-SC-compound-theme-overrides.patch | 34 ++++ res/css/sc-cpd-overrides.css | 172 ++++++++++++++++++ theme.sh | 8 + 20 files changed, 231 insertions(+), 17 deletions(-) create mode 100644 patches/matrix-react-sdk/0016-Import-SC-compound-theme-overrides.patch create mode 100644 res/css/sc-cpd-overrides.css diff --git a/matrix-react-sdk b/matrix-react-sdk index d377796..d160a1b 160000 --- a/matrix-react-sdk +++ b/matrix-react-sdk @@ -1 +1 @@ -Subproject commit d3777969edf2d708afcbe8b66f843f57a8f03e97 +Subproject commit d160a1bbdef8a93a2139e0e159a5fc5eb7c8ed7a diff --git a/patches/element-desktop/0002-Add-back-schildi-fetch-package.ts-modifications.patch b/patches/element-desktop/0002-Add-back-schildi-fetch-package.ts-modifications.patch index 9b45443..462322a 100644 --- a/patches/element-desktop/0002-Add-back-schildi-fetch-package.ts-modifications.patch +++ b/patches/element-desktop/0002-Add-back-schildi-fetch-package.ts-modifications.patch @@ -58,5 +58,5 @@ index 54da3f3..354f039 100644 if (!haveDeploy) { const outPath = path.join(pkgDir, filename); -- -2.46.2 +2.47.0 diff --git a/patches/matrix-js-sdk/0001-Add-fields-for-media-caption-support.patch b/patches/matrix-js-sdk/0001-Add-fields-for-media-caption-support.patch index ab4cfdd..27a05d9 100644 --- a/patches/matrix-js-sdk/0001-Add-fields-for-media-caption-support.patch +++ b/patches/matrix-js-sdk/0001-Add-fields-for-media-caption-support.patch @@ -52,5 +52,5 @@ index 1128b40d3..d85526642 100644 /** -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0001-Disable-sticky-rooms.patch b/patches/matrix-react-sdk/0001-Disable-sticky-rooms.patch index 5481670..2004021 100644 --- a/patches/matrix-react-sdk/0001-Disable-sticky-rooms.patch +++ b/patches/matrix-react-sdk/0001-Disable-sticky-rooms.patch @@ -25,5 +25,5 @@ index c3450d70cf..e296676149 100644 } -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0002-Bring-back-unified-room-list.patch b/patches/matrix-react-sdk/0002-Bring-back-unified-room-list.patch index 62e2836..41a43aa 100644 --- a/patches/matrix-react-sdk/0002-Bring-back-unified-room-list.patch +++ b/patches/matrix-react-sdk/0002-Bring-back-unified-room-list.patch @@ -259,5 +259,5 @@ index 50cecda665..8efc2d040d 100644 DefaultTagID.Conference, DefaultTagID.Untagged, -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0003-Don-t-sort-muted-rooms-to-bottom-I-still-want-to-see.patch b/patches/matrix-react-sdk/0003-Don-t-sort-muted-rooms-to-bottom-I-still-want-to-see.patch index 759095e..ae8877f 100644 --- a/patches/matrix-react-sdk/0003-Don-t-sort-muted-rooms-to-bottom-I-still-want-to-see.patch +++ b/patches/matrix-react-sdk/0003-Don-t-sort-muted-rooms-to-bottom-I-still-want-to-see.patch @@ -21,5 +21,5 @@ index 67ee1ca084..67dcaa3855 100644 /** -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0004-Add-support-for-rendering-captions-in-media-messages.patch b/patches/matrix-react-sdk/0004-Add-support-for-rendering-captions-in-media-messages.patch index 86ba34d..e28ee51 100644 --- a/patches/matrix-react-sdk/0004-Add-support-for-rendering-captions-in-media-messages.patch +++ b/patches/matrix-react-sdk/0004-Add-support-for-rendering-captions-in-media-messages.patch @@ -100,5 +100,5 @@ index 194cb31d20..0c0aec2138 100644 // file extension. text = content.body; -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0005-Don-t-preview-reactions.patch b/patches/matrix-react-sdk/0005-Don-t-preview-reactions.patch index 6f307c3..65f077a 100644 --- a/patches/matrix-react-sdk/0005-Don-t-preview-reactions.patch +++ b/patches/matrix-react-sdk/0005-Don-t-preview-reactions.patch @@ -25,5 +25,5 @@ index e0e06ec980..7ee27f8402 100644 isState: false, previewer: new PollStartEventPreview(), -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0006-Hide-the-mute-notification-state-the-same-way-as-the.patch b/patches/matrix-react-sdk/0006-Hide-the-mute-notification-state-the-same-way-as-the.patch index 2bdaccc..040b871 100644 --- a/patches/matrix-react-sdk/0006-Hide-the-mute-notification-state-the-same-way-as-the.patch +++ b/patches/matrix-react-sdk/0006-Hide-the-mute-notification-state-the-same-way-as-the.patch @@ -26,5 +26,5 @@ index 93fb42f447..09df8eaac9 100644 return ( -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0007-Allow-muted-rooms-to-render-as-unread.patch b/patches/matrix-react-sdk/0007-Allow-muted-rooms-to-render-as-unread.patch index 35d844a..7917d42 100644 --- a/patches/matrix-react-sdk/0007-Allow-muted-rooms-to-render-as-unread.patch +++ b/patches/matrix-react-sdk/0007-Allow-muted-rooms-to-render-as-unread.patch @@ -21,5 +21,5 @@ index cc027c9682..c4c31a51cb 100644 } -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0008-Increase-default-visible-tiles.patch b/patches/matrix-react-sdk/0008-Increase-default-visible-tiles.patch index 3320330..6a58ead 100644 --- a/patches/matrix-react-sdk/0008-Increase-default-visible-tiles.patch +++ b/patches/matrix-react-sdk/0008-Increase-default-visible-tiles.patch @@ -21,5 +21,5 @@ index ff60309e08..275b6d330b 100644 public tilesWithPadding(n: number, paddingPx: number): number { -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0009-Bring-back-showSpaceDMBadges-setting-force-enabled-f.patch b/patches/matrix-react-sdk/0009-Bring-back-showSpaceDMBadges-setting-force-enabled-f.patch index 940a3aa..2443326 100644 --- a/patches/matrix-react-sdk/0009-Bring-back-showSpaceDMBadges-setting-force-enabled-f.patch +++ b/patches/matrix-react-sdk/0009-Bring-back-showSpaceDMBadges-setting-force-enabled-f.patch @@ -88,5 +88,5 @@ index 90358f3310..60df05478a 100644 const newValue = SettingsStore.getValue("Spaces.enabledMetaSpaces"); const enabledMetaSpaces = metaSpaceOrder.filter((k) => newValue[k]); -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0010-Squashed-Freeform-reactions-from-tadzik-freeform-rea.patch b/patches/matrix-react-sdk/0010-Squashed-Freeform-reactions-from-tadzik-freeform-rea.patch index 7ebbc4a..f1f2631 100644 --- a/patches/matrix-react-sdk/0010-Squashed-Freeform-reactions-from-tadzik-freeform-rea.patch +++ b/patches/matrix-react-sdk/0010-Squashed-Freeform-reactions-from-tadzik-freeform-rea.patch @@ -130,5 +130,5 @@ index 2c2eb442a0..62bfd2ea0f 100644 isEmojiDisabled={this.isEmojiDisabled} onFinished={this.props.onFinished} -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0011-Allow-reactions-to-take-more-space.patch b/patches/matrix-react-sdk/0011-Allow-reactions-to-take-more-space.patch index 272c8d6..6e8d6f1 100644 --- a/patches/matrix-react-sdk/0011-Allow-reactions-to-take-more-space.patch +++ b/patches/matrix-react-sdk/0011-Allow-reactions-to-take-more-space.patch @@ -28,5 +28,5 @@ index f2e3885de4..2a8bb9224e 100644 white-space: nowrap; text-overflow: ellipsis; -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0012-On-space-switch-don-t-automatically-show-last-opened.patch b/patches/matrix-react-sdk/0012-On-space-switch-don-t-automatically-show-last-opened.patch index 0036759..b23198c 100644 --- a/patches/matrix-react-sdk/0012-On-space-switch-don-t-automatically-show-last-opened.patch +++ b/patches/matrix-react-sdk/0012-On-space-switch-don-t-automatically-show-last-opened.patch @@ -75,5 +75,5 @@ index 60df05478a..0be7ba190a 100644 cliSpace?.getMyMembership() !== KnownMembership.Invite && this.matrixClient.getRoom(roomId)?.getMyMembership() === KnownMembership.Join && -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0013-Exclude-spaces-from-breadcrumbs.patch b/patches/matrix-react-sdk/0013-Exclude-spaces-from-breadcrumbs.patch index 1fd5871..8739751 100644 --- a/patches/matrix-react-sdk/0013-Exclude-spaces-from-breadcrumbs.patch +++ b/patches/matrix-react-sdk/0013-Exclude-spaces-from-breadcrumbs.patch @@ -20,5 +20,5 @@ index 9859f24015..957b54286c 100644 const rooms = (this.state.rooms || []).slice(); // cheap clone const msc3946ProcessDynamicPredecessor = SettingsStore.getValue("feature_dynamic_room_predecessors"); -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0014-Stop-the-search-bar-wobble.patch b/patches/matrix-react-sdk/0014-Stop-the-search-bar-wobble.patch index 744778f..45e461c 100644 --- a/patches/matrix-react-sdk/0014-Stop-the-search-bar-wobble.patch +++ b/patches/matrix-react-sdk/0014-Stop-the-search-bar-wobble.patch @@ -20,5 +20,5 @@ index 05a3dac067..7861af6381 100644 /* FIXME THEME - Tint by CSS rather than referencing a duplicate asset */ -- -2.46.2 +2.47.0 diff --git a/patches/matrix-react-sdk/0016-Import-SC-compound-theme-overrides.patch b/patches/matrix-react-sdk/0016-Import-SC-compound-theme-overrides.patch new file mode 100644 index 0000000..e5aad3a --- /dev/null +++ b/patches/matrix-react-sdk/0016-Import-SC-compound-theme-overrides.patch @@ -0,0 +1,34 @@ +From 8b2c552f798e64974d0a0380f55cadb4f72dd67c Mon Sep 17 00:00:00 2001 +From: SpiritCroc +Date: Sun, 13 Oct 2024 11:23:54 +0200 +Subject: Import SC compound theme overrides + +--- + res/css/_common.pcss | 1 + + res/css/sc-cpd-overrides.css | 1 + + 2 files changed, 2 insertions(+) + create mode 120000 res/css/sc-cpd-overrides.css + +diff --git a/res/css/_common.pcss b/res/css/_common.pcss +index 7861af6381..f7a660a339 100644 +--- a/res/css/_common.pcss ++++ b/res/css/_common.pcss +@@ -11,6 +11,7 @@ Please see LICENSE files in the repository root for full details. + + @import url("@vector-im/compound-design-tokens/assets/web/css/compound-design-tokens.css") layer(compound); + @import url("@vector-im/compound-web/dist/style.css"); ++@import "./sc-cpd-overrides.css"; + @import "./_font-sizes.pcss"; + @import "./_animations.pcss"; + @import "./_spacing.pcss"; +diff --git a/res/css/sc-cpd-overrides.css b/res/css/sc-cpd-overrides.css +new file mode 120000 +index 0000000000..532e96fddc +--- /dev/null ++++ b/res/css/sc-cpd-overrides.css +@@ -0,0 +1 @@ ++../../../res/css/sc-cpd-overrides.css +\ No newline at end of file +-- +2.47.0 + diff --git a/res/css/sc-cpd-overrides.css b/res/css/sc-cpd-overrides.css new file mode 100644 index 0000000..bffb61c --- /dev/null +++ b/res/css/sc-cpd-overrides.css @@ -0,0 +1,172 @@ +/* + * Upstream file for reference: + * - Dark: https://github.com/element-hq/compound-design-tokens/blob/main/assets/web/css/cpd-theme-dark-base.css + * - Light: https://github.com/element-hq/compound-design-tokens/blob/main/assets/web/css/cpd-theme-light-base.css + */ + +.cpd-theme-dark.cpd-theme-dark { + /* TODO? + --cpd-color-alpha-green-1400: hsla(152, 88%, 94%, 0.96); + --cpd-color-alpha-green-1300: hsla(152, 93%, 88%, 0.91); + --cpd-color-alpha-green-1200: hsla(156, 97%, 76%, 0.83); + --cpd-color-alpha-green-1100: hsla(162, 98%, 57%, 0.74); + --cpd-color-alpha-green-1000: hsla(163, 99%, 55%, 0.65); + --cpd-color-alpha-green-900: hsla(164, 98%, 53%, 0.58); + --cpd-color-alpha-green-800: hsl(168, 100%, 24%, 1); + --cpd-color-alpha-green-700: hsl(165, 100%, 18%, 1); + --cpd-color-alpha-green-600: hsl(162, 100%, 14%, 1); + --cpd-color-alpha-green-500: hsl(160, 100%, 12%, 1); + --cpd-color-alpha-green-400: hsl(155, 100%, 9%, 1); + --cpd-color-alpha-green-300: hsl(151, 100%, 7%, 1); + --cpd-color-alpha-green-200: hsl(147, 100%, 6%, 1); + --cpd-color-alpha-green-100: hsl(144, 100%, 6%, 1); + + --cpd-color-alpha-gray-1400: hsla(214, 78%, 98%, 0.95); + --cpd-color-alpha-gray-1300: hsla(213, 73%, 97%, 0.89); + --cpd-color-alpha-gray-1200: hsla(215, 74%, 96%, 0.79); + --cpd-color-alpha-gray-1100: hsla(215, 92%, 95%, 0.68); + --cpd-color-alpha-gray-1000: hsla(213, 93%, 94%, 0.61); + --cpd-color-alpha-gray-900: hsla(211, 94%, 94%, 0.54); + --cpd-color-alpha-gray-800: hsla(216, 100%, 94%, 0.41); + --cpd-color-alpha-gray-700: hsla(213, 85%, 95%, 0.27); + --cpd-color-alpha-gray-600: hsla(225, 46%, 95%, 0.2); + --cpd-color-alpha-gray-500: hsla(214, 41%, 97%, 0.15); + --cpd-color-alpha-gray-400: hsla(270, 37%, 93%, 0.1); + --cpd-color-alpha-gray-200: hsla(286, 31%, 82%, 0.04); + --cpd-color-alpha-gray-100: hsla(214, 10%, 86%, 0.02); + */ + /* Hover of room list items, search bar bg, space icon bg */ + --cpd-color-alpha-gray-300: rgba(255, 255, 255, 0.06); + + /* TODO more accent variants? */ + --cpd-color-green-1400: #F1F8E9; + --cpd-color-green-1300: #DCEDC8; + --cpd-color-green-1200: #C5E1A5; + --cpd-color-green-1100: #AED581; + --cpd-color-green-1000: #9CCC65; + --cpd-color-green-900: #8BC34A; + --cpd-color-green-800: #8BC34A; + --cpd-color-green-700: #8BC34A; + --cpd-color-green-600: #8BC34A; + --cpd-color-green-500: #8BC34A; + --cpd-color-green-400: #689F38; + --cpd-color-green-300: #33691E; + --cpd-color-green-200: #33691E; + --cpd-color-green-100: #33691E; + + /* TODO + --cpd-color-red-1400: #ffe9e6; + --cpd-color-red-1300: #ffd4cd; + --cpd-color-red-1200: #ffaea4; + --cpd-color-red-1100: #ff877c; + --cpd-color-red-1000: #ff665d; + --cpd-color-red-900: #fd3e3c; + --cpd-color-red-800: #d1212a; + --cpd-color-red-700: #9f0d1e; + --cpd-color-red-600: #830009; + --cpd-color-red-500: #710000; + --cpd-color-red-400: #590000; + --cpd-color-red-300: #470000; + --cpd-color-red-200: #3e0000; + --cpd-color-red-100: #370000; + */ + + --cpd-color-gray-1400: #eeeeee; + --cpd-color-gray-1300: #e0e0e0; + --cpd-color-gray-1200: #b3b3b3; + --cpd-color-gray-1100: #aaaaaa; + --cpd-color-gray-1000: #9e9e9e; + --cpd-color-gray-900: #808080; + --cpd-color-gray-800: #757575; + --cpd-color-gray-700: #424242; + --cpd-color-gray-600: #424242; + --cpd-color-gray-500: #424242; + --cpd-color-gray-400: #303030; + --cpd-color-gray-300: #212121; + --cpd-color-gray-200: #212121; + --cpd-color-gray-100: #212121; + --cpd-color-theme-bg: #212121; +} + +.cpd-theme-light.cpd-theme-light { + /* TODO? + --cpd-color-alpha-gray-1400: hsla(223, 64%, 2%, 0.9); + --cpd-color-alpha-gray-1300: hsla(225, 57%, 3%, 0.84); + --cpd-color-alpha-gray-1200: hsla(213, 73%, 3%, 0.77); + --cpd-color-alpha-gray-1100: hsla(215, 74%, 5%, 0.71); + --cpd-color-alpha-gray-1000: hsla(218, 79%, 6%, 0.66); + --cpd-color-alpha-gray-900: hsla(213, 83%, 7%, 0.61); + --cpd-color-alpha-gray-800: hsla(213, 87%, 9%, 0.5); + --cpd-color-alpha-gray-700: hsla(215, 96%, 10%, 0.35); + --cpd-color-alpha-gray-600: hsla(212, 97%, 12%, 0.26); + --cpd-color-alpha-gray-500: hsla(212, 87%, 15%, 0.2); + --cpd-color-alpha-gray-400: hsla(213, 90%, 20%, 0.12); + --cpd-color-alpha-gray-300: hsla(216, 89%, 18%, 0.06); + --cpd-color-alpha-gray-200: hsla(200, 41%, 36%, 0.04); + --cpd-color-alpha-gray-100: hsla(210, 48%, 41%, 0.02); + + --cpd-color-alpha-green-1400: hsl(149, 100%, 7%, 1); + --cpd-color-alpha-green-1300: hsl(157, 100%, 10%, 1); + --cpd-color-alpha-green-1200: hsl(162, 100%, 14%, 1); + --cpd-color-alpha-green-1100: hsl(165, 100%, 18%, 1); + --cpd-color-alpha-green-1000: hsl(166, 100%, 21%, 1); + --cpd-color-alpha-green-900: hsl(168, 100%, 24%, 1); + --cpd-color-alpha-green-800: hsl(166, 100%, 30%, 1); + --cpd-color-alpha-green-700: hsla(163, 99%, 38%, 0.96); + --cpd-color-alpha-green-600: hsla(156, 99%, 36%, 0.56); + --cpd-color-alpha-green-500: hsla(154, 96%, 37%, 0.41); + --cpd-color-alpha-green-400: hsla(151, 93%, 37%, 0.23); + --cpd-color-alpha-green-300: hsla(150, 100%, 36%, 0.11); + --cpd-color-alpha-green-200: hsla(150, 79%, 41%, 0.06); + --cpd-color-alpha-green-100: hsla(156, 79%, 41%, 0.03); + */ + + /* TODO accent variants? */ + --cpd-color-green-1400: #33691E; + --cpd-color-green-1300: #33691E; + --cpd-color-green-1200: #33691E; + --cpd-color-green-1100: #33691E; + --cpd-color-green-1000: #33691E; + --cpd-color-green-900: #33691E; + --cpd-color-green-800: #33691E; + --cpd-color-green-700: #8BC34A; + --cpd-color-green-600: #8BC34A; + --cpd-color-green-500: #8BC34A; + --cpd-color-green-400: #8BC34A; + --cpd-color-green-300: #C5E1A5; + --cpd-color-green-200: #DCEDC8; + --cpd-color-green-100: #F1F8E9; + + /* TODO + --cpd-color-red-1400: #450000; + --cpd-color-red-1300: #620000; + --cpd-color-red-1200: #850006; + --cpd-color-red-1100: #a4041d; + --cpd-color-red-1000: #bc0f22; + --cpd-color-red-900: #d51928; + --cpd-color-red-800: #ff3d3d; + --cpd-color-red-700: #ff8c81; + --cpd-color-red-600: #ffafa5; + --cpd-color-red-500: #ffc5bc; + --cpd-color-red-400: #ffdfda; + --cpd-color-red-300: #ffefec; + --cpd-color-red-200: #fff7f6; + --cpd-color-red-100: #fffaf9; + */ + + --cpd-color-gray-1400: #212121; + --cpd-color-gray-1300: #212121; + --cpd-color-gray-1200: #424242; + --cpd-color-gray-1100: #424242; + --cpd-color-gray-1000: #616161; + --cpd-color-gray-900: #616161; + --cpd-color-gray-800: #808080; + --cpd-color-gray-700: #b3b3b3; + --cpd-color-gray-600: #b3b3b3; + --cpd-color-gray-500: #cdd3da; + --cpd-color-gray-400: #e0e0e0; + --cpd-color-gray-300: #f5f5f5; + --cpd-color-gray-200: #f5f5f5; + --cpd-color-gray-100: #fafafa; + --cpd-color-theme-bg: #ffffff; +} diff --git a/theme.sh b/theme.sh index 8aee68d..58927ff 100755 --- a/theme.sh +++ b/theme.sh @@ -37,6 +37,8 @@ replace_colors() { MESSAGE_BUBBLE_BACKGROUND="#424242" MESSAGE_BUBBLE_BACKGROUND_SELF="#303030" MESSAGE_BUBBLE_BACKGROUND_SELECTED="#3f4931" + ROOMLIST_BG_COLOR="#303030" + SPACELIST_BG_COLOR="#424242" else echo "Replacing colors (light) for $f..." BG_ACCENT="$M_ACCENT_LIGHT" @@ -48,6 +50,8 @@ replace_colors() { MESSAGE_BUBBLE_BACKGROUND="#eeeeee" MESSAGE_BUBBLE_BACKGROUND_SELF="#f1f8e9" MESSAGE_BUBBLE_BACKGROUND_SELECTED="#dbedc6" + ROOMLIST_BG_COLOR="#eeeeee" + SPACELIST_BG_COLOR="#fafafa" fi # Neutral colors sed -i 's|#15171b|#212121|gi' "$f" @@ -110,6 +114,7 @@ replace_colors() { sed -i 's|rgba(33, 38, 44,|rgba(48, 48, 48,|gi' "$f" sed -i 's|rgba(34, 38, 46,|rgba(48, 48, 48,|gi' "$f" sed -i 's|rgba(38, 39, 43,|rgba(48, 48, 48,|gi' "$f" + sed -i 's|rgba(38, 40, 45,|rgba(48, 48, 48,|gi' "$f" sed -i 's|rgba(46, 48, 51,|rgba(48, 48, 48,|gi' "$f" sed -i 's|rgba(92, 100, 112,|rgba(97, 97, 97,|gi' "$f" sed -i 's|rgba(141, 151, 165,|rgba(144, 144, 144,|gi' "$f" @@ -127,6 +132,9 @@ replace_colors() { sed -i "s|\\(\$presence-offline: \\).*;|\\1$PRESENCE_OFFLINE;|gi" "$f" + sed -i "s|\\(\$roomlist-bg-color: \\).*;|\\1$ROOMLIST_BG_COLOR;|gi" "$f" + sed -i "s|\\(\$spacePanel-bg-color: \\).*;|\\1$SPACELIST_BG_COLOR;|gi" "$f" + # Accent colors sed -i "s|#368bd6|$M_ACCENT|gi" "$f" sed -i "s|#ac3ba8|$M_ACCENT|gi" "$f"