Addons/serversize.css at master · ClearVision/Addons · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
/**
 * @name ClearVision Add-on: Server Size
 * @author ClearVision Team
 * @version 2.0.0
 * @description Server Size add-on for ClearVision v7, make sure this is added first!
 * @source https://github.com/ClearVision/Addons
 * @website https://clearvision.github.io
 * @invite 2fKpjAR
 */
/*add the contents of the root below into the root of of your theme file or copy the entire root below into the bottom of your theme

:root {
  --server-size: 48px;
}

*/
/* ### Server Size for Clearvision v7 by Nyx ### */
:root {
  --server-size: 48px;
}

:root {
  --cv-guildbar-native: 40;
}

.refresh-fast-follow-avatars:is(.density-cozy, .density-default) {
  --cv-guildbar-native: 44;
}

:root,
.refresh-fast-follow-avatars {
  --guildbar-avatar-size: var(--server-size) !important;
  --guildbar-folder-size: calc(var(--server-size) * 1.2) !important;
}

/*actual server icon*/
.wrapper_hqZPsU:has(> .shiftSVG_hqZPsU) {
  width: var(--server-size) !important;
  height: var(--server-size) !important;
}

.wrapper_hqZPsU:has(> .svg_hqZPsU:not(.shiftSVG_hqZPsU)) {
  width: var(--guildbar-folder-size) !important;
  height: var(--guildbar-folder-size) !important;
}

.refresh-fast-follow-avatars .wrapper_hqZPsU:has(> .svg_hqZPsU:not(.shiftSVG_hqZPsU)) {
  width: var(--guildbar-avatar-size) !important;
  height: var(--guildbar-avatar-size) !important;
}

.svg_hqZPsU.shiftSVG_hqZPsU {
  width: calc(var(--server-size) * (var(--cv-guildbar-native) + 8) / var(--cv-guildbar-native));
  height: calc(var(--server-size) * (var(--cv-guildbar-native) + 8) / var(--cv-guildbar-native));
  top: calc(var(--server-size) * -4 / var(--cv-guildbar-native));
  inset-inline-start: calc(var(--server-size) * -4 / var(--cv-guildbar-native));
}

.svg_hqZPsU:not(.shiftSVG_hqZPsU) {
  width: 100%;
  height: 100%;
}

.svg_hqZPsU foreignObject {
  --guildbar-avatar-size: calc(var(--cv-guildbar-native) * 1px);
  --guildbar-folder-size: calc((var(--cv-guildbar-native) + 8) * 1px);
}

/*UNREAD/SELECTED INDICATOR*/
/*wrapper*/
.wrapper__o8_Xq {
  width: calc(var(--server-size) / 5);
}

/*actual color*/
.listItem_rwEpIL .item__o8_Xq {
  width: calc(var(--server-size) / 5);
  height: calc(var(--server-size) / 5);
  margin-inline-start: calc(var(--server-size) / -10);
  /*currently selected*/
}
.listItem_rwEpIL .item__o8_Xq.hovered__o8_Xq {
  height: calc(var(--server-size) / 2);
}
.listItem_rwEpIL .item__o8_Xq.selected__o8_Xq {
  height: var(--server-size);
}

/*the folder bg height lol*/
.folderGroup_RTMSuZ.isExpanded_RTMSuZ .folderGuildsList_RTMSuZ[style*=height] {
  height: auto !important;
}

/*ping icon*/
.listItem_rwEpIL :is(.lowerBadge_hqZPsU, .upperBadge_hqZPsU) {
  /*keep it round because border-radius 8 only works when the width is 16 lol*/
}
.listItem_rwEpIL :is(.lowerBadge_hqZPsU, .upperBadge_hqZPsU) .base_lMvXrQ {
  min-width: calc(16px * var(--server-size) / var(--cv-guildbar-native));
  height: calc(16px * var(--server-size) / var(--cv-guildbar-native));
  min-height: calc(16px * var(--server-size) / var(--cv-guildbar-native));
  font-size: calc(12px * var(--server-size) / var(--cv-guildbar-native));
}
.listItem_rwEpIL :is(.lowerBadge_hqZPsU, .upperBadge_hqZPsU) .iconBadge_rwEpIL {
  width: calc(16px * var(--server-size) / var(--cv-guildbar-native));
}
.listItem_rwEpIL :is(.lowerBadge_hqZPsU, .upperBadge_hqZPsU) .baseShapeRound_lMvXrQ {
  border-radius: 100%;
}