_progress.scss (4571B)
1 /***************** 2 ! Progress bars * 3 ******************/ 4 5 @include exports("progressbar") { 6 GtkProgressBar { 7 padding: 0; 8 border-radius: $roundness; 9 font-size: smaller; 10 color: alpha($fg_color, .6); 11 12 -GtkProgressBar-min-horizontal-bar-height: 6; 13 -GtkProgressBar-min-vertical-bar-width: 6; 14 15 &.osd { 16 -GtkProgressBar-xspacing: 0; 17 -GtkProgressBar-yspacing: 0; 18 -GtkProgressBar-min-horizontal-bar-height: 3; 19 } 20 21 &.trough { 22 border: 1px solid alpha(border_normal($bg_color), .5); 23 background-color: shade($bg_color, 1.08); 24 background-image: none; 25 } 26 } 27 28 .progressbar { 29 @include linear-gradient($selected_bg_color); 30 31 border-radius: 0; 32 box-shadow: none; 33 34 &.left { 35 border-top-left-radius: $roundness; 36 border-bottom-left-radius: $roundness; 37 } 38 39 &.right { 40 border-top-right-radius: $roundness; 41 border-bottom-right-radius: $roundness; 42 } 43 44 &.left.right { box-shadow: none; } 45 46 &.vertical { 47 @include linear-gradient($selected_bg_color, to right); 48 49 &.bottom { 50 border-bottom-left-radius: $roundness; 51 border-bottom-right-radius: $roundness; 52 } 53 54 &.top { 55 border-top-left-radius: $roundness; 56 border-top-right-radius: $roundness; 57 } 58 } 59 } 60 61 GtkLevelBar { 62 -GtkLevelBar-min-block-width: 34; 63 -GtkLevelBar-min-block-height: 3; 64 65 &.vertical { 66 -GtkLevelBar-min-block-width: 3; 67 -GtkLevelBar-min-block-height: 34; 68 } 69 } 70 71 .level-bar { 72 &.trough { 73 @include linear-gradient(shade($bg_color, 1.08), to top); 74 75 border: 1px solid alpha(border_normal($bg_color), .5); 76 border-radius: $roundness; 77 } 78 79 &.fill-block { 80 @include linear-gradient($selected_bg_color); 81 82 // FIXME: it would be nice to set make fill blocks bigger, but we'd need 83 // :nth-child working on discrete indicators 84 border-color: transparent; 85 border-radius: 0; 86 87 &.indicator-discrete { 88 &.horizontal { margin-right: 1px; } 89 90 &.vertical { margin-bottom: 1px; } 91 } 92 93 &.level-high { 94 background-color: $success_color; 95 border-color: transparent; 96 } 97 98 &.level-low { 99 background-color: $warning_color; 100 border-color: transparent; 101 } 102 103 &.empty-fill-block { 104 background-color: transparent; 105 border-color: transparent; 106 box-shadow: none; 107 } 108 } 109 } 110 111 .scale { 112 -GtkRange-slider-width: 16; 113 -GtkRange-trough-border: 1; 114 -GtkScale-slider-length: 16; 115 116 padding: 0; 117 border-width: 1px; 118 border-radius: $roundness; 119 outline-offset: -1px; 120 121 122 &.slider { 123 @include linear-gradient(shade($bg_color, 1.08)); 124 @include border($bg_color); 125 126 border-radius: 8px; 127 border-width: 1px; 128 border-style: solid; 129 box-shadow: 0 1px 2px -1px alpha($dark_shadow, .3); 130 131 &:insensitive { @include linear-gradient(shade($bg_color, .9)); } 132 } 133 134 &.fine-tune { 135 &, &.horizontal { 136 &:active, &:active:hover { 137 background-size: 50%; 138 background-repeat: no-repeat; 139 background-position: center; 140 } 141 } 142 } 143 144 &.mark { border-color: alpha(border_normal($bg_color), .5); } 145 146 147 &.trough { 148 @include linear-gradient(shade($bg_color, 1.08)); 149 150 margin: 7px 0; 151 border: 1px solid alpha(border_normal($bg_color), .5); 152 border-radius: $roundness; 153 154 &:insensitive { @include linear-gradient(shade($bg_color, .9)); } 155 156 &.vertical { margin: 0 7px; } 157 } 158 159 &.highlight { 160 &, &.left, &.bottom { 161 @include linear-gradient($selected_bg_color); 162 163 border-color: $selected_bg_color; 164 165 &:insensitive { 166 @include linear-gradient(shade($bg_color, .8)); 167 168 border-color: shade($bg_color, .7); 169 } 170 } 171 } 172 } 173 }