From e63e6e09ffc81d2eb04997d5ea2eac7fede3dc44 Mon Sep 17 00:00:00 2001
From: CI <ci@c7.pm>
Date: Tue, 30 May 2023 03:13:14 +0000
Subject: [PATCH] Make Modular

---
 modular/compacter_mode.css                    | 14 +++
 modular/overwrite_colors.css                  |  4 +-
 modular/square_avatars/off.css                | 91 +++++++++++++++++++
 .../on.css}                                   |  0
 4 files changed, 107 insertions(+), 2 deletions(-)
 create mode 100644 modular/square_avatars/off.css
 rename modular/{square_avatars.css => square_avatars/on.css} (100%)

diff --git a/modular/compacter_mode.css b/modular/compacter_mode.css
index 0ccc76a..3aa5ad7 100644
--- a/modular/compacter_mode.css
+++ b/modular/compacter_mode.css
@@ -652,6 +652,20 @@ div[class^="sidebar-"]:not(:has(> [class^="side-"]))
   > [class^="avatar-"] {
   margin-right: 8px;
 }
+[class^="sidebar-"]
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class^="channel-"]
+  [class*="layout-"]
+  > [class^="avatar-"]
+  > [class^="wrapper-"]
+  > [class^="avatarDecoration-"] {
+  top: calc((0.4 - var(--decoration-to-avatar-ratio) / 2) * 32px);
+  left: calc((0.475 - var(--decoration-to-avatar-ratio) / 2) * 32px);
+  width: calc(32px * var(--decoration-to-avatar-ratio));
+  height: calc(32px * var(--decoration-to-avatar-ratio));
+}
+
 [class^="sidebar-"]
   > [class^="privateChannels-"]
   ul[class^="content-"]
diff --git a/modular/overwrite_colors.css b/modular/overwrite_colors.css
index 8250f0c..5d37364 100644
--- a/modular/overwrite_colors.css
+++ b/modular/overwrite_colors.css
@@ -291,10 +291,10 @@ rect[fill="hsl(262, calc(var(--saturation-factor, 1) * 46.8%), 39.8%)"] {
   fill: var(--status-streaming);
 }
 
-[class^="containerDefault-"]:not(:hover)
+[class^="containerDefault-"]:not(:hover):not([class*="selected-"])
   [class*="modeUnread-"]
   svg[class^="icon-"],
-[class^="containerDefault-"]:not(:hover)
+[class^="containerDefault-"]:not(:hover):not([class*="selected-"])
   [class*="modeUnread-"]
   [class^="name-"] {
   color: var(--accent, var(--brand-new-500));
diff --git a/modular/square_avatars/off.css b/modular/square_avatars/off.css
new file mode 100644
index 0000000..04d287f
--- /dev/null
+++ b/modular/square_avatars/off.css
@@ -0,0 +1,91 @@
+[class*="avatar-"],
+[class*="avatar-"] [class*="image-"],
+[class*="callAvatar-"],
+[class*="callAvatar-"] [class*="speaking-"],
+[class*="avatarDefault-"],
+[class*="avatarSpeaking-"],
+[class*="avatar-"] [class*="inner-"],
+[class*="callAvatarVoice-"],
+[class*="callAvatarWrapper-"] [class*="speaking-"],
+[class^="messagesWrapper-"]
+  [class^="scrollerInner-"]
+  [class^="message-"]
+  [class*="header-"]
+  [class*="avatar-"]
+  [class*="large-"],
+[class^="messagesWrapper-"]
+  [class^="scrollerInner-"]
+  [class^="message-"]
+  [class*="header-"]
+  [class*="avatar-"]
+  [class*="wrapper-"],
+[class^="messagesWrapper-"]
+  [class^="scrollerInner-"]
+  [class^="message-"]
+  [class*="contents-"]
+  [class*="avatar-"],
+[class^="messagesWrapper-"]
+  [class^="scrollerInner-"]
+  [class^="wrapper-"]
+  [class*="contents-"]
+  [class*="avatar-"],
+[class^="messageGroupCozy-"] [class*="contents-"] [class*="avatar-"],
+[class*="autocomplete-"]
+  [class*="autocompleteInner-"]
+  [class*="autocompleteRow-"]
+  [class*="content-"]
+  [class*="wrapper-"],
+[class*="guildsWrapper-"]
+  [class*="guilds-"]
+  [class*="guild-"]
+  [class*="guildInner-"],
+div[class^="listItem-"] foreignObject img,
+div[class^="listItem-"] foreignObject a[class^="button-"],
+div[class^="listItem-"] foreignObject [class^="childWrapper-"],
+div[class^="listItem-"] foreignObject [class^="folder-"],
+div[class^="listItem-"] div[class^="wrapperSimple-"],
+[class^="circleIconButton-"],
+[class^="avatarContainer-"],
+[class^="executedCommandAvatar-"] {
+  border-radius: 50% !important;
+}
+
+div[class^="listItem-"] foreignObject img,
+div[class^="listItem-"] foreignObject [class*="selected-"] > img {
+  transition: border-radius 0.35s ease;
+}
+
+div[class^="listItem-"] foreignObject [class*="selected-"] > img {
+  border-radius: 25% !important;
+}
+
+[class^="folderIconWrapper-"]
+  > [class^="closedFolderIconWrapper-"]
+  > [class^="icon-"] {
+  border-radius: 50% !important;
+}
+
+[class*="avatarMasked-"],
+[class*="maskProfile-"],
+[class*="mask-"],
+[class*="avatar-"] svg[class*="mask-"] > foreignObject,
+[class*="avatarWrapper-"] svg[class*="mask-"] > foreignObject,
+[class*="avatarHint-"] > foreignObject,
+[class*="wrapper-"] svg[class*="mask-"] > foreignObject,
+[class*="callAvatarWrapper-"] svg[class*="callAvatarMask-"] > foreignObject,
+div[class^="listItem-"] [class^="wrapper-"] > svg > foreignObject,
+[class^="bannerSVGWrapper-"] > foreignObject,
+[class^="avatarDecoration-"] > foreignObject {
+  mask: none !important;
+  mask-image: none !important;
+  -webkit-mask-image: none !important;
+}
+
+[class*="avatarHint-"],
+[class*="avatarNormal-"],
+[class*="avatarWrapper-"] [class*="wrapper-"],
+[class*="avatarWrapper-"] [class*="image-"],
+[class*="replyAvatar-"] {
+  border: none;
+  border-radius: 10% !important;
+}
diff --git a/modular/square_avatars.css b/modular/square_avatars/on.css
similarity index 100%
rename from modular/square_avatars.css
rename to modular/square_avatars/on.css