This commit is contained in:
Mirco Wittrien 2023-11-18 13:40:13 +01:00
parent 256b686bc4
commit 14a213d24e
3 changed files with 36 additions and 31 deletions

View File

@ -10,6 +10,11 @@
* @website https://mwittrien.github.io/
* @source https://github.com/mwittrien/BetterDiscordAddons/tree/master/Themes/ServerColumns/
* @updateUrl https://mwittrien.github.io/BetterDiscordAddons/Themes/ServerColumns/ServerColumns.theme.css
*
* @var range columns_s "Column Amount: [default] = 3" [3, 1, 10, 1]
* @var range guildsize_s "Server Icon Size: [default] = 50px" [50, 10, 200, 1]
* @var range guildgap_s "Server Icon Gap: [default] = 3px" [3, 0, 25, 1]
* @var checkbox aligndms_s "DMs Align: should Direct Messages also get aligned in Columns" 1
*/
@import url(https://mwittrien.github.io/BetterDiscordAddons/Themes/ServerColumns/ServerColumns.css);

View File

@ -1,14 +1,14 @@
@import url(https://mwittrien.github.io/BetterDiscordAddons/Themes/_res/ThemeDevBadge.css);
:root {
--settingsmodalwidth: 960px;
--settingsmodalheight: 80vh;
--settingsmodalbackground: transparent;
--settingswidth: 960;
--settingsheight: 80;
--settingsbackground: transparent;
--settingsmodalwidth_v: var(--settingsmodalwidth_s, var(--settingsmodalwidth));
--settingsmodalheight_v: var(--settingsmodalheight_s, var(--settingsmodalheight));
--settingsmodalbackground_v: var(--settingsmodalbackground_s, var(--settingsmodalbackground));
--settingswidth_v: calc(1px * var(--settingswidth_s, var(--settingswidth)));
--settingsheight_v: calc(1vh * var(--settingsheight_s, var(--settingsheight)));
--settingsbackground_v: var(--settingsbackground_s, var(--settingsbackground));
}
#app-mount .baseLayer__8fda3 {
@ -41,11 +41,11 @@
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
background: var(--settingsmodalbackground_v) !important;
background: var(--settingsbackground_v) !important;
border-radius: 5px !important;
box-shadow: var(--elevation-high) !important;
width: var(--settingsmodalwidth_v) !important;
height: var(--settingsmodalheight_v) !important;
width: var(--settingswidth_v) !important;
height: var(--settingsheight_v) !important;
margin: auto !important;
padding: 0 !important;
overflow: hidden !important;
@ -75,10 +75,10 @@
padding: 20px 40px !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .wrapper__61220 {
width: calc(var(--settingsmodalwidth_v) - 420px - var(--settingsiconsadditionalsize)) !important;
width: calc(var(--settingswidth_v) - 420px - var(--settingsiconsadditionalsize)) !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .repo_k8F4Sd {
max-width: calc(var(--settingsmodalwidth_v) - 226px - var(--settingsiconsadditionalsize)) !important;
max-width: calc(var(--settingswidth_v) - 226px - var(--settingsiconsadditionalsize)) !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .repoHeader_2KfNvH {
padding-bottom: 0 !important;
@ -93,10 +93,10 @@
padding-top: 0 !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .sidebar_bdf6b7 {
height: var(--settingsmodalheight_v) !important;
height: var(--settingsheight_v) !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .standardSidebarView__1129a .editor {
height: calc(var(--settingsmodalheight_v) - 120px) !important;
height: calc(var(--settingsheight_v) - 120px) !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .toolsContainer_f5d55d,
#app-mount .layer__2efaa ~ .layer__2efaa .toolsContainer_f5d55d .tools_c0ff70,
@ -129,7 +129,7 @@
}
#app-mount .layer__2efaa ~ .layer__2efaa .accountProfileCard__22589 {
max-width: calc(var(--settingsmodalwidth_v) - 332px - var(--settingsiconsadditionalsize)) !important;
max-width: calc(var(--settingswidth_v) - 332px - var(--settingsiconsadditionalsize)) !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434 {
gap: 30px !important;
@ -138,21 +138,21 @@
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434 .sectionsContainer_a37883,
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434 .editor_bca4e3,
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434 .preview__0c5fe {
min-width: calc((var(--settingsmodalwidth_v) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
max-width: calc((var(--settingsmodalwidth_v) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
min-width: calc((var(--settingswidth_v) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
max-width: calc((var(--settingswidth_v) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434.tryItOutLayout__6026d .sectionsContainer_cce45e,
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434.tryItOutLayout__6026d .sectionsContainer_a37883,
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434.tryItOutLayout__6026d .editor_bca4e3,
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434.tryItOutLayout__6026d .preview__0c5fe {
min-width: calc((var(--settingsmodalwidth_v) - 344px - var(--settingsiconsadditionalsize)) / 2) !important;
max-width: calc((var(--settingsmodalwidth_v) - 344px - var(--settingsiconsadditionalsize)) / 2) !important;
min-width: calc((var(--settingswidth_v) - 344px - var(--settingsiconsadditionalsize)) / 2) !important;
max-width: calc((var(--settingswidth_v) - 344px - var(--settingsiconsadditionalsize)) / 2) !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434 .preview__0c5fe .userPopoutOuter_d739b2 {
width: calc((var(--settingsmodalwidth_v) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
width: calc((var(--settingswidth_v) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .baseLayout_b00434.tryItOutLayout__6026d .preview__0c5fe .userPopoutOuter_d739b2 {
width: calc((var(--settingsmodalwidth_v) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
width: calc((var(--settingswidth_v) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434 .preview__0c5fe .userPopoutOuter_d739b2,
#app-mount .layer__2efaa ~ .layer__2efaa .baseLayout_b00434.tryItOutLayout__6026d .preview__0c5fe .userPopoutOuter_d739b2 {
@ -163,7 +163,7 @@
overflow: hidden !important;
}
#app-mount .layer__2efaa ~ .layer__2efaa .guildsSection__337a8 {
max-width: calc(var(--settingsmodalwidth_v) - 332px - var(--settingsiconsadditionalsize)) !important;
max-width: calc(var(--settingswidth_v) - 332px - var(--settingsiconsadditionalsize)) !important;
}
#app-mount .root__6d24f {
@ -172,11 +172,11 @@
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
background: var(--settingsmodalbackground_v) !important;
background: var(--settingsbackground_v) !important;
border-radius: 5px !important;
box-shadow: var(--elevation-high) !important;
width: var(--settingsmodalwidth_v) !important;
height: var(--settingsmodalheight_v) !important;
width: var(--settingswidth_v) !important;
height: var(--settingsheight_v) !important;
margin: auto !important;
padding: 0 !important;
overflow: hidden !important;

View File

@ -2,7 +2,7 @@
* @name SettingsModal
* @description Turns Settings Windows like User-/Channel-/Serversettings and Boost Overview into Modals
* @author DevilBro
* @version 1.0.0
* @version 1.0.1
* @authorId 278543574059057154
* @invite Jx3TjNS
* @donate https://www.paypal.me/MircoWittrien
@ -11,15 +11,15 @@
* @source https://github.com/mwittrien/BetterDiscordAddons/tree/master/Themes/SettingsModal/
* @updateUrl https://mwittrien.github.io/BetterDiscordAddons/Themes/SettingsModal/SettingsModal.theme.css
*
* @var range settingsmodalwidth_s "Settings Width: [default] = 960px" [960, 540, 1920, 20, "px"]
* @var range settingsmodalheight_s "Settings Height: [default] = 80vh" [80, 20, 100, 5, "vh"]
* @var text settingsmodalbackground_s "Settings Background: lowest BG Color of changed Windows, change it in case another Theme turns them transparent [default] = transparent" transparent
* @var range settingswidth_s "Settings Width: [default] = 960px" [960, 540, 1920, 20]
* @var range settingsheight_s "Settings Height: [default] = 80vh" [80, 20, 100, 5]
* @var text settingsbackground_s "Settings Background: lowest BG Color of changed Windows, change it in case another Theme turns them transparent [default] = transparent" transparent
*/
@import url(https://mwittrien.github.io/BetterDiscordAddons/Themes/SettingsModal/SettingsModal.css);
:root {
--settingsmodalwidth: 960px; /* default: 960px (width of the settings modal, px) */
--settingsmodalheight: 80vh; /* default: 80vh (height of the settings modal, vh) */
--settingsmodalbackground: transparent; /* default: transparent (lowest BG Color of changed Windows, change it in case another Theme turns them transparent) */
--settingswidth: 960; /* default: 960px (width of the settings modal, px) */
--settingsheight: 80; /* default: 80vh (height of the settings modal, vh) */
--settingsbackground: transparent; /* default: transparent (lowest BG Color of changed Windows, change it in case another Theme turns them transparent) */
}