1 2 /********************** 3 * Elementary Desktop * 4 **********************/ 5 6// Wingpanel 7.panel { 8 background-color: $panel_bg; 9 transition: all 100ms ease-in-out; 10 color: $panel_fg; 11 font-weight: bold; 12 13 &.maximized { 14 background-color: rgba(black, 1); 15 } 16 17 &.translucent { 18 background-color: $panel_bg; 19 } 20 21 menubar &, 22 & menubar { 23 box-shadow: none; 24 border: none; 25 background: none; 26 color: $panel_fg; 27 } 28 29 &-shadow { 30 background-image: none; 31 background-color: transparent; 32 } 33 34 .menu { 35 box-shadow: none; 36 37 .menuitem { 38 font-weight: normal; 39 } 40 } 41 42 .menubar > .menuitem { 43 padding: 3px 6px; 44 &:hover { background-color: transparent; } 45 } 46 47 popover { 48 padding: 2px 4px; 49 font-weight: normal; 50 border: 1px solid if($variant == 'light', rgba(black, 0.25), rgba(white, 0.12)); 51 box-shadow: 0 2px 3px rgba(black, 0.12), 0 3px 6px rgba(black, 0.08); 52 53 button { 54 font-weight: normal; 55 background-color: transparent; 56 57 &:active, &:checked { 58 label { color: white; } 59 } 60 } 61 62 .linked > button { 63 border-color: $borders_color; 64 } 65 66 list { background-color: transparent; } 67 68 separator.horizontal { 69 margin: 0 -4px; 70 } 71 72 separator.vertical { 73 background-image: image($borders_color); 74 margin: 0 2px; 75 } 76 77 .sidebar { 78 border-style: none; 79 background: none; 80 81 .view { 82 background: none; 83 border-radius: 2px; 84 @extend %row_activatable; 85 86 &:selected, 87 &:active, 88 &:checked, 89 &:active:backdrop, 90 &:checked:backdrop, 91 &:selected:backdrop { 92 color: $selected_fg_color; 93 background-color: $selected_bg_color; 94 } 95 } 96 } 97 } 98} 99 100// Popover switcher dots 101button.flat.toggle.switcher { 102 &:hover, &:active, &:checked, &:selected { 103 image { 104 color: $selected_bg_color; 105 } 106 } 107} 108 109// Calendar Popover 110.circular { // Calendar popover date button 111 label:disabled { color: $insensitive_fg_color; } 112 &.accent { // Today button 113 color: $selected_fg_color; 114 background-color: $selected_bg_color; 115 } 116} 117 118.panel-app-button > GtkWidget > GtkWidget:first-child { 119 padding: 0 2px 0 4px; 120} 121 122.panel .menu .spinner, 123.menu .spinner { opacity: 1; } // Fixes sound indicator buttons 124 125.composited-indicator { 126 background-color: transparent; 127 color: $panel_fg; 128 padding: 0 6px; 129 130 > revealer label, 131 > revealer image, 132 > revealer spinner { 133 color: $panel_fg; 134 font-weight: bold; 135 text-shadow: none; 136 transition: all 200ms ease-in-out; 137 } 138 139 .keyboard { 140 background-color: #fff; 141 border-radius: 2px; 142 box-shadow: none; 143 color: #333; 144 font-weight: 600; 145 padding: 0 3px; 146 text-shadow: none; 147 } 148 149 > GtkWidget > GtkWidget:first-child { padding: 0 2px; } 150 151 .menuitem:active, .menuitem:hover { 152 border-style: none; 153 } 154 155 > .popup > .menu { 156 padding-top: 8px; 157 padding-bottom: 8px; 158 } 159} 160 161// Birdie 162BirdieWidgetsTweetList * { 163 background-image: none; 164 background-color: transparent; 165} 166 167 168// Marlin / Pantheon Files 169MarlinViewWindow { 170 171 *:selected, *:selected:focus { 172 color: $selected_fg_color; 173 background-color: $selected_bg_color; 174 outline-color: transparent; 175 } 176 GtkIconView.view:selected { 177 &, &:focus, &:hover, &:focus:hover { background-color: transparent; } 178 } 179 FMListView, FMColumnView { outline-color: transparent; } 180} 181 182.marlin-pathbar.pathbar { 183 border-radius: 3px; 184 padding-left: 4px; 185 padding-right: 4px; 186 187 @include entry(header-normal); 188 189 &:focus { @include entry(header-focus) } 190 191 &:disabled { @include entry(header-insensitive) } 192 193 &:active, &:checked { 194 color: $selected_bg_color; 195 } 196} 197 198treeview.view { 199 &.sidebar { 200 color: $dark_sidebar_fg; 201 background-color: $dark_sidebar_bg; 202 203 &.source-list { 204 padding-top: 3px; 205 padding-bottom: 3px; 206 @extend %row_activatable; 207 208 &.trough { 209 color: $fg_color; 210 background-color: $button_border; 211 border-radius: 3px; 212 border-width: 0; 213 214 &:selected, &:selected:focus { 215 color: $selected_fg_color; 216 background-color: rgba(black, 0.2); 217 border-radius: 3px; 218 border-width: 0; 219 } 220 } 221 } 222 } 223} 224 225.dynamic-notebook { 226 notebook { 227 iconview.view.cell { 228 &:selected { background-color: if($variant == 'light', rgba(black, 0.1), rgba(white, 0.08)); } 229 } 230 } 231} 232 233headerbar.titlebar { 234 235 entry.pathbar { 236 min-height: 0; 237 } 238 239 button.flat.image-button.toggle { 240 min-height: 0; 241 padding-top: 0; 242 padding-bottom: 0; 243 margin-top: 9px; 244 margin-bottom: 10px; 245 } 246 247 > grid.linked.horizontal.format-bar { 248 background-image: image($header_bg); // Hide Code header format-bar 249 } 250} 251 252// Code 253popover { 254 radiobutton { 255 &.color-button { 256 &.color-light, &.color-dark, &.color-white { 257 border: 1px solid $borders_color; 258 } 259 } 260 } 261} 262 263// Gala 264.gala-notification { 265 border: 1px solid rgba(0, 0, 0, 0.35); 266 border-radius: 3px; 267 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); 268 background-image: _solid(white); 269 background-color: transparent; 270 271 .title, .label { 272 color: #5c616c; 273 } 274} 275 276// system setting 277actionbar.inline-toolbar { 278 border: none; 279 border-top: 1px solid $borders_color; 280 281 button { // Reset buttons 282 border-radius: 3px; 283 border: 1px solid $borders_color; 284 &:first-child { 285 border-right-style: solid; 286 } 287 &:last-child { 288 border-left-style: solid; 289 } 290 } 291} 292 293// Nightlight warmth trough 294scale.warmth trough { 295 background-image: linear-gradient(to right, $suggested_color, $destructive_color); 296 box-shadow: inset 0 0 0 1px rgba($borders_color, 0.25); 297} 298