BetterDiscordAddons/Themes/SettingsModal/SettingsModal.css

209 lines
8.2 KiB
CSS
Raw Normal View History

2021-06-15 21:01:37 +02:00
@import url(https://mwittrien.github.io/BetterDiscordAddons/Themes/_res/ThemeDevBadge.css);
2021-04-21 17:42:07 +02:00
:root {
2021-05-03 16:23:08 +02:00
--settingsmodalbackground: transparent;
--settingsmodalwidth: 960px;
--settingsmodalheight: 80vh;
2021-04-21 17:42:07 +02:00
}
2023-10-26 12:04:31 +02:00
#app-mount .baseLayer__8fda3 {
2021-04-21 17:42:07 +02:00
opacity: 1 !important;
transform: unset !important;
will-change: unset !important;
}
#app-mount .stop-animations * {
transition-property: inherit !important;
2021-04-21 18:06:30 +02:00
animation: inherit !important;
2021-04-21 17:42:07 +02:00
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa.stop-animations:first-child::after {
2021-04-21 17:42:07 +02:00
content: "" !important;
position: fixed !important;
background: rgb(0, 0, 0) !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
margin: 0 !important;
padding: 0 !important;
opacity: 0.85 !important;
2021-04-24 11:24:32 +02:00
z-index: 999 !important;
2021-04-21 17:42:07 +02:00
pointer-events: none !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa {
2021-04-21 17:42:07 +02:00
position: absolute !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
2021-05-03 16:23:08 +02:00
background: var(--settingsmodalbackground) !important;
2021-04-21 17:42:07 +02:00
border-radius: 5px !important;
box-shadow: var(--elevation-high) !important;
2021-05-03 16:23:08 +02:00
width: var(--settingsmodalwidth) !important;
height: var(--settingsmodalheight) !important;
2021-04-21 17:42:07 +02:00
margin: auto !important;
padding: 0 !important;
overflow: hidden !important;
contain: unset !important;
2021-04-24 11:24:32 +02:00
z-index: 1000 !important;
2023-04-09 12:39:39 +02:00
--settingsiconsadditionalsize: var(--use-settingsicons, 0) * (var(--settingsicons-size, 0px) + var(--settingsicons-gap, 0px));
2021-04-21 17:42:07 +02:00
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa > div,
#app-mount .layer__2efaa ~ .layer__2efaa .standardSidebarView__1129a {
2021-04-24 11:24:32 +02:00
position: static !important;
border-radius: unset !important;
width: 100% !important;
height: 100% !important;
margin: unset !important;
padding: unset !important;
2021-04-21 17:42:07 +02:00
overflow: hidden !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .sidebarRegion__60457,
#app-mount .layer__2efaa ~ .layer__2efaa .sidebarRegionScroller__1fa7e {
2023-04-04 11:59:10 +02:00
flex: 0 0 auto !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .sidebar__9e3e2 {
2021-08-02 20:05:50 +02:00
width: 218px !important;
padding: 20px 6px 20px 20px !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .contentColumnDefault_c66386 {
2021-08-02 20:05:50 +02:00
padding: 20px 40px !important;
2021-04-21 17:42:07 +02:00
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .wrapper__61220 {
2023-10-25 16:17:04 +02:00
width: calc(var(--settingsmodalwidth) - 420px - var(--settingsiconsadditionalsize)) !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .repo_k8F4Sd {
2023-04-09 12:39:39 +02:00
max-width: calc(var(--settingsmodalwidth) - 226px - var(--settingsiconsadditionalsize)) !important;
2023-04-09 12:31:19 +02:00
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .repoHeader_2KfNvH {
2022-10-11 14:37:37 +02:00
padding-bottom: 0 !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .repoHeader_2KfNvH .tabBar__35f81 {
2023-04-04 11:25:08 +02:00
gap: 30px !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .repoHeader_2KfNvH .quickSelectLabel_cf5c1b {
2023-04-04 11:25:08 +02:00
font-size: 12px !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .repoScroller_9JnAPs {
2022-10-11 14:37:37 +02:00
padding-top: 0 !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .sidebar_bdf6b7 {
2021-05-18 12:26:03 +02:00
height: var(--settingsmodalheight) !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .standardSidebarView__1129a .editor {
2021-05-03 16:23:08 +02:00
height: calc(var(--settingsmodalheight) - 120px) !important;
2021-04-21 20:57:46 +02:00
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .toolsContainer_f5d55d,
#app-mount .layer__2efaa ~ .layer__2efaa .toolsContainer_f5d55d .tools_c0ff70,
#app-mount .layer__2efaa ~ .layer__2efaa .toolsContainer_f5d55d .container_bb0c52,
#app-mount .layer__2efaa ~ .layer__2efaa .toolsContainer_f5d55d .closeButton__34341 {
2021-04-21 17:42:07 +02:00
position: absolute !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
background: transparent !important;
border: none !important;
border-radius: 0 !important;
width: 100% !important;
max-width: unset !important;
height: 100% !important;
max-height: unset !important;
margin: 0 !important;
padding: 0 !important;
opacity: 0 !important;
cursor: default !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .toolsContainer_f5d55d {
2021-04-21 17:42:07 +02:00
position: fixed !important;
top: 22px !important;
z-index: -1 !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .settingsToolbar_wu4yfQ {
2021-04-30 12:25:42 +02:00
display: none !important;
2021-04-21 17:42:07 +02:00
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .accountProfileCard__22589 {
2023-04-09 12:43:18 +02:00
max-width: calc(var(--settingsmodalwidth) - 332px - var(--settingsiconsadditionalsize)) !important;
2023-04-04 11:49:03 +02:00
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434 {
2023-04-04 11:49:03 +02:00
gap: 30px !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434 .sectionsContainer_cce45e,
#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 {
2023-04-09 12:43:18 +02:00
min-width: calc((var(--settingsmodalwidth) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
max-width: calc((var(--settingsmodalwidth) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
2023-04-04 11:49:03 +02:00
}
2023-10-26 12:04:31 +02:00
#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 {
2023-04-09 12:43:18 +02:00
min-width: calc((var(--settingsmodalwidth) - 344px - var(--settingsiconsadditionalsize)) / 2) !important;
max-width: calc((var(--settingsmodalwidth) - 344px - var(--settingsiconsadditionalsize)) / 2) !important;
2023-04-04 11:49:03 +02:00
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434 .preview__0c5fe .userPopoutOuter_d739b2 {
2023-04-09 12:43:18 +02:00
width: calc((var(--settingsmodalwidth) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
2023-04-04 11:59:10 +02:00
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .baseLayout_b00434.tryItOutLayout__6026d .preview__0c5fe .userPopoutOuter_d739b2 {
2023-04-09 12:43:18 +02:00
width: calc((var(--settingsmodalwidth) - 332px - var(--settingsiconsadditionalsize)) / 2) !important;
2023-04-04 11:59:10 +02:00
}
2023-10-26 12:04:31 +02:00
#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 {
2023-04-04 11:59:10 +02:00
min-width: unset !important;
max-width: 340px !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .profileCustomizationSection__88eff .baseLayout_b00434 .preview__0c5fe .userPopoutInner_f545a3 {
2023-04-04 11:49:03 +02:00
overflow: hidden !important;
}
2023-10-26 12:04:31 +02:00
#app-mount .layer__2efaa ~ .layer__2efaa .guildsSection__337a8 {
2023-04-09 12:43:18 +02:00
max-width: calc(var(--settingsmodalwidth) - 332px - var(--settingsiconsadditionalsize)) !important;
2023-04-04 12:04:45 +02:00
}
2023-04-04 11:49:03 +02:00
2023-10-25 16:17:04 +02:00
#app-mount .root__6d24f {
2021-04-21 17:42:07 +02:00
position: fixed !important;
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
2021-05-03 16:23:08 +02:00
background: var(--settingsmodalbackground) !important;
2021-04-21 17:42:07 +02:00
border-radius: 5px !important;
box-shadow: var(--elevation-high) !important;
2021-05-03 16:23:08 +02:00
width: var(--settingsmodalwidth) !important;
height: var(--settingsmodalheight) !important;
2021-04-21 17:42:07 +02:00
margin: auto !important;
padding: 0 !important;
overflow: hidden !important;
contain: unset !important;
2021-04-24 11:24:32 +02:00
z-index: 1000 !important;
2021-04-21 18:59:06 +02:00
}
2023-10-25 16:17:04 +02:00
#app-mount .root__6d24f.enterDone_a21e0b {
2021-04-21 17:42:07 +02:00
transform: unset !important;
}
2023-10-25 16:17:04 +02:00
#app-mount .root__6d24f .closeIconWrapper_e5c34c,
#app-mount .root__6d24f .closeIconWrapper_e5c34c .container_bb0c52,
#app-mount .root__6d24f .closeIconWrapper_e5c34c .closeButton__34341,
#app-mount .shop_b31ed2 .container_bb0c52,
#app-mount .shop_b31ed2 .closeButton__34341 {
2023-10-07 10:51:46 +02:00
position: fixed !important;
2021-04-21 17:42:07 +02:00
top: 0 !important;
right: 0 !important;
bottom: 0 !important;
left: 0 !important;
2023-10-07 10:51:46 +02:00
z-index: -1 !important;
2021-04-21 17:42:07 +02:00
background: transparent !important;
border: none !important;
border-radius: 0 !important;
width: 100% !important;
max-width: unset !important;
height: 100% !important;
max-height: unset !important;
margin: 0 !important;
padding: 0 !important;
opacity: 0 !important;
cursor: default !important;
}
2023-10-25 16:17:04 +02:00
#app-mount .root__6d24f .closeIconWrapper_e5c34c {
2021-04-21 17:42:07 +02:00
top: 22px !important;
2022-01-11 15:06:27 +01:00
}