diskort/src/ui.less

113 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;
.radius(@half);
top: @half * 1.5;
margin-top: unset;
margin-left: -@half;
}
}
}
// tabs
div[role="tab"],
div.tabBarItem-30Te4- {
.top-border(16px) !important;
.bottom-border(4px) !important;
margin: 0;
margin-top: 8px;
margin-right: 16px;
padding: 4px 8px;
&:hover,
&.selected-g-kMVV {
background-color: var(--interactive-muted) !important;
color: var(--text-normal) !important;
}
div.textBadge-1fdDPJ {
margin-left: 4px;
}
}
// slider
div.bd-switch-body,
div[class^="container-"] {
&:extend(.rounder);
&[class*="disabled"] {
cursor: not-allowed;
}
& > svg[class*="slider"] {
width: 16px !important;
height: 16px !important;
.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 {
& > 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^="tabBarItem-"],
div[class^="checkbox"],
button[class*="button"],
code.inline,
{ &:extend(.round); }
// Rounder
div[class^="markup-"] pre code, // ```code```
span[class^="spoiler"],
span.mention,
[class^="item-"], // in settings
div[class^="group-"], // radiogroup
div[class*="card"],
div[class^="categoryItem-"] > *, // in Discovery
div[class^="content-"] img[class^="image-"],
{ &:extend(.rounder); }