2022-07-24 13:29:50 -04:00
|
|
|
.quick-settings {
|
|
|
|
padding: 4 * $base_padding;
|
|
|
|
}
|
|
|
|
|
|
|
|
.quick-settings-grid {
|
|
|
|
spacing-rows: 3 * $base_padding;
|
|
|
|
spacing-columns: 2 * $base_padding;
|
|
|
|
}
|
2022-07-24 13:29:50 -04:00
|
|
|
|
|
|
|
.quick-toggle {
|
|
|
|
border-radius: 99px;
|
|
|
|
min-width: 11.5em;
|
|
|
|
max-width: 11.5em;
|
2022-08-04 10:34:12 -04:00
|
|
|
min-height: 44px;
|
2022-07-24 13:29:50 -04:00
|
|
|
|
|
|
|
&:checked { @include button(default); }
|
|
|
|
|
|
|
|
& > StBoxLayout { spacing: $base_padding; }
|
|
|
|
|
2022-07-29 12:33:54 -04:00
|
|
|
/* Move padding into the box; this is to allow menu arrows
|
|
|
|
to extend to the border */
|
|
|
|
&.button { padding: 0; }
|
|
|
|
& > StBoxLayout { padding: 0 2 * $base_padding; }
|
|
|
|
|
2022-07-24 13:29:50 -04:00
|
|
|
.quick-toggle-label { font-weight: bold; }
|
2022-07-29 12:33:54 -04:00
|
|
|
.quick-toggle-icon, .quick-toggle-arrow { icon-size: $base_icon_size; }
|
|
|
|
}
|
|
|
|
|
|
|
|
.quick-menu-toggle {
|
|
|
|
&:ltr > StBoxLayout { padding-right: 0; }
|
|
|
|
&:rtl > StBoxLayout { padding-left: 0; }
|
|
|
|
|
|
|
|
& .quick-toggle-arrow {
|
|
|
|
background-color: transparentize($fg_color, 0.9);
|
|
|
|
padding: 8px;
|
|
|
|
|
|
|
|
&:ltr { border-radius: 0 99px 99px 0; }
|
|
|
|
&:rtl { border-radius: 99px 0 0 99px; }
|
|
|
|
}
|
2022-07-24 13:29:50 -04:00
|
|
|
}
|
2022-07-29 09:22:37 -04:00
|
|
|
|
2022-07-29 18:23:30 -04:00
|
|
|
.quick-slider {
|
2022-08-04 10:34:12 -04:00
|
|
|
padding: 0 $base_padding;
|
|
|
|
|
|
|
|
& > StBoxLayout { spacing: $base_padding; }
|
2022-07-29 18:23:30 -04:00
|
|
|
|
|
|
|
.slider-bin {
|
|
|
|
&:focus {@include button(focus);}
|
|
|
|
min-height: 16px; // slider size
|
|
|
|
padding: $base_padding;
|
|
|
|
border-radius: 99px;
|
|
|
|
}
|
|
|
|
.quick-toggle-icon { icon-size: $base_icon_size; }
|
|
|
|
.icon-button { background-color: transparent; }
|
|
|
|
}
|
|
|
|
|
2022-07-29 09:22:37 -04:00
|
|
|
.quick-toggle-menu {
|
2022-08-04 10:34:12 -04:00
|
|
|
background-color: $card_bg_color;
|
|
|
|
border-radius: $base_border_radius*2.75;
|
|
|
|
padding: $base_padding*2.75;
|
|
|
|
margin: 0 $base_padding*2.75;
|
2022-07-29 17:41:33 -04:00
|
|
|
|
|
|
|
& .header {
|
|
|
|
spacing-rows: 0.5 * $base_padding;
|
2022-08-04 10:34:12 -04:00
|
|
|
spacing-columns: $base_padding*2;
|
2022-07-29 17:41:33 -04:00
|
|
|
padding-bottom: 2 * $base_padding;
|
|
|
|
|
|
|
|
& .icon {
|
2022-08-04 10:34:12 -04:00
|
|
|
icon-size: $base_icon_size*1.5; // a non-standard symbolic size but ok
|
2022-07-29 17:41:33 -04:00
|
|
|
border-radius: 999px;
|
|
|
|
padding: 1.5 * $base_padding;
|
|
|
|
background-color: lighten($bg_color, 10%);
|
2022-07-29 18:06:49 -04:00
|
|
|
|
|
|
|
&.active { background-color: $selected_bg_color; }
|
2022-07-29 17:41:33 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
& .title {
|
|
|
|
@extend %title_3;
|
|
|
|
}
|
|
|
|
|
|
|
|
& .subtitle {
|
|
|
|
@extend %caption_heading;
|
|
|
|
}
|
|
|
|
}
|
2022-07-29 09:22:37 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
.quick-toggle-menu-container {
|
|
|
|
padding: 2 * $base_padding $base_padding 0;
|
|
|
|
}
|
2022-07-29 20:17:15 -04:00
|
|
|
|
|
|
|
.quick-settings-system-item {
|
|
|
|
& > StBoxLayout { spacing: 2 * $base_padding; }
|
2022-07-29 21:32:05 -04:00
|
|
|
|
|
|
|
& .power-item {
|
|
|
|
min-height: 0;
|
|
|
|
min-width: 0;
|
|
|
|
|
|
|
|
&:insensitive {
|
|
|
|
@include button(normal);
|
|
|
|
background-color: transparent;
|
|
|
|
}
|
|
|
|
}
|
2022-07-29 20:17:15 -04:00
|
|
|
}
|