one-dark/cinnamon/sass/ui/form.scss

117 lines
2.1 KiB
SCSS
Raw Permalink Normal View History

2022-05-05 19:53:15 +08:00
//
// Slider
//
.popup-slider-menu-item,
.slider {
-slider-height: 0.3em;
-slider-background-color: $button_border; //background of the trough
-slider-border-color: transparentize($bg_color, 0.7); //trough border color
-slider-active-background-color: $selected_bg_color; //active trough fill
-slider-active-border-color: transparentize($bg_color, 0.7); //active trough border
-slider-border-width: 1px;
-slider-handle-radius: 0.5em;
height: 1em;
min-width: 15em;
border: 0 solid transparent;
border-right-width: 1px;
border-left-width: 5px;
}
//
// Check Boxes
//
.check-box {
CinnamonGenericContainer {
spacing: 0.2em;
min-height: 30px;
padding-top: 2px;
}
StLabel {
font-weight: normal;
}
StBin {
width: 16px;
height: 16px;
2022-05-13 18:38:41 +08:00
background-image: url('assets/checkbox/checkbox-unchecked.svg');
2022-05-05 19:53:15 +08:00
}
&:focus StBin {
2022-05-13 18:38:41 +08:00
background-image: url('assets/checkbox/checkbox-unchecked-focused.svg');
2022-05-05 19:53:15 +08:00
}
&:checked StBin {
2022-05-13 18:38:41 +08:00
background-image: url('assets/checkbox/checkbox-checked.svg');
2022-05-05 19:53:15 +08:00
}
&:focus:checked StBin {
2022-05-13 18:38:41 +08:00
background-image: url('assets/checkbox/checkbox-checked-focused.svg');
2022-05-05 19:53:15 +08:00
}
}
//
// Radio Buttons
//
.radiobutton {
CinnamonGenericContainer {
spacing: 0.2em;
height: 26px;
padding-top: 2px;
}
StLabel {
padding-top: 4px;
font-size: 0.9em;
box-shadow: none;
}
StBin {
width: 16px;
height: 16px;
2022-05-13 18:38:41 +08:00
background-image: url('assets/checkbox/checkbox-unchecked.svg');
2022-05-05 19:53:15 +08:00
}
&:focus StBin {
2022-05-13 18:38:41 +08:00
background-image: url('assets/checkbox/checkbox-unchecked-focused.svg');
2022-05-05 19:53:15 +08:00
}
&:checked StBin {
2022-05-13 18:38:41 +08:00
background-image: url('assets/checkbox/checkbox-checked.svg');
2022-05-05 19:53:15 +08:00
}
&:focus:checked StBin {
2022-05-13 18:38:41 +08:00
background-image: url('assets/checkbox/checkbox-checked-focused.svg');
2022-05-05 19:53:15 +08:00
}
}
//
// Switches
//
.toggle-switch {
width: 50px;
height: 20px;
background-size: contain;
&-us,
&-intl {
2022-05-13 18:38:41 +08:00
background-image: url('assets/switch/switch-off.svg');
2022-05-05 19:53:15 +08:00
&:checked {
2022-05-13 18:38:41 +08:00
background-image: url('assets/switch/switch-on.svg');
2022-05-05 19:53:15 +08:00
}
}
}
//
// Links
//
.cinnamon-link {
color: $link_color;
text-decoration: underline;
&:hover {
color: lighten($link_color, 10%);
}
}