Warning, /plasma/breeze-gtk/src/gtk4/widgets/_scale.scss is written in an unsupported language. File is not indexed.

0001 @charset "UTF-8";
0002 
0003 /************
0004  * GtkScale *
0005  ************/
0006 scale {
0007         padding: 12px;
0008 
0009         &.fine-tune {
0010                 &.trough {
0011                         margin: 8px;
0012                         border-radius: $r;
0013                 }
0014         }
0015 
0016         slider {
0017                 min-width: 16px;
0018                 min-height: 16px;
0019                 border: 1px solid gtkmix(gtk("@theme_bg_color"),gtk("@theme_button_foreground_normal"), 0.4);
0020                 border-radius: 50%;
0021                 box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.125);
0022 
0023                 background: gtk("@theme_button_background_normal");
0024                 margin: -9px;
0025 
0026                 &:hover {
0027                         border-color: gtk("@theme_button_decoration_hover");
0028                         border-radius: 50%; // needed for double marks scales
0029 
0030                         &:backdrop {
0031                                 border-color: gtk(
0032                                         "@theme_button_decoration_hover_insensitive"
0033                                 );
0034                         }
0035                 }
0036 
0037                 &:disabled {
0038                         border-style: solid; // needed for double marks scales or they'll get
0039                         border-radius: 50%; // overridden
0040                         background-color: gtk("@theme_button_background_insensitive");
0041                         opacity: 1;
0042                         border-color: gtk("@insensitive_borders");
0043                         &:backdrop {
0044                                 background-color: gtkalpha(
0045                                         gtk(
0046                                                 "@theme_button_background_backdrop_insensitive"
0047                                         ),
0048                                         100
0049                                 );
0050                                 border-color: gtk("@unfocused_insensitive_borders");
0051                         }
0052                 }
0053                 &:active {
0054                         box-shadow: none;
0055                         background-color: gtk("@theme_button_background_normal");
0056                         &:backdrop {
0057                                 background-color: gtk(
0058                                         "@theme_button_background_normal"
0059                                 );
0060                                 border-color: gtk(
0061                                         "@theme_button_decoration_focus_backdrop"
0062                                 );
0063                         }
0064                 }
0065                 &:backdrop {
0066                         background-color: gtk(
0067                                 "@theme_button_background_backdrop"
0068                         );
0069                         border-color: gtk("@unfocused_borders");
0070                 }
0071         }
0072 
0073         &:focus-within slider {
0074                 border-color: gtk("@theme_button_decoration_focus");
0075                 border-radius: 50%; // needed for double marks scales
0076 
0077                 &:backdrop {
0078                         border-color: gtk(
0079                                 "@theme_button_decoration_focus_insensitive"
0080                         );
0081                 }
0082         }
0083 
0084         trough {
0085                 min-width: 4px;
0086                 min-height: 4px;
0087                 border: 1px solid;
0088                 border-radius: $r;
0089 
0090                 background: gtkoverlay(
0091                         gtk("@theme_bg_color"),
0092                         gtkalpha(gtk("@theme_button_foreground_normal"), 0.5*0.2)
0093                 );
0094 
0095                 border-color: gtkalpha(
0096                         gtk("@theme_button_foreground_normal"),
0097                         0.2
0098                 );
0099 
0100                 &:disabled, &.vertical:disabled {
0101                         background: gtkoverlayalpha(
0102                                 gtk("@theme_bg_color"),
0103                                 gtkalpha(gtk("@theme_button_foreground_normal"), 0.5*0.2),
0104                                 0.5
0105                         );
0106                         border-color: gtkalpha(
0107                                 gtk("@theme_button_foreground_normal"),
0108                                 0.2 * 0.5
0109                         );
0110                 }
0111         }
0112 
0113         highlight {
0114                 margin: -1px;
0115                 border-radius: $r;
0116                 background: gtkoverlay(
0117                         gtk("@theme_bg_color"),
0118                         gtkalpha(gtk("@theme_button_decoration_hover"), 0.5)
0119                 );
0120 
0121                 border: 1px solid gtk("@theme_button_decoration_hover");
0122 
0123                 &:disabled {
0124                         background: none;
0125                         border-color: transparent;
0126                 }
0127 
0128                 &:backdrop {
0129                         background: gtkoverlay(
0130                                 gtk("@theme_bg_color"),
0131                                 gtkalpha(gtk("@theme_unfocused_selected_bg_color"), 0.5)
0132                         );
0133 
0134                         border-color: gtk(
0135                                 "@theme_unfocused_selected_bg_color"
0136                         );
0137 
0138                         &:disabled {
0139                                 background: none;
0140                                 border-color: transparent;
0141                         }
0142                 }
0143         }
0144 
0145         $_marks_length: 8px;
0146         $_marks_distance: 1px;
0147 
0148 
0149         > label {
0150                 color: gtk("@theme_button_foreground_normal")
0151         }
0152 
0153         &.horizontal {
0154                 > marks {
0155                 color: gtkalpha(
0156                         gtk("@theme_button_foreground_normal"),
0157                         0.2
0158                 );
0159                 &.top    { margin-bottom: $_marks_distance; }
0160                 &.bottom { margin-top: $_marks_distance; }
0161 
0162                 indicator {
0163                         background-color: gtkalpha(
0164                                 gtk("@theme_button_foreground_normal"),
0165                                 0.2
0166                         );
0167                         min-height: $_marks_length;
0168                         min-width: 1px;
0169                 }
0170                 }
0171 
0172                 > value.left  { margin-right: 9px; }
0173                 > value.right { margin-left: 9px; }
0174 
0175                 &.fine-tune >marks {
0176                 &.top { margin-top: 3px; }
0177                 &.bottom { margin-bottom: 3px; }
0178 
0179                 indicator { min-height: ($_marks_length - 3px); }
0180                 }
0181         }
0182 
0183         &.vertical {
0184                 > marks {
0185                 color: gtkalpha(
0186                         gtk("@theme_button_foreground_normal"),
0187                         0.2
0188                 );
0189                 &.top    { margin-right: $_marks_distance; }
0190                 &.bottom { margin-left: $_marks_distance; }
0191 
0192                 indicator {
0193                         background-color: gtkalpha(
0194                                 gtk("@theme_button_foreground_normal"),
0195                                 0.2
0196                         );
0197                         min-height: 1px;
0198                         min-width: $_marks_length;
0199                 }
0200                 }
0201 
0202                 > value.top    { margin-bottom: 9px; }
0203                 > value.bottom { margin-top: 9px; }
0204 
0205                 &.fine-tune >marks {
0206                 &.top { margin-left: 3px; }
0207                 &.bottom { margin-right: 3px; }
0208 
0209                 indicator { min-height: ($_marks_length - 3px); }
0210                 }
0211         }
0212 
0213 }