115 lines
2.1 KiB
Plaintext
115 lines
2.1 KiB
Plaintext
// UI element changes
|
|
|
|
// slider
|
|
div[class^="slider-"] {
|
|
div[class^="track-"] {
|
|
div[class^="grabber-"] {
|
|
@half: (@rounder / 2);
|
|
position: relative;
|
|
width: @rounder;
|
|
height: @rounder;
|
|
border: none;
|
|
border-radius: @half;
|
|
top: @half * 1.5;
|
|
margin-top: unset;
|
|
margin-left: -@half;
|
|
}
|
|
}
|
|
}
|
|
|
|
// tabs
|
|
div[role="tab"],
|
|
div[class^="tabBarItem-"] {
|
|
.top-border(16px);
|
|
.bottom-border();
|
|
margin: 0;
|
|
margin-top: 8px;
|
|
margin-right: 16px;
|
|
padding: 4px 8px;
|
|
|
|
&:hover,
|
|
&[class*="selected-"] {
|
|
background-color: var(--interactive-muted) !important;
|
|
color: var(--text-normal) !important;
|
|
}
|
|
}
|
|
|
|
// slider
|
|
div.bd-switch-body,
|
|
div[class^="container-"] {
|
|
&:extend(.rounder);
|
|
|
|
&[class*="disabled"] {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
& > svg[class*="slider"] {
|
|
width: 16px !important;
|
|
height: 16px !important;
|
|
border-radius: 50%;
|
|
margin: 4px 8px;
|
|
margin-right: 0;
|
|
background-color: white;
|
|
|
|
& > * {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
div[class^="radioBar-"] {
|
|
border: none;
|
|
}
|
|
|
|
div[class^="card-"],
|
|
div.bd-server-card {
|
|
.bd-server-header,
|
|
& > div[class^="header-"],
|
|
& > div[class^="cardHeader"] {
|
|
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^="tabBarItem-"],
|
|
div[class^="checkbox"],
|
|
button[class*="button"],
|
|
{ &:extend(.round); }
|
|
|
|
// Rounder
|
|
div[class*="navRow-"], // in account login switcher
|
|
div[class^="markup-"] pre code, // ```code```
|
|
span[class^="spoiler"],
|
|
span.mention,
|
|
code.inline,
|
|
[class^="item-"], // in settings
|
|
div[class^="group-"], // radiogroup
|
|
div[class*="card"],
|
|
div[class^="categoryItem-"] > *, // in Discovery
|
|
div[class^="content-"] img[class^="image-"],
|
|
{ &:extend(.rounder); }
|
|
|
|
div[class*="navRow-"] {
|
|
background-color: unset !important;
|
|
}
|