diskort/src/ui.less

77 lines
1.4 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-"] {
.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[class^="container-"] {
&[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;
}
// Round
div[class^="tabBarItem-"],
div[class^="checkbox"],
button[class*="button"],
{ &:extend(.round); }
// Rounder
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); }