diff --git a/src/bd.less b/src/bd.less new file mode 100644 index 0000000..8a9ca0b --- /dev/null +++ b/src/bd.less @@ -0,0 +1,34 @@ +// BetterDiscord specific things + +div[class^="bd-"] +{ &:extend(.round); } + +div.bd-search-wrapper, +div.bd-changelog-button { + align-self: center; + margin: 0; + margin-right: 8px; +} + +div[class^="standardSidebarView-"] { + // PluginRepo and ThemeRepo + div[class^="repoList-"] > div { + div[class^="repoHeader-"] { + & > * { + max-width: unset; + } + } + + & > div:last-child { + height: 100vh; + } + #pluginrepo-tab, + #themerepo-tab { + max-width: unset; + } + } +} + +div.bd-addon-list:not(.bd-grid-view) { + .horiz-tab(); +} diff --git a/src/profile.less b/src/profile.less index d62e746..08df48d 100644 --- a/src/profile.less +++ b/src/profile.less @@ -94,7 +94,7 @@ header div[class^="nameTagNoCustomStatus-"] { margin-left: 160px; // after avatar, not before } -div[class^="focusLock-"]:not([aria-labelledby]) > div[class^="root-"][class*="small-"] { +div.root-8LYsGj { // I not love fixed classes, but this selects only modal page flex-direction: row; header { diff --git a/src/style.less b/src/style.less index 223cf93..731fa54 100644 --- a/src/style.less +++ b/src/style.less @@ -18,7 +18,7 @@ div[class^="repliedMessage-"] { left: 0; right: 100%; top: 0; bottom: 0; } - & > img { + & > :first-child { margin-left: 16px; } } @@ -30,7 +30,7 @@ div[class^="role-"] { border-style: solid; } -[class*="embed"] { +article[class^="embed"] { .left-border(3px); max-width: unset; background: unset; @@ -215,18 +215,23 @@ div[class*="stickyHeader-"], } // new invite with splash style -div[id^="message-accessories-"] > div[class^="wrapper-"] { - position: relative; - div[class^="inviteSplash-"] { - position: absolute; +div[id^="message-accessories-"] { + & > div[class^="messageAttachment-"] { width: 100%; - height: 100%; - z-index: 0; - filter: brightness(50%); + } + & > div[class^="wrapper-"] { + position: relative; + div[class^="inviteSplash-"] { + position: absolute; + width: 100%; + height: 100%; + z-index: 0; + filter: brightness(50%); - & ~ * { - position: relative; - z-index: 1; + & ~ * { + position: relative; + z-index: 1; + } } } } diff --git a/src/ui.less b/src/ui.less index c471f3f..d811525 100644 --- a/src/ui.less +++ b/src/ui.less @@ -61,8 +61,35 @@ div[class^="radioBar-"] { border: none; } +div[class^="card-"], +div.bd-server-card { + & > div[class*="header"], + & > div[class*="Header"] { + position: absolute; + top: 0; left: 0; + width: 100%; height: 100%; + + div[class^="coverWrapper"], + div[class^="splash"] { + filter: brightness(0.5); + } + .bd-server-icon, + & > div[class*="icon"], + & > div[class*="Icon"] { + position: relative; + width: 42px; + height: 42px; + overflow: hidden; + padding: 5px; + } + } + & > div[class*="info"], + & > div[class*="Info"] { + margin-top: 84px; + } +} + // Round -div[class^="bd-"], div[class^="tabBarItem-"], div[class^="checkbox"], button[class*="button"], @@ -79,11 +106,3 @@ div[class*="card"], div[class^="categoryItem-"] > *, // in Discovery div[class^="content-"] img[class^="image-"], { &:extend(.rounder); } - -// BetterDiscord -div.bd-search-wrapper, -div.bd-changelog-button { - align-self: center; - margin: 0; - margin-right: 8px; -}