Skip to content

Commit 4651797

Browse files
GibbuGibbu
committed
Sort of fixed serverlist?
1 parent a59f2fa commit 4651797

9 files changed

Lines changed: 62 additions & 88 deletions

File tree

‎bd-scss.config.js‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,5 @@ export default {
99
invite: 'ZHthyCw'
1010
},
1111
github: 'DiscordStyles',
12-
addons: [
13-
{ target: 'src/addons/_radialglow.scss', name: 'RadialGlow' },
14-
{ target: 'src/addons/_serverrings.scss', name: 'ServerRings', dist: true, dev: true }
15-
]
12+
addons: [{ target: 'src/addons/_radialglow.scss', name: 'RadialGlow' }]
1613
};

‎src/addons/_serverrings.scss‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
}
1111

1212
#app-mount {
13-
.wrapper__48112 {
13+
.folderGroup__48112 {
1414
--server-folder-offset: 6px;
1515

1616
ul.stack_dbd263[role='group'] {
@@ -31,13 +31,14 @@
3131
width: 100%;
3232
margin-bottom: var(--server-spacing);
3333
[class*='pill'] {
34+
--__ring-size: calc(
35+
((var(--server-icon-size, 45) * 1px) - 5px) + var(--server-folder-offset, 0px) + var(--server-ring-offset)
36+
);
3437
left: 50%;
3538
top: 50%;
3639
transform: translate(-50%, -50%);
37-
width: calc((var(--server-icon-size, 40px) * 1px) + var(--server-folder-offset, 0px) + var(--server-ring-offset));
38-
height: calc(
39-
(var(--server-icon-size, 40px) * 1px) + var(--server-folder-offset, 0px) + var(--server-ring-offset)
40-
);
40+
width: var(--__ring-size);
41+
height: var(--__ring-size);
4142
overflow: visible;
4243
margin-left: -2px;
4344
.item__58105 {

‎src/main.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
@use './addons/radialglow';
2+
@use './addons/serverrings';
23

34
@use './theme/vars';
45

‎src/root.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
--members-width: 280px; /* Width of the members list. | Default: 280px */
1717
--guilds-width: 95px; /* Width of the server list. | Default: 105px */
1818

19-
--server-icon-size: 45; /* Size of the servers inside the server list. | Default: 45px */
19+
--server-icon-size: 46; /* Size of the servers inside the server list. | Default: 46px */
2020
--chat-avatar-size: 40px; /* Size of the chat avatars. | Default: 32px */
2121

2222
--opacity: 0.85; /* Opacity of overall app. | Default: .85 */

‎src/theme/_vars.scss‎

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,8 @@
4141

4242
--chat-bottom-spacing: 16px;
4343

44+
--server-size: calc(var(--server-icon-size) * 1px);
45+
4446
// Discord variables
4547
--custom-guild-list-width: var(--guilds-width);
4648
--custom-member-list-width: var(--members-width);
@@ -51,15 +53,5 @@
5153
--font-display: var(--font, 'Whitney');
5254
--background-mentioned: var(--accent);
5355
--background-message-hover: hsl(0 0% 100% / 0.02) !important;
54-
55-
// Yoinked straight from @refact0r
56-
--guildbar-avatar-size: calc(var(--server-icon-size) * 1px);
57-
--guildbar-folder-size: var(--g-48);
58-
--g-48: calc(var(--guildbar-avatar-size) + 8px);
59-
--g-19-r: calc((var(--server-icon-size) / 2 - 1) / var(--server-icon-size) * 40px);
60-
--g-40-r: calc(var(--guildbar-avatar-size) / (var(--server-icon-size) + 8) * 48);
61-
--g-48-r: calc(var(--guildbar-avatar-size) * 48 / 40);
62-
--g-56-r: calc(var(--g-48) * 56 / 48);
63-
--g-4-r: calc((var(--g-48-r) - var(--guildbar-avatar-size)) / -2);
64-
--g-4-r-2: calc((var(--g-56-r) - var(--g-48)) / -2);
56+
--guildbar-folder-size: var(--server-size);
6557
}

‎src/theme/chat/_message.scss‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,16 @@
2020
}
2121
}
2222

23+
.wrapper_f61d60 {
24+
background: hsl(from var(--accent) h s l / 0.15);
25+
color: var(--accent);
26+
27+
&.interactive:hover {
28+
background: hsl(from var(--accent) h s l);
29+
color: var(--accent-text);
30+
}
31+
}
32+
2333
.embedWrapper_b7e1cb {
2434
background: var(--fg-primary);
2535
}

‎src/theme/serverlist/_folder.scss‎

Lines changed: 25 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,29 @@
11
#app-mount {
2-
.expandedFolderBackground__48112 {
3-
background: var(--fg-primary);
2+
.folderGroupBackground__48112 {
43
left: 50%;
5-
translate: -50% 0;
6-
}
7-
8-
.folderIcon__48112 > .wrapper_cc5dd2 {
9-
width: var(--g-48) !important;
10-
height: var(--g-48) !important;
11-
}
12-
.folderIcon__48112 > .wrapper_cc5dd2 > .svg_cc5dd2 {
13-
width: var(--g-56-r);
14-
height: var(--g-56-r);
15-
top: var(--g-4-r-2);
16-
left: var(--g-4-r-2);
17-
}
18-
.folder__48112,
19-
.folderIconWrapper__48112 {
20-
width: 48px;
21-
height: 48px;
22-
}
23-
.expandedFolderIconWrapper__48112 {
24-
width: var(--g-40-r);
25-
height: var(--g-40-r);
26-
margin: 0;
27-
}
28-
.closedFolderIconWrapper__48112 {
29-
width: var(--g-40-r);
30-
height: var(--g-40-r);
4+
translate: -50%;
5+
width: var(--server-size);
316
}
7+
// .folderIconWrapper__48112 {
8+
// height: var(--server-size);
9+
// width: var(--server-size);
10+
// }
11+
// .folderPreview__48112 {
12+
// height: calc(var(--server-size) / 1.5);
13+
// width: calc(var(--server-size) / 1.5);
14+
// display: grid;
15+
// grid-template-columns: 1fr 1fr;
16+
// grid-template-rows: 1fr 1fr;
17+
// margin: auto;
18+
// }
19+
// .folderPreviewGuildIcon__48112 {
20+
// width: 100%;
21+
// height: auto;
22+
// }
23+
// .folderPreviewWrapper__48112 {
24+
// padding: 0;
25+
// display: flex;
26+
// height: var(--server-size);
27+
// width: var(--server-size);
28+
// }
3229
}

‎src/theme/serverlist/_server.scss‎

Lines changed: 14 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,16 @@
11
#app-mount {
2-
.childWrapperNoHoverBg__6e9f8 {
3-
background: var(--fg-primary);
4-
}
5-
6-
.svg_cc5dd2 {
7-
width: var(--g-48-r);
8-
height: var(--g-48-r);
9-
top: var(--g-4-r);
10-
left: var(--g-4-r);
11-
}
12-
.wrapper__6e9f8,
13-
.icon__6e9f8,
14-
.childWrapper__6e9f8 {
15-
width: 40px;
16-
height: 40px;
17-
}
18-
19-
.guildIcon__48112 {
20-
width: var(--g-19-r);
21-
height: var(--g-19-r);
22-
}
23-
.stack_dbd263 {
24-
height: auto !important;
25-
padding-bottom: 4px !important;
26-
}
27-
.tutorialContainer__1f388 .svg_cc5dd2 > mask > use:last-child {
28-
display: none;
29-
}
30-
.tutorialContainer__1f388 .numberBadge__2b1f5 {
31-
outline: 2px solid var(--bg-base-tertiary);
32-
border-radius: 50%;
33-
}
34-
.circleIconButton__5bc7e {
35-
background: var(--fg-primary);
36-
translate: -50% -50%;
37-
top: 50%;
38-
left: 50%;
39-
position: absolute;
40-
}
2+
// .blobContainer_e5445c {
3+
// height: var(--server-size);
4+
// width: var(--server-size);
5+
// }
6+
// .wrapper_cc5dd2 {
7+
// width: var(--server-size) !important;
8+
// height: var(--server-size) !important;
9+
// }
10+
// .svg_cc5dd2 {
11+
// top: 0;
12+
// left: 0;
13+
// height: var(--server-size);
14+
// width: var(--server-size);
15+
// }
4116
}

‎src/theme/sidebar/_channel.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@
2323
left: 0;
2424
height: 100%;
2525
width: var(--channel-pill-width);
26+
top: 0;
2627
background: var(--accent);
2728
box-shadow: 0 0 calc(var(--channel-glow-intensity) * 15px) calc(var(--channel-glow-intensity) * 5px)
2829
hsl(from var(--accent) h s l / 0.2);

0 commit comments

Comments
 (0)