From a95402e0a7d5105c25e455bd275018a150187076 Mon Sep 17 00:00:00 2001 From: SpiritCroc Date: Sat, 27 Apr 2024 18:01:16 +0200 Subject: [PATCH] Import theme.sh from matrix-react-sdk Original history: commit 3ac1d305c420a23cab13c4f1756742663dddfe5a Author: su-ex Make linter happier commit 1cea13f3c55f353fd3bac1110214de54ba3d6ade Author: su-ex Make linter happier commit a29fbec8465ed803e44c386395bf81945b417175 Author: su-ex Fix codeblock background and border commit 0f9478f023f050a46788a4cb8a988d7a80afe57b Merge: a1e6fe4d42 1f3ad86106 Author: su-ex Merge tag 'v3.65.0' into sc commit ae33cfe40daa995ff4944b5a6d53a3fbfcd824e2 Merge: be6ad48996 8219e44596 Author: su-ex Merge tag 'v3.64.1' into sc commit 8126c80e45eefac0a2e42381c45461552ac7521f Merge: 4e56372068 cf36acaa41 Author: su-ex Merge tag 'v3.63.0' into sc commit 98e270faeb43e823bb04d9ee75883fd41adfc1c4 Author: su-ex theme.sh: scss --> pcss commit 8513eaa1390922f05d498c8490737be95c6b5ce8 Author: su-ex Change red the second commit 002d1365346f53261cf67427f383aea85655b3b3 Author: su-ex Better pill and alert colors commit 1ad4250029b8c3a06d588d80b1e06a9a051e48e0 Merge: 158486173b b5fdf11a03 Author: su-ex Merge tag 'v3.45.0' into sc commit c1a277047410e74ae24d3737fe514c7579f98878 Author: su-ex Fix themes - Rebase on Element - Better pills commit 6e73e67e7e98b3b35804aafa1349b38ad66eac08 Author: su-ex Fix $presence-offline not visible with light theme if room tile selected commit 9092353573307888b64fa1d0b841b43520b26e20 Author: su-ex theme.sh: Move clean git state check inside correct folder commit 6dd1575cadda61502eb509757182377c06adfd27 Merge: d30537548c cc296ef3da Author: su-ex Merge tag 'v3.42.1' into sc commit f3da66ac6aec0e726f37dc114466642e907b9cf5 Author: su-ex Allow theme.sh being run without commit commit 44fce0c9120bd29ac4d2673589c56d05f2dc5aeb Author: su-ex More pill stuff: - Consider custom themes - Same colors for other users and rooms - Less lighter dark bg commit 0b012f748750db67f1618c4aeb1b16c87403fb41 Author: su-ex Make pill background actually lighter tham the background with the dark theme commit c1cde5ad305610245af6c155dbddfb17e2962e24 Author: su-ex Fix other user pills not visible with dark theme commit 973ddf8edc3fd4583961c65909bbc279dc36f847 Merge: 56b7e84a4c b856083716 Author: su-ex Merge tag 'v3.36.0' into sc commit 515ee58343ac057ccaea75476377078f5ff99bc0 Merge: ae37a2dc79 bb55c76d81 Author: su-ex Merge tag 'v3.35.1' into sc commit c6f67a0bce737e2d3f19bda4e07dab91e6b8fd33 Merge: 9e709b6699 27e2faaf64 Author: su-ex Merge tag 'v3.34.0' into sc commit 3c6579e953662e46454b5e3140ad37262d34709c Author: su-ex theme.sh update commit 7bf38e0802b549184158c049a3c2efc162cb4b8e Author: su-ex Some after merge fixes commit e2d95dab547d944c4b4c04aac8c52cedcafddd4e Merge: 8ee39e7f15 e4f27f04b9 Author: su-ex Merge remote-tracking branch 'upstream/master' into sc commit 508e1653131481bde34b70c7737e5c1f09d5cb2a Merge: 351fd94451 e77f7319f2 Author: su-ex Merge remote-tracking branch 'upstream/master' into sc commit 525337fd829e5f778fcab8de68a5fcb078ab8c38 Author: su-ex Add some colors to theme.sh commit e918256a19bc195fd7bf3afa44144804390d6ff3 Author: su-ex Don't let automatic theme update fail if there was nothing to commit commit 09ce713cecd749c195264f8051572bb0db05b496 Author: SpiritCroc Fix some theme inconsistencies commit 196bed3bf5ce9b006005f32092e6dbc898ac30ce Author: SpiritCroc Update theme.sh commit 53ad57e118b2c14b8dcc6bf6821dde80df980626 Author: SpiritCroc Update theme.sh commit be4d6751620d73a256337803ad5f9d9b47463c56 Author: SpiritCroc theme.sh: Improve unread badge bg color commit d91294f6ee0b92c37d7770f77f043f82fd1f2b58 Author: SpiritCroc Add theme.sh --- theme.sh | 174 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 174 insertions(+) create mode 100755 theme.sh diff --git a/theme.sh b/theme.sh new file mode 100755 index 0000000..4b825bf --- /dev/null +++ b/theme.sh @@ -0,0 +1,174 @@ +#!/bin/bash + +shopt -s globstar + +mydir="$(dirname "$(realpath "$0")")" +automatic_commit="$1" + +pushd "$mydir/matrix-react-sdk" > /dev/null + +if [[ "$automatic_commit" == [Yy]* ]]; then + # Require clean git state + uncommitted=`git status --porcelain` + if [ ! -z "$uncommitted" ]; then + echo "Uncommitted changes are present, please commit first!" + exit 1 + fi +fi + +M_ACCENT="#8bc34a" +M_ACCENT_DEC="139, 195, 74" +M_ACCENT_DARK="#33691e" +M_ACCENT_LIGHT="#dcedc8" +M_ALERT="#e53935" +M_LINK="#368bd6" + +replace_colors() { + local f="$1" + if [[ "$f" =~ "dark" ]]; then + BG_ACCENT="$M_ACCENT_DARK" + CODEBLOCK_BORDER_COLOR="#121212" + CODEBLOCK_BACKGROUND_COLOR="#121212" + PILL_COLOR="rgba(255, 255, 255, 0.15)" + PILL_HOVER_COLOR="rgba(255, 255, 255, 0.18)" + PRESENCE_OFFLINE="#e0e0e0" # not applied because not existing specifically for dark + MESSAGE_BUBBLE_BACKGROUND="#424242" + MESSAGE_BUBBLE_BACKGROUND_SELF="#303030" + MESSAGE_BUBBLE_BACKGROUND_SELECTED="#3f4931" + else + BG_ACCENT="$M_ACCENT_LIGHT" + CODEBLOCK_BORDER_COLOR="#00000010" + CODEBLOCK_BACKGROUND_COLOR="#00000010" + PILL_COLOR="rgba(0, 0, 0, 0.13)" + PILL_HOVER_COLOR="rgba(0, 0, 0, 0.1)" + PRESENCE_OFFLINE="#bdbdbd" # for light this should actually be darker + MESSAGE_BUBBLE_BACKGROUND="#eeeeee" + MESSAGE_BUBBLE_BACKGROUND_SELF="#f1f8e9" + MESSAGE_BUBBLE_BACKGROUND_SELECTED="#dbedc6" + fi + # Neutral colors + sed -i 's|#15171b|#212121|gi' "$f" + sed -i 's|#15191E|#212121|gi' "$f" + sed -i 's|#2e2f32|#212121|gi' "$f" + sed -i 's|#232f32|#212121|gi' "$f" + sed -i 's|#27303a|#212121|gi' "$f" + sed -i 's|#17191C|#212121|gi' "$f" + sed -i 's|#181b21|#303030|gi' "$f" + sed -i 's|#1A1D23|#303030|gi' "$f" + sed -i 's|#20252B|#303030|gi' "$f" + sed -i 's|#20252c|#303030|gi' "$f" + sed -i 's|#21262c|#383838|gi' "$f" # selection/hover color + sed -i 's|#238cf5|#303030|gi' "$f" + sed -i 's|#25271F|#303030|gi' "$f" + sed -i 's|#272c35|#303030|gi' "$f" + sed -i 's|#2a3039|#303030|gi' "$f" + sed -i 's|#343a46|#424242|gi' "$f" + sed -i 's|#3c4556|#424242|gi' "$f" + sed -i 's|#3d3b39|#424242|gi' "$f" + sed -i 's|#45474a|#424242|gi' "$f" + sed -i 's|#454545|#424242|gi' "$f" + sed -i 's|#2e3649|#424242|gi' "$f" + sed -i 's|#4e5054|#424242|gi' "$f" + sed -i 's|#394049|#424242|gi' "$f" + sed -i 's|#3e444c|#424242|gi' "$f" + sed -i 's|#61708b|#616161|gi' "$f" + sed -i 's|#616b7f|#616161|gi' "$f" + sed -i 's|#5c6470|#616161|gi' "$f" + sed -i 's|#545a66|#616161|gi' "$f" # pill hover bg color + sed -i 's|#737D8C|#757575|gi' "$f" + sed -i 's|#6F7882|#757575|gi' "$f" + sed -i 's|#91A1C0|#757575|gi' "$f" # icon in button color + sed -i 's|#8D99A5|#808080|gi' "$f" + sed -i 's|#8E99A4|#808080|gi' "$f" # maybe use #9e9e9e instead + sed -i 's|#8D97A5|#808080|gi' "$f" + sed -i 's|#a2a2a2|#9e9e9e|gi' "$f" + sed -i 's|#9fa9ba|#aaaaaa|gi' "$f" # maybe use #9e9e9e instead + sed -i 's|#acacac|#aaaaaa|gi' "$f" # maybe use #9e9e9e instead + sed -i 's|#B9BEC6|#b3b3b3|gi' "$f" # maybe use #bdbdbd instead + sed -i 's|#a1b2d1|#b3b3b3|gi' "$f" + sed -i 's|#A9B2BC|#b3b3b3|gi' "$f" + sed -i 's|#C1C6CD|#bdbdbd|gi' "$f" + sed -i 's|#c1c9d6|#bdbdbd|gi' "$f" + sed -i 's|#c8c8cd|#cccccc|gi' "$f" # maybe use #bdbdbd instead + # sed -i 's|#dddddd|#e0e0e0|gi' "$f" # really? + sed -i 's|#e7e7e7|#e0e0e0|gi' "$f" + sed -i 's|#e3e8f0|#e0e0e0|gi' "$f" + sed -i 's|#e9e9e9|#e0e0e0|gi' "$f" + sed -i 's|#e9edf1|#e0e0e0|gi' "$f" + sed -i 's|#e8eef5|#e0e0e0|gi' "$f" + sed -i 's|#deddfd|#e0e0e0|gi' "$f" # $location-live-secondary-color, what to use really? + sed -i 's|#edf3ff|#eeeeee|gi' "$f" + sed -i 's|#f4f6fa|#f5f5f5|gi' "$f" + sed -i 's|#f6f7f8|#f5f5f5|gi' "$f" + sed -i 's|#f2f5f8|#f5f5f5|gi' "$f" + sed -i 's|#f5f8fa|#f5f5f5|gi' "$f" + sed -i 's|#f3f8fd|#fafafa|gi' "$f" + sed -i 's|rgba(33, 38, 34,|rgba(48, 48, 48,|gi' "$f" + 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(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" + sed -i 's|rgba(242, 245, 248,|rgba(248, 248, 248,|gi' "$f" + + sed -i "s|\\(\$event-highlight-bg-color: \\).*;|\\1transparent;|gi" "$f" + sed -i "s|\\(\$preview-widget-bar-color: \\).*;|\\1#bdbdbd;|gi" "$f" + sed -i "s|\\(\$blockquote-bar-color: \\).*;|\\1#bdbdbd;|gi" "$f" + sed -i "s|\\(\$pill-bg-color: \\).*;|\\1$PILL_COLOR;|gi" "$f" + sed -i "s|\\(\$pill-hover-bg-color: \\).*;|\\1$PILL_HOVER_COLOR;|gi" "$f" + + sed -i "s|\\(\$inlinecode-border-color: \\).*;|\\1$CODEBLOCK_BORDER_COLOR;|gi" "$f" + sed -i "s|\\(\$inlinecode-background-color: \\).*;|\\1$CODEBLOCK_BACKGROUND_COLOR;|gi" "$f" + sed -i "s|\\(\$codeblock-background-color: \\).*;|\\1$CODEBLOCK_BACKGROUND_COLOR;|gi" "$f" + + sed -i "s|\\(\$presence-offline: \\).*;|\\1$PRESENCE_OFFLINE;|gi" "$f" + + # Accent colors + sed -i "s|#368bd6|$M_ACCENT|gi" "$f" + sed -i "s|#ac3ba8|$M_ACCENT|gi" "$f" + sed -i "s|#0DBD8B|$M_ACCENT|gi" "$f" + sed -i "s|#e64f7a|$M_ACCENT|gi" "$f" + sed -i "s|#ff812d|$M_ACCENT|gi" "$f" + sed -i "s|#2dc2c5|$M_ACCENT|gi" "$f" + sed -i "s|#5c56f5|$M_ACCENT|gi" "$f" + sed -i "s|#74d12c|$M_ACCENT|gi" "$f" + sed -i "s|#76CFA6|$M_ACCENT|gi" "$f" + sed -i "s|#03b381|$M_ACCENT|gi" "$f" + sed -i "s|rgba(3, 179, 129,|rgba($M_ACCENT_DEC,|gi" "$f" + sed -i "s|#03b381|$M_ACCENT|gi" "$f" + sed -i "s|#FF5B55|$M_ALERT|gi" "$f" + sed -i "s|\\(\$accent-alt: \\).*;|\\1$M_LINK;|gi" "$f" + #sed -i "s|\\(\$accent-darker: \\).*;|\\1$M_ACCENT_DARK;|gi" "$f" + sed -i "s|\\(\$roomtile-default-badge-bg-color: \\).*;|\\1$M_ACCENT;|gi" "$f" + #sed -i "s|\\(\$input-focused-border-color: \\).*;|\\1\$accent;|gi" "$f" # not existing anymore, need replacement? + sed -i "s|\\(\$reaction-row-button-selected-bg-color: \\).*;|\\1$BG_ACCENT;|gi" "$f" + + # e2e colors + sed -i "s|\\(\$e2e-verified-color: \\).*;|\\1$M_ACCENT;|gi" "$f" + sed -i "s|\\(\$e2e-unknown-color: \\).*;|\\1#ffc107;|gi" "$f" + sed -i "s|\\(\$e2e-unverified-color: \\).*;|\\1#ffc107;|gi" "$f" + sed -i "s|\\(\$e2e-warning-color: \\).*;|\\1$M_ALERT;|gi" "$f" + + # Message bubbles + sed -i "s|\\(\$eventbubble-self-bg: \\).*;|\$message-bubble-background-self: $MESSAGE_BUBBLE_BACKGROUND_SELF;|gi" "$f" + sed -i "s|\\(\$eventbubble-others-bg: \\).*;|\$message-bubble-background: $MESSAGE_BUBBLE_BACKGROUND;|gi" "$f" + sed -i "s|\\(\$eventbubble-bg-hover: \\).*;|\$message-bubble-background-selected: $MESSAGE_BUBBLE_BACKGROUND_SELECTED;|gi" "$f" + sed -i "s|\\(\$eventbubble-reply-color: \\).*;$||gi" "$f" +} + +replace_colors res/themes/dark/css/_dark.pcss +replace_colors res/themes/light/css/_light.pcss +replace_colors res/themes/legacy-light/css/_legacy-light.pcss +replace_colors res/themes/legacy-dark/css/_legacy-dark.pcss +for f in res/**/*.svg; do + replace_colors "$f" +done + +popd > /dev/null + +if [[ "$automatic_commit" == [Yy]* ]]; then + # see: https://devops.stackexchange.com/a/5443 + git add -A + git diff-index --quiet HEAD || git commit -m "Automatic theme update" +fi