57 lines
1.2 KiB
SCSS
57 lines
1.2 KiB
SCSS
|
/*****************
|
||
|
|
* Progress bars *
|
||
|
|
*****************/
|
||
|
|
progressbar {
|
||
|
|
// sizing
|
||
|
|
&.horizontal {
|
||
|
|
trough,
|
||
|
|
progress { min-height: 6px; }
|
||
|
|
}
|
||
|
|
|
||
|
|
&.vertical {
|
||
|
|
trough,
|
||
|
|
progress { min-width: 6px; }
|
||
|
|
}
|
||
|
|
|
||
|
|
&.horizontal progress { margin: 0; } // the progress node is positioned after the trough border
|
||
|
|
&.vertical progress { margin: 0; } // this moves it over it.
|
||
|
|
|
||
|
|
|
||
|
|
// FIXME: insensitive state missing and some other state should be set probably
|
||
|
|
font-size: smaller;
|
||
|
|
color: transparentize($fg_color, 0.6);
|
||
|
|
|
||
|
|
&:backdrop {
|
||
|
|
box-shadow: none;
|
||
|
|
transition: $backdrop_transition;
|
||
|
|
}
|
||
|
|
|
||
|
|
trough { @extend %scale_trough; }
|
||
|
|
|
||
|
|
&:backdrop trough { @extend %scale_trough:backdrop; } // looks like states are not passed to the trough component here
|
||
|
|
|
||
|
|
progress {
|
||
|
|
@extend %scale_highlight;
|
||
|
|
}
|
||
|
|
|
||
|
|
&:backdrop progress { @extend %scale_highlight:backdrop; } // states not passed here as well
|
||
|
|
|
||
|
|
&.osd { // progressbar.osd used for epiphany page loading progress
|
||
|
|
min-width: 3px;
|
||
|
|
min-height: 3px;
|
||
|
|
background-color: transparent;
|
||
|
|
|
||
|
|
trough {
|
||
|
|
border-style: none;
|
||
|
|
border-radius: 0;
|
||
|
|
background-color: transparent;
|
||
|
|
box-shadow: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
progress {
|
||
|
|
border-style: none;
|
||
|
|
border-radius: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|