Started using classes instead of *= selectors.

Switching to new status picker.

Center avatar near status picker.

Fix media embed width.

Fix warning icon in profile.
This commit is contained in:
Er2 2022-08-07 10:47:08 +03:00
parent 9e11c79c46
commit 53ae934dd7
5 changed files with 49 additions and 34 deletions

View File

@ -16,7 +16,7 @@
--input-background: #1e1e1e; --input-background: #1e1e1e;
color: var(--header-primary); color: var(--header-primary);
& [class*="close-"] { & .close-1mLglB {
color: var(--interactive-normal); color: var(--interactive-normal);
&:hover &:hover
@ -24,24 +24,22 @@
} }
} }
div[class^="layer-"] div.theme-light, div.layer-1Ixpg3 div.theme-light,
div[class^="downloadApps-"] { div.downloadApps-14IgKV {
&:extend(.theme-dimmer all); &:extend(.theme-dimmer all);
div[class*="root-"] { div.root-g14mjS {
background-color: var(--background-secondary); background-color: var(--background-secondary);
} }
div[class*="footer-"] { div.footer-31IekZ {
background-color: var(--background-primary); background-color: var(--background-primary);
} }
} }
div[class^="downloadApps"] { div.downloadApps-14IgKV {
& { background-color: var(--background-secondary) !important;
background-color: var(--background-secondary) !important; h3, div.footer-2TRYcZ {
}
h3, div[class*="footer-"] {
color: var(--header-primary); color: var(--header-primary);
} }
} }

View File

@ -1,5 +1,5 @@
// fix guild selector at left part // fix guild selector at left part
ul[data-list-id="guildsnav"] div[class^="scroller-"] { ul[data-list-id="guildsnav"] div.scroller-3X7KbA {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
overflow: hidden !important; overflow: hidden !important;
@ -30,7 +30,7 @@ ul[data-list-id="guildsnav"] div[class^="scroller-"] {
margin-bottom: 8px; margin-bottom: 8px;
} }
div[class^="messagesWrapper-"] div { div.messagesWrapper-RpOMA3 > div {
scrollbar-width: thin; scrollbar-width: thin;
} }
@ -42,18 +42,18 @@ div[class^="messagesWrapper-"] div {
top: 0; bottom: 0; top: 0; bottom: 0;
left: 0; right: 0; left: 0; right: 0;
} }
div[class^="wrapper-"] { div.wrapper-22rqw6 {
top: 0; top: 0;
border-radius: 8px; border-radius: 8px;
} }
} }
div[class*="fullscreenOnMobile"] div[class^="flex"] * { div.fullscreenOnMobile-ixj0e3 div.flex-3BkGQD * {
// fix overflow // fix overflow
overflow: hidden; overflow: hidden;
} }
div[class*="templatesList-"] { div.templatesList-uohY49 {
// fix tempates list (it was removed) // fix tempates list (it was removed)
height: 128px; height: 128px;
} }
@ -80,3 +80,14 @@ div[class^="contentContainer-"] div[class*="stickyHeader-"] {
padding-right: 0; padding-right: 0;
margin: 0; margin: 0;
} }
// media embed fixes
div.inlineMediaEmbed-1m3ApS {
width: max-content;
}
// in profile
.warningCircleIcon-mFju_m {
position: fixed;
}

View File

@ -22,6 +22,7 @@ div[class^="characterCount-"] div[class^="root-"], // at many characters
[class^="clickableSticker-"], // stickers [class^="clickableSticker-"], // stickers
nav[class^="privateChannels-"] div div // Nitro tab at DM nav[class^="privateChannels-"] div div // Nitro tab at DM
[data-list-item-id$="nitro"], [data-list-item-id$="nitro"],
#account-style-your-profile,
{ &:extend(.nitro); } { &:extend(.nitro); }
#channels > ul { #channels > ul {

View File

@ -92,8 +92,10 @@ div[class^="banner"] {
} }
} }
div[class^="avatarWrapper-"] { div.container-YkUktl div.avatarWrapper-1B9FTW {
margin-right: auto; // make some space after avatar (sidebar at bottom) margin-right: auto; // make some space after avatar (sidebar at bottom)
min-width: unset;
padding: unset;
} }
// Redesigned profile page // Redesigned profile page
@ -157,3 +159,12 @@ div.root-8LYsGj { // I not love fixed classes, but this selects only modal page
.left-border(@round); .left-border(@round);
} }
} }
#account-info div.headerTop-3GPUSF {
padding-top: 108px;
}
#account-avatar div.avatarWrapperNormal-ahVUaC {
left: 35%;
}

View File

@ -193,33 +193,27 @@ div.popoutContainer-2wbmiM,
} }
// status picker // status picker
#status-picker > div { #account-status-picker + div.layer-2aCOJ3 div.scroller-1bVxF5 {
display: flex; display: flex;
flex-flow: row wrap; flex-flow: row wrap;
justify-content: space-around; justify-content: space-around;
#status-picker-online,
#status-picker-idle, & > div.item-1OdjEX {
#status-picker-dnd,
#status-picker-invisible {
padding: 8px; padding: 8px;
margin: 0;
& > div { & > div {
padding: 0; padding: 0;
// & > because svg has status- div & > div.status-2xYiEF,
& > div[class^="status-"], & > div.description-1Dd2kv,
& > div[class^="description-"] { { &:extend(.hide); }
display: none;
}
}
svg {
width: 16px;
height: 16px;
margin-left: 4px;
} }
} }
#status-picker-custom-status, svg {
div[class^="submenuContainer-"] { width: 16px;
width: 100%; height: 16px;
margin-left: 4px;
} }
} }