gtk.css
ASCII text, with very long lines (532)
1@keyframes ripple_effect { 2from { 3background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 0%, transparent 0%), image(alpha(currentColor, 0)); } 4to { 5background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 100%, transparent 0%), image(alpha(currentColor, 0.15)); } } 6@keyframes flat_ripple_effect { 7from { 8background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 0%, transparent 0%), image(alpha(currentColor, 0.15)); } 9to { 10background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 100%, transparent 0%), image(alpha(currentColor, 0.15)); } } 11@keyframes row_ripple_effect { 12from { 13background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 0%, transparent 0%), image(alpha(currentColor, 0.05)); } 14to { 15background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 100%, transparent 0%), image(alpha(currentColor, 0.15)); } } 16@keyframes tab_ripple_effect { 17from { 18background-image: radial-gradient(circle farthest-corner at center, rgba(66, 165, 245, 0.6) 0%, transparent 0%); } 1950% { 20background-image: radial-gradient(circle farthest-corner at center, rgba(66, 165, 245, 0.6) 100%, transparent 0%); } 21to { 22background-image: radial-gradient(circle farthest-corner at center, transparent 100%, transparent 0%); } } 23@keyframes header_ripple_effect { 24from { 25background-image: radial-gradient(circle farthest-corner at center, #42A5F5 0%, transparent 0%); } 26to { 27background-image: radial-gradient(circle farthest-corner at center, #42A5F5 100%, transparent 0%); } } 28* { 29padding: 0; 30background-clip: padding-box; 31-GtkToolButton-icon-spacing: 4; 32-GtkTextView-error-underline-color: #DD2C00; 33-GtkScrolledWindow-scrollbar-spacing: 0; 34-GtkToolItemGroup-expander-size: 11; 35-GtkTreeView-expander-size: 11; 36-GtkTreeView-horizontal-separator: 4; 37-GtkWidget-text-handle-width: 24; 38-GtkWidget-text-handle-height: 24; 39-GtkDialog-button-spacing: 4; 40-GtkDialog-action-area-border: 0; 41outline-style: solid; 42outline-width: 2px; 43outline-color: alpha(currentColor, 0.3); 44outline-offset: -4px; 45-gtk-outline-radius: 2px; 46-gtk-secondary-caret-color: #42A5F5; } 47 48/*************** 49* Base States * 50***************/ 51.background { 52background-color: #F5F5F5; 53color: rgba(0, 0, 0, 0.8); } 54 55/* 56These wildcard seems unavoidable, need to investigate. 57Wildcards are bad and troublesome, use them with care, 58or better, just don't. 59Everytime a wildcard is used a kitten dies, painfully. 60*/ 61*:disabled { 62-gtk-icon-effect: dim; } 63 64.gtkstyle-fallback { 65background-color: #F5F5F5; 66color: rgba(0, 0, 0, 0.8); } 67.gtkstyle-fallback:hover { 68background-color: #e8e8e8; 69color: rgba(0, 0, 0, 0.8); } 70.gtkstyle-fallback:active { 71background-color: gainsboro; 72color: rgba(0, 0, 0, 0.8); } 73.gtkstyle-fallback:disabled { 74background-color: #F5F5F5; 75color: rgba(0, 0, 0, 0.32); } 76.gtkstyle-fallback:selected { 77background-color: #42A5F5; 78color: #FFFFFF; } 79 80.view, iconview { 81background-color: #FFFFFF; 82color: rgba(0, 0, 0, 0.8); } 83.view:hover, iconview:hover, .view:active, iconview:active, .view:selected, iconview:selected { 84border-radius: 2px; } 85.view:disabled, iconview:disabled { 86color: rgba(0, 0, 0, 0.32); } 87 88.view text, iconview text, 89textview text { 90background-color: #FFFFFF; 91color: rgba(0, 0, 0, 0.8); } 92.view text:disabled, iconview text:disabled, 93textview text:disabled { 94color: rgba(0, 0, 0, 0.32); } 95 96textview border { 97background-color: #fafafa; 98background-image: image(rgba(0, 0, 0, 0.1)); 99background-repeat: no-repeat; 100color: rgba(0, 0, 0, 0.48); } 101textview border.bottom { 102background-size: 100% 1px; 103background-position: top; } 104textview border.top { 105background-size: 100% 1px; 106background-position: bottom; } 107textview border.left { 108background-size: 1px 100%; 109background-position: right; } 110textview border.right { 111background-size: 1px 100%; 112background-position: left; } 113 114.rubberband, 115rubberband, 116flowbox rubberband, 117treeview.view rubberband, 118.content-view rubberband { 119border: 1px solid #40C4FF; 120background-color: rgba(64, 196, 255, 0.3); } 121 122flowbox flowboxchild { 123outline-offset: -2px; 124padding: 4px; 125border-radius: 2px; } 126 127label.separator { 128color: rgba(0, 0, 0, 0.8); } 129label selection { 130background-color: #42A5F5; 131color: #FFFFFF; } 132label:disabled { 133color: rgba(0, 0, 0, 0.32); } 134 135.dim-label, label.separator, .titlebar:not(headerbar) .subtitle, 136headerbar .subtitle { 137opacity: 0.6; } 138 139assistant .sidebar { 140padding: 4px 0; } 141assistant .sidebar label { 142min-height: 36px; 143padding: 0 12px; 144color: rgba(0, 0, 0, 0.48); 145font-weight: 500; } 146assistant .sidebar label.highlight { 147color: rgba(0, 0, 0, 0.8); } 148 149popover.background.touch-selection, popover.background.magnifier, popover.background.osd, .csd popover.background.touch-selection, .csd popover.background.magnifier, .csd popover.background.osd, .app-notification, 150.app-notification.frame, .osd .scale-popup, .floating-bar, .osd { 151opacity: 0.9; } 152 153/********************* 154* Spinner Animation * 155*********************/ 156@keyframes spin { 157to { 158-gtk-icon-transform: rotate(1turn); } } 159@keyframes spin_colors { 1601% { 161color: #66BB6A; } 16225% { 163color: #66BB6A; } 16426% { 165color: #42A5F5; } 16650% { 167color: #42A5F5; } 16851% { 169color: #FFA726; } 17075% { 171color: #FFA726; } 17276% { 173color: #EF5350; } 174100% { 175color: #EF5350; } } 176spinner { 177background: none; 178opacity: 0; 179-gtk-icon-source: -gtk-icontheme("process-working-symbolic"); } 180spinner:checked { 181opacity: 1; 182animation: spin 1s linear infinite, spin_colors 4s linear infinite; } 183spinner:checked:disabled { 184opacity: 0.4; } 185 186/**************** 187* Text Entries * 188****************/ 189spinbutton:not(.vertical), notebook > stack:not(:only-child) revealer entry, 190notebook > stack:not(:only-child) revealer spinbutton:not(.vertical), 191entry { 192min-height: 36px; 193padding: 0 8px; 194border-radius: 2px; 195transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 196border-image: none; 197box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 198background-color: #FFFFFF; 199color: rgba(0, 0, 0, 0.8); } 200spinbutton:focus:not(.vertical), notebook > stack:not(:only-child) revealer entry:focus, 201notebook > stack:not(:only-child) revealer spinbutton:focus:not(.vertical), 202entry:focus { 203border-image: none; 204box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); } 205spinbutton:disabled:not(.vertical), notebook > stack:not(:only-child) revealer entry:disabled, 206notebook > stack:not(:only-child) revealer spinbutton:disabled:not(.vertical), 207entry:disabled { 208box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 209background-color: #fafafa; 210color: rgba(0, 0, 0, 0.32); } 211spinbutton.flat:not(.vertical), notebook > stack:not(:only-child) entry, 212notebook > stack:not(:only-child) spinbutton:not(.vertical), notebook > stack:not(:only-child) revealer entry.flat, 213notebook > stack:not(:only-child) revealer spinbutton.flat:not(.vertical), colorchooser .popover.osd spinbutton:not(.vertical), 214entry.flat { 215border-radius: 0; 216transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; 217border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 0%, transparent 0%) 0 0 0/0 0 0px; 218box-shadow: inset 0 -1px alpha(currentColor, 0.3); 219background-color: transparent; 220color: rgba(0, 0, 0, 0.8); } 221spinbutton.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry:focus, 222notebook > stack:not(:only-child) spinbutton:focus:not(.vertical), colorchooser .popover.osd spinbutton:focus:not(.vertical), 223entry.flat:focus { 224border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #42A5F5 100%, transparent 0%) 0 0 2/0 0 2px; 225box-shadow: inset 0 -1px alpha(currentColor, 0.3); } 226spinbutton.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry:disabled, 227notebook > stack:not(:only-child) spinbutton:disabled:not(.vertical), colorchooser .popover.osd spinbutton:disabled:not(.vertical), 228entry.flat:disabled { 229box-shadow: inset 0 -1px alpha(currentColor, 0.3); 230background-color: transparent; 231color: rgba(0, 0, 0, 0.32); } 232spinbutton:not(.vertical) image, notebook > stack:not(:only-child) revealer entry image, 233notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image, 234entry image { 235color: alpha(currentColor, 0.75); } 236spinbutton:not(.vertical) image:hover, notebook > stack:not(:only-child) revealer entry image:hover, 237notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image:hover, spinbutton:not(.vertical) image:active, notebook > stack:not(:only-child) revealer entry image:active, 238notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image:active, 239entry image:hover, 240entry image:active { 241color: currentColor; } 242spinbutton:not(.vertical) image:disabled, notebook > stack:not(:only-child) revealer entry image:disabled, 243notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image:disabled, 244entry image:disabled { 245color: alpha(currentColor, 0.6); } 246spinbutton:not(.vertical) image.left, notebook > stack:not(:only-child) revealer entry image.left, 247notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image.left, 248entry image.left { 249padding-left: 2px; 250padding-right: 6px; } 251spinbutton:not(.vertical) image.right, notebook > stack:not(:only-child) revealer entry image.right, 252notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) image.right, 253entry image.right { 254padding-left: 6px; 255padding-right: 2px; } 256spinbutton:not(.vertical) undershoot.left, notebook > stack:not(:only-child) revealer entry undershoot.left, 257notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) undershoot.left, 258entry undershoot.left { 259background-color: transparent; 260background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%); 261padding-left: 1px; 262background-size: 1px 12px; 263background-repeat: repeat-y; 264background-origin: content-box; 265background-position: left top; } 266spinbutton:not(.vertical) undershoot.right, notebook > stack:not(:only-child) revealer entry undershoot.right, 267notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) undershoot.right, 268entry undershoot.right { 269background-color: transparent; 270background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%); 271padding-right: 1px; 272background-size: 1px 12px; 273background-repeat: repeat-y; 274background-origin: content-box; 275background-position: right top; } 276spinbutton.error:not(.vertical), notebook > stack:not(:only-child) revealer entry.error, 277notebook > stack:not(:only-child) revealer spinbutton.error:not(.vertical), 278entry.error { 279transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 280border-image: none; 281box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 282background-color: #DD2C00; 283color: #FFFFFF; } 284spinbutton.error:focus:not(.vertical), notebook > stack:not(:only-child) revealer entry.error:focus, 285entry.error:focus { 286border-image: none; 287box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); } 288spinbutton.error:disabled:not(.vertical), notebook > stack:not(:only-child) revealer entry.error:disabled, 289entry.error:disabled { 290box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 291background-color: #fafafa; 292color: rgba(0, 0, 0, 0.32); } 293spinbutton.error.flat:not(.vertical), notebook > stack:not(:only-child) entry.error, 294notebook > stack:not(:only-child) spinbutton.error:not(.vertical), colorchooser .popover.osd spinbutton.error:not(.vertical), 295entry.error.flat { 296transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; 297border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 0%, transparent 0%) 0 0 0/0 0 0px; 298box-shadow: inset 0 -1px #DD2C00; 299background-color: transparent; 300color: rgba(0, 0, 0, 0.8); } 301spinbutton.error.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.error:focus, 302notebook > stack:not(:only-child) spinbutton.error:focus:not(.vertical), colorchooser .popover.osd spinbutton.error:focus:not(.vertical), 303entry.error.flat:focus { 304border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #DD2C00 100%, transparent 0%) 0 0 2/0 0 2px; 305box-shadow: inset 0 -1px #DD2C00; } 306spinbutton.error.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.error:disabled, 307notebook > stack:not(:only-child) spinbutton.error:disabled:not(.vertical), colorchooser .popover.osd spinbutton.error:disabled:not(.vertical), 308entry.error.flat:disabled { 309box-shadow: inset 0 -1px alpha(currentColor, 0.3); 310background-color: transparent; 311color: rgba(0, 0, 0, 0.32); } 312spinbutton.warning:not(.vertical), notebook > stack:not(:only-child) revealer entry.warning, 313notebook > stack:not(:only-child) revealer spinbutton.warning:not(.vertical), 314entry.warning { 315transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 316border-image: none; 317box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 318background-color: #FF6D00; 319color: #FFFFFF; } 320spinbutton.warning:focus:not(.vertical), notebook > stack:not(:only-child) revealer entry.warning:focus, 321entry.warning:focus { 322border-image: none; 323box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); } 324spinbutton.warning:disabled:not(.vertical), notebook > stack:not(:only-child) revealer entry.warning:disabled, 325entry.warning:disabled { 326box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 327background-color: #fafafa; 328color: rgba(0, 0, 0, 0.32); } 329spinbutton.warning.flat:not(.vertical), notebook > stack:not(:only-child) entry.warning, 330notebook > stack:not(:only-child) spinbutton.warning:not(.vertical), colorchooser .popover.osd spinbutton.warning:not(.vertical), 331entry.warning.flat { 332transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; 333border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 0%, transparent 0%) 0 0 0/0 0 0px; 334box-shadow: inset 0 -1px #FF6D00; 335background-color: transparent; 336color: rgba(0, 0, 0, 0.8); } 337spinbutton.warning.flat:focus:not(.vertical), notebook > stack:not(:only-child) entry.warning:focus, 338notebook > stack:not(:only-child) spinbutton.warning:focus:not(.vertical), colorchooser .popover.osd spinbutton.warning:focus:not(.vertical), 339entry.warning.flat:focus { 340border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FF6D00 100%, transparent 0%) 0 0 2/0 0 2px; 341box-shadow: inset 0 -1px #FF6D00; } 342spinbutton.warning.flat:disabled:not(.vertical), notebook > stack:not(:only-child) entry.warning:disabled, 343notebook > stack:not(:only-child) spinbutton.warning:disabled:not(.vertical), colorchooser .popover.osd spinbutton.warning:disabled:not(.vertical), 344entry.warning.flat:disabled { 345box-shadow: inset 0 -1px alpha(currentColor, 0.3); 346background-color: transparent; 347color: rgba(0, 0, 0, 0.32); } 348spinbutton:not(.vertical) progress, notebook > stack:not(:only-child) revealer entry progress, 349notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) progress, 350entry progress { 351margin: 2px -6px; 352border-style: none none solid; 353border-width: 2px; 354border-color: #42A5F5; 355background-color: transparent; } 356 357treeview acceleditor > label { 358background-color: #42A5F5; } 359 360treeview entry.flat, treeview entry { 361min-height: 0; 362padding: 2px; 363border-radius: 0; 364background-color: #FFFFFF; } 365treeview entry.flat, treeview entry.flat:focus, treeview entry, treeview entry:focus { 366border-image: none; 367box-shadow: none; } 368 369/*********** 370* Buttons * 371***********/ 372@keyframes needs_attention { 373from { 374background-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent)); } 375to { 376background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#FF4081), to(transparent)); } } 377button { 378min-height: 24px; 379min-width: 16px; 380padding: 6px 10px; 381border-radius: 2px; 382font-weight: 500; 383transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 384box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 385background-color: #FAFAFA; 386background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0)); 387color: rgba(0, 0, 0, 0.6); } 388button:hover { 389box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); 390background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0)); 391color: rgba(0, 0, 0, 0.8); } 392button:active { 393transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1), background-image 0; 394animation: ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards; 395box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); 396color: rgba(0, 0, 0, 0.8); } 397button:disabled { 398box-shadow: none; 399background-color: alpha(currentColor, 0.3); 400color: rgba(0, 0, 0, 0.24); } 401button:disabled > label { 402color: inherit; } 403button:checked { 404background-color: #42A5F5; 405color: #FFFFFF; } 406button:checked:disabled { 407background-color: alpha(currentColor, 0.3); 408color: rgba(66, 165, 245, 0.4); } 409button:checked:disabled > label { 410color: inherit; } 411.inline-toolbar 412button, modelbutton.flat, 413.menuitem.button.flat, spinbutton:not(.vertical) button, spinbutton.vertical button, toolbar.osd button, .app-notification button, 414.app-notification.frame button, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action), 415headerbar button:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow, scrollbar button, check, 416radio, calendar.button, messagedialog.csd .dialog-action-area button, button.sidebar-button, 417button.flat { 418transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; 419box-shadow: none; 420background-color: transparent; 421background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0)); 422color: rgba(0, 0, 0, 0.6); } 423.inline-toolbar 424button:hover, modelbutton.flat:hover, 425.menuitem.button.flat:hover, spinbutton:not(.vertical) button:hover, spinbutton.vertical button:hover, toolbar.osd button:hover, .app-notification button:hover, .titlebar:not(headerbar) button:hover:not(.suggested-action):not(.destructive-action), 426headerbar button:hover:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow:hover, scrollbar button:hover, check:hover, 427radio:hover, calendar.button:hover, messagedialog.csd .dialog-action-area button:hover, button.sidebar-button:hover, 428button.flat:hover { 429box-shadow: none; 430background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0.15)); 431color: rgba(0, 0, 0, 0.8); } 432.inline-toolbar 433button:active, modelbutton.flat:active, 434.menuitem.button.flat:active, spinbutton:not(.vertical) button:active, spinbutton.vertical button:active, toolbar.osd button:active, .app-notification button:active, .titlebar:not(headerbar) button:active:not(.suggested-action):not(.destructive-action), 435headerbar button:active:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow:active, scrollbar button:active, check:active, 436radio:active, calendar.button:active, messagedialog.csd .dialog-action-area button:active, button.sidebar-button:active, 437button.flat:active { 438transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, background-image 0; 439animation: flat_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards; 440box-shadow: none; 441color: rgba(0, 0, 0, 0.8); } 442.inline-toolbar 443button:disabled, modelbutton.flat:disabled, 444.menuitem.button.flat:disabled, spinbutton:not(.vertical) button:disabled, spinbutton.vertical button:disabled, toolbar.osd button:disabled, .app-notification button:disabled, .titlebar:not(headerbar) button:disabled:not(.suggested-action):not(.destructive-action), 445headerbar button:disabled:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow:disabled, scrollbar button:disabled, check:disabled, 446radio:disabled, calendar.button:disabled, messagedialog.csd .dialog-action-area button:disabled, button.sidebar-button:disabled, 447button.flat:disabled { 448box-shadow: none; 449background-color: transparent; 450color: rgba(0, 0, 0, 0.24); } 451.inline-toolbar 452button:disabled > label, modelbutton.flat:disabled > label, 453.menuitem.button.flat:disabled > label, spinbutton:not(.vertical) button:disabled > label, spinbutton.vertical button:disabled > label, toolbar.osd button:disabled > label, .app-notification button:disabled > label, .titlebar:not(headerbar) button:disabled:not(.suggested-action):not(.destructive-action) > label, 454headerbar button:disabled:not(.suggested-action):not(.destructive-action) > label, notebook > header > tabs > arrow:disabled > label, scrollbar button:disabled > label, check:disabled > label, 455radio:disabled > label, calendar.button:disabled > label, messagedialog.csd .dialog-action-area button:disabled > label, button.sidebar-button:disabled > label, 456button.flat:disabled > label { 457color: inherit; } 458.inline-toolbar 459button:checked, modelbutton.flat:checked, 460.menuitem.button.flat:checked, spinbutton:not(.vertical) button:checked, spinbutton.vertical button:checked, toolbar.osd button:checked, .app-notification button:checked, .titlebar:not(headerbar) button:checked:not(.suggested-action):not(.destructive-action), 461headerbar button:checked:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow:checked, scrollbar button:checked, check:checked, 462radio:checked, calendar.button:checked, messagedialog.csd .dialog-action-area button:checked, button.sidebar-button:checked, 463button.flat:checked { 464background-color: alpha(currentColor, 0.3); 465color: rgba(0, 0, 0, 0.8); } 466.inline-toolbar 467button:checked:disabled, modelbutton.flat:checked:disabled, 468.menuitem.button.flat:checked:disabled, spinbutton:not(.vertical) button:checked:disabled, spinbutton.vertical button:checked:disabled, toolbar.osd button:checked:disabled, .app-notification button:checked:disabled, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action), 469headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action), notebook > header > tabs > arrow:checked:disabled, scrollbar button:checked:disabled, check:checked:disabled, 470radio:checked:disabled, calendar.button:checked:disabled, messagedialog.csd .dialog-action-area button:checked:disabled, button.sidebar-button:checked:disabled, 471button.flat:checked:disabled { 472background-color: alpha(currentColor, 0.3); 473color: rgba(0, 0, 0, 0.32); } 474.inline-toolbar 475button:checked:disabled > label, modelbutton.flat:checked:disabled > label, 476.menuitem.button.flat:checked:disabled > label, spinbutton:not(.vertical) button:checked:disabled > label, spinbutton.vertical button:checked:disabled > label, toolbar.osd button:checked:disabled > label, .app-notification button:checked:disabled > label, .titlebar:not(headerbar) button:checked:disabled:not(.suggested-action):not(.destructive-action) > label, 477headerbar button:checked:disabled:not(.suggested-action):not(.destructive-action) > label, notebook > header > tabs > arrow:checked:disabled > label, scrollbar button:checked:disabled > label, check:checked:disabled > label, 478radio:checked:disabled > label, calendar.button:checked:disabled > label, messagedialog.csd .dialog-action-area button:checked:disabled > label, button.sidebar-button:checked:disabled > label, 479button.flat:checked:disabled > label { 480color: inherit; } 481.inline-toolbar 482button:not(.text-button), spinbutton:not(.vertical) button, notebook > header tab button.flat, check, 483radio, button.titlebutton, .nautilus-circular-button, 484button.image-button { 485min-width: 24px; 486padding: 6px; 487-gtk-outline-radius: 100px; 488border-radius: 100px; } 489button.text-button { 490padding-left: 16px; 491padding-right: 16px; } 492.inline-toolbar 493button.text-button:not(.text-button), spinbutton:not(.vertical) button.text-button, notebook > header tab button.text-button.flat, check.text-button, 494radio.text-button, button.text-button.titlebutton, .text-button.nautilus-circular-button, 495button.text-button.image-button { 496padding-left: 10px; 497padding-right: 10px; 498-gtk-outline-radius: 2px; 499border-radius: 2px; } 500.inline-toolbar 501button.text-button:not(.text-button) label:last-child, spinbutton:not(.vertical) button.text-button label:last-child, notebook > header tab button.text-button.flat label:last-child, check.text-button label:last-child, 502radio.text-button label:last-child, button.text-button.titlebutton label:last-child, .text-button.nautilus-circular-button label:last-child, 503button.text-button.image-button label:last-child { 504padding-left: 2px; 505padding-right: 6px; } 506.inline-toolbar 507button.text-button:not(.text-button) label:first-child, spinbutton:not(.vertical) button.text-button label:first-child, notebook > header tab button.text-button.flat label:first-child, check.text-button label:first-child, 508radio.text-button label:first-child, button.text-button.titlebutton label:first-child, .text-button.nautilus-circular-button label:first-child, 509button.text-button.image-button label:first-child { 510padding-left: 6px; 511padding-right: 2px; } 512.inline-toolbar .linked > button, .linked > modelbutton.flat, 513.linked > .menuitem.button.flat, spinbutton:not(.vertical) .linked > button, spinbutton.vertical .linked > button, toolbar.osd .linked > button, .app-notification .linked > button, .titlebar:not(headerbar) .linked > button:not(.suggested-action):not(.destructive-action), 514headerbar .linked > button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked > arrow, scrollbar .linked > button, .linked > check, 515.linked > radio, .linked > calendar.button, messagedialog.csd .dialog-action-area .linked > button, .linked > button.sidebar-button, .inline-toolbar .linked.vertical > button, .linked.vertical > modelbutton.flat, 516.linked.vertical > .menuitem.button.flat, spinbutton:not(.vertical) .linked.vertical > button, spinbutton.vertical .linked.vertical > button, toolbar.osd .linked.vertical > button, .app-notification .linked.vertical > button, .titlebar:not(headerbar) .linked.vertical > button:not(.suggested-action):not(.destructive-action), 517headerbar .linked.vertical > button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked.vertical > arrow, scrollbar .linked.vertical > button, .linked.vertical > check, 518.linked.vertical > radio, .linked.vertical > calendar.button, messagedialog.csd .dialog-action-area .linked.vertical > button, .linked.vertical > button.sidebar-button, .linked > 519button.flat, .linked.vertical > 520button.flat { 521border-radius: 2px; } 522.inline-toolbar .linked > button.image-button, .inline-toolbar .linked > button.flat:not(.text-button), .linked > modelbutton.image-button.flat, 523.linked > .image-button.menuitem.button.flat, spinbutton:not(.vertical) .linked > button, spinbutton.vertical .linked > button.image-button, toolbar.osd .linked > button.image-button, .app-notification .linked > button.image-button, .titlebar:not(headerbar) .linked > button.image-button:not(.suggested-action):not(.destructive-action), 524headerbar .linked > button.image-button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked > arrow.image-button, notebook > header tab .linked > button.flat, scrollbar .linked > button.image-button, .linked > check, 525.linked > radio, .linked > calendar.image-button.button, messagedialog.csd .dialog-action-area .linked > button.image-button, .linked > button.image-button.sidebar-button, .linked > button.flat.titlebutton, .linked > .flat.nautilus-circular-button, .inline-toolbar .linked.vertical > button.image-button, .inline-toolbar .linked.vertical > button.flat:not(.text-button), .linked.vertical > modelbutton.image-button.flat, 526.linked.vertical > .image-button.menuitem.button.flat, spinbutton:not(.vertical) .linked.vertical > button, spinbutton.vertical .linked.vertical > button.image-button, toolbar.osd .linked.vertical > button.image-button, .app-notification .linked.vertical > button.image-button, .titlebar:not(headerbar) .linked.vertical > button.image-button:not(.suggested-action):not(.destructive-action), 527headerbar .linked.vertical > button.image-button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked.vertical > arrow.image-button, notebook > header tab .linked.vertical > button.flat, scrollbar .linked.vertical > button.image-button, .linked.vertical > check, 528.linked.vertical > radio, .linked.vertical > calendar.image-button.button, messagedialog.csd .dialog-action-area .linked.vertical > button.image-button, .linked.vertical > button.image-button.sidebar-button, .linked.vertical > button.flat.titlebutton, .linked.vertical > .flat.nautilus-circular-button, .linked > 529button.flat.image-button, .linked.vertical > 530button.flat.image-button { 531-gtk-outline-radius: 100px; 532border-radius: 100px; } 533.inline-toolbar .linked > button.text-button.image-button, .inline-toolbar .linked > button.flat.text-button:not(.text-button), .linked > modelbutton.text-button.image-button.flat, 534.linked > .text-button.image-button.menuitem.button.flat, spinbutton:not(.vertical) .linked > button.text-button, spinbutton.vertical .linked > button.text-button.image-button, toolbar.osd .linked > button.text-button.image-button, .app-notification .linked > button.text-button.image-button, .titlebar:not(headerbar) .linked > button.text-button.image-button:not(.suggested-action):not(.destructive-action), 535headerbar .linked > button.text-button.image-button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked > arrow.text-button.image-button, notebook > header tab .linked > button.flat.text-button, scrollbar .linked > button.text-button.image-button, .linked > check.text-button, 536.linked > radio.text-button, .linked > calendar.text-button.image-button.button, messagedialog.csd .dialog-action-area .linked > button.text-button.image-button, .linked > button.text-button.image-button.sidebar-button, .linked > button.flat.text-button.titlebutton, .linked > .flat.text-button.nautilus-circular-button, .inline-toolbar .linked.vertical > button.text-button.image-button, .inline-toolbar .linked.vertical > button.flat.text-button:not(.text-button), .linked.vertical > modelbutton.text-button.image-button.flat, 537.linked.vertical > .text-button.image-button.menuitem.button.flat, spinbutton:not(.vertical) .linked.vertical > button.text-button, spinbutton.vertical .linked.vertical > button.text-button.image-button, toolbar.osd .linked.vertical > button.text-button.image-button, .app-notification .linked.vertical > button.text-button.image-button, .titlebar:not(headerbar) .linked.vertical > button.text-button.image-button:not(.suggested-action):not(.destructive-action), 538headerbar .linked.vertical > button.text-button.image-button:not(.suggested-action):not(.destructive-action), notebook > header > tabs.linked.vertical > arrow.text-button.image-button, notebook > header tab .linked.vertical > button.flat.text-button, scrollbar .linked.vertical > button.text-button.image-button, .linked.vertical > check.text-button, 539.linked.vertical > radio.text-button, .linked.vertical > calendar.text-button.image-button.button, messagedialog.csd .dialog-action-area .linked.vertical > button.text-button.image-button, .linked.vertical > button.text-button.image-button.sidebar-button, .linked.vertical > button.flat.text-button.titlebutton, .linked.vertical > .flat.text-button.nautilus-circular-button, .linked > 540button.flat.text-button.image-button, .linked.vertical > 541button.flat.text-button.image-button { 542-gtk-outline-radius: 2px; 543border-radius: 2px; } 544.info button:disabled, 545.question button:disabled, 546.warning button:disabled, 547.error button:disabled, row:selected 548button:disabled { 549color: rgba(255, 255, 255, 0.3); } 550row:selected button.sidebar-button, .info button.flat, 551.question button.flat, 552.warning button.flat, 553.error button.flat, row:selected 554button.flat { 555color: rgba(255, 255, 255, 0.75); } 556row:selected button.sidebar-button:hover, .info button.flat:hover, 557.question button.flat:hover, 558.warning button.flat:hover, 559.error button.flat:hover, row:selected button.sidebar-button:active, .info button.flat:active, 560.question button.flat:active, 561.warning button.flat:active, 562.error button.flat:active, row:selected 563button.flat:hover, row:selected 564button.flat:active { 565color: #FFFFFF; } 566row:selected button.sidebar-button:disabled, .info button.flat:disabled, 567.question button.flat:disabled, 568.warning button.flat:disabled, 569.error button.flat:disabled, row:selected 570button.flat:disabled { 571color: rgba(255, 255, 255, 0.3); } 572button separator { 573min-width: 0; 574min-height: 0; 575background: transparent; } 576button.osd { 577padding: 12px 16px; } 578button.osd.image-button { 579padding: 12px; } 580button.osd:disabled { 581opacity: 0; } 582button.suggested-action { 583background-color: #FF4081; 584color: #FFFFFF; } 585button.suggested-action:disabled { 586box-shadow: none; 587background-color: alpha(currentColor, 0.3); 588color: rgba(0, 0, 0, 0.32); } 589button.suggested-action:disabled > label { 590color: inherit; } 591button.suggested-action:checked { 592background-color: #ff79a7; } 593button.suggested-action.flat { 594background-color: transparent; 595color: #FF4081; } 596button.suggested-action.flat:disabled { 597box-shadow: none; 598background-color: transparent; 599color: rgba(0, 0, 0, 0.32); } 600button.suggested-action.flat:disabled > label { 601color: inherit; } 602button.destructive-action { 603background-color: #FF5252; 604color: #FFFFFF; } 605button.destructive-action:disabled { 606box-shadow: none; 607background-color: alpha(currentColor, 0.3); 608color: rgba(0, 0, 0, 0.32); } 609button.destructive-action:disabled > label { 610color: inherit; } 611button.destructive-action:checked { 612background-color: #ff8686; } 613button.destructive-action.flat { 614background-color: transparent; 615color: #FF5252; } 616button.destructive-action.flat:disabled { 617box-shadow: none; 618background-color: transparent; 619color: rgba(0, 0, 0, 0.32); } 620button.destructive-action.flat:disabled > label { 621color: inherit; } 622.stack-switcher > 623button { 624outline-offset: -4px; } 625.stack-switcher > 626button > label { 627padding-left: 6px; 628padding-right: 6px; } 629.stack-switcher > 630button > image { 631padding-left: 6px; 632padding-right: 6px; 633padding-top: 3px; 634padding-bottom: 3px; } 635.stack-switcher > 636button.text-button { 637padding-left: 10px; 638padding-right: 10px; } 639.stack-switcher > 640button.image-button { 641padding-left: 4px; 642padding-right: 4px; } 643.stack-switcher > 644button.needs-attention:checked > label, 645.stack-switcher > 646button.needs-attention:checked > image { 647animation: none; 648background-image: none; } 649.primary-toolbar 650button { 651-gtk-icon-shadow: none; } 652 653.stack-switcher > 654button.needs-attention > label, 655.stack-switcher > 656button.needs-attention > image, stacksidebar row.needs-attention > label { 657animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1) forwards; 658background-repeat: no-repeat; 659background-position: right 3px; 660background-size: 6px 6px; } 661.stack-switcher > 662button.needs-attention > label:dir(rtl), 663.stack-switcher > 664button.needs-attention > image:dir(rtl), stacksidebar row.needs-attention > label:dir(rtl) { 665background-position: left 3px; } 666 667.linked:not(.vertical) > spinbutton:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked:not(.vertical) > entry:not(.flat), 668notebook > stack:not(:only-child) revealer .linked:not(.vertical) > spinbutton:not(.flat):not(.vertical), .linked:not(.vertical) > 669entry:not(.flat), .linked > 670button, .linked > combobox > box > button.combo:dir(ltr), .linked > combobox > box > button.combo:dir(rtl) { 671border-radius: 0; } 672 673.linked:not(.vertical) > spinbutton:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked:not(.vertical) > entry:not(.flat), 674notebook > stack:not(:only-child) revealer .linked:not(.vertical) > spinbutton:not(.flat):not(.vertical), .linked:not(.vertical) > 675entry:not(.flat), .linked > 676button { 677-gtk-outline-radius: 2px; } 678.linked:not(.vertical) > spinbutton:first-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked:not(.vertical) > entry:first-child:not(.flat), 679notebook > stack:not(:only-child) revealer .linked:not(.vertical) > spinbutton:first-child:not(.flat):not(.vertical), .linked:not(.vertical) > 680entry:first-child:not(.flat), .linked > 681button:first-child, combobox.linked button:nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo { 682border-top-left-radius: 2px; 683border-bottom-left-radius: 2px; } 684.linked:not(.vertical) > spinbutton:last-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked:not(.vertical) > entry:last-child:not(.flat), 685notebook > stack:not(:only-child) revealer .linked:not(.vertical) > spinbutton:last-child:not(.flat):not(.vertical), .linked:not(.vertical) > 686entry:last-child:not(.flat), .linked > 687button:last-child, combobox.linked button:nth-child(2):dir(ltr), .linked:not(.vertical) > combobox:last-child > box > button.combo { 688border-top-right-radius: 2px; 689border-bottom-right-radius: 2px; } 690.linked:not(.vertical) > spinbutton:only-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked:not(.vertical) > entry:only-child:not(.flat), 691notebook > stack:not(:only-child) revealer .linked:not(.vertical) > spinbutton:only-child:not(.flat):not(.vertical), .linked:not(.vertical) > 692entry:only-child:not(.flat), .linked > 693button:only-child, .linked:not(.vertical) > combobox:only-child > box > button.combo { 694border-radius: 2px; } 695 696.linked.vertical > spinbutton:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked.vertical > entry:not(.flat), 697notebook > stack:not(:only-child) revealer .linked.vertical > spinbutton:not(.flat):not(.vertical), .linked.vertical > 698entry:not(.flat), .linked.vertical > 699button, .linked.vertical > combobox > box > button.combo { 700border-radius: 0; } 701 702.linked.vertical > spinbutton:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked.vertical > entry:not(.flat), 703notebook > stack:not(:only-child) revealer .linked.vertical > spinbutton:not(.flat):not(.vertical), .linked.vertical > 704entry:not(.flat), .linked.vertical > 705button { 706-gtk-outline-radius: 2px; } 707.linked.vertical > spinbutton:first-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked.vertical > entry:first-child:not(.flat), 708notebook > stack:not(:only-child) revealer .linked.vertical > spinbutton:first-child:not(.flat):not(.vertical), .linked.vertical > 709entry:first-child:not(.flat), .linked.vertical > 710button:first-child, .linked.vertical > combobox:first-child > box > button.combo { 711border-top-left-radius: 2px; 712border-top-right-radius: 2px; } 713.linked.vertical > spinbutton:last-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked.vertical > entry:last-child:not(.flat), 714notebook > stack:not(:only-child) revealer .linked.vertical > spinbutton:last-child:not(.flat):not(.vertical), .linked.vertical > 715entry:last-child:not(.flat), .linked.vertical > 716button:last-child, .linked.vertical > combobox:last-child > box > button.combo { 717border-bottom-left-radius: 2px; 718border-bottom-right-radius: 2px; } 719.linked.vertical > spinbutton:only-child:not(.flat):not(.vertical), notebook > stack:not(:only-child) revealer .linked.vertical > entry:only-child:not(.flat), 720notebook > stack:not(:only-child) revealer .linked.vertical > spinbutton:only-child:not(.flat):not(.vertical), .linked.vertical > 721entry:only-child:not(.flat), .linked.vertical > 722button:only-child, .linked.vertical > combobox:only-child > box > button.combo { 723border-radius: 2px; } 724 725/* menu buttons */ 726modelbutton.flat, 727.menuitem.button.flat { 728min-height: 28px; 729padding-left: 8px; 730padding-right: 8px; 731border-radius: 2px; 732color: inherit; } 733modelbutton.flat check:not(:checked):not(:indeterminate), 734modelbutton.flat radio:not(:checked):not(:indeterminate), 735.menuitem.button.flat check:not(:checked):not(:indeterminate), 736.menuitem.button.flat radio:not(:checked):not(:indeterminate) { 737color: alpha(currentColor, 0.6); } 738modelbutton.flat check, modelbutton.flat check:hover, 739modelbutton.flat radio, 740modelbutton.flat radio:hover, 741.menuitem.button.flat check, 742.menuitem.button.flat check:hover, 743.menuitem.button.flat radio, 744.menuitem.button.flat radio:hover { 745background-image: none; } 746modelbutton.flat check:active, 747modelbutton.flat radio:active, 748.menuitem.button.flat check:active, 749.menuitem.button.flat radio:active { 750animation: none; } 751modelbutton.flat check:last-child, 752modelbutton.flat radio:last-child, 753.menuitem.button.flat check:last-child, 754.menuitem.button.flat radio:last-child { 755margin-left: -8px; 756margin-right: -16px; } 757modelbutton.flat check:first-child, 758modelbutton.flat radio:first-child, 759.menuitem.button.flat check:first-child, 760.menuitem.button.flat radio:first-child { 761margin-left: -16px; 762margin-right: -8px; } 763 764modelbutton.flat arrow { 765background: none; } 766modelbutton.flat arrow:hover { 767background: none; } 768modelbutton.flat arrow.left { 769-gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); } 770modelbutton.flat arrow.right { 771-gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); } 772 773button.color { 774min-height: 24px; 775min-width: 24px; 776padding: 6px; } 777 778/********* 779* Links * 780*********/ 781*:link, button:link, 782button:visited, *:link:hover, button:hover:link, 783button:hover:visited, *:link:active, button:active:link, 784button:active:visited { 785color: #42A5F5; } 786*:link:visited, 787button:visited, *:link:visited:hover, 788button:visited:hover, *:link:visited:active, 789button:visited:active { 790color: #E040FB; } 791.info *:link, .info button:link, 792.info button:visited, 793.question *:link, 794.question button:link, 795.question button:visited, 796.warning *:link, 797.warning button:link, 798.warning button:visited, 799.error *:link, 800.error button:link, 801.error button:visited, *:link:selected, button:selected:link, 802button:selected:visited, .selection-mode.titlebar:not(headerbar) .subtitle:link, 803headerbar.selection-mode .subtitle:link, *:selected *:link, *:selected button:link, 804*:selected button:visited { 805color: #FFFFFF; } 806 807button:link > label, 808button:visited > label { 809text-decoration-line: underline; } 810 811/***************** 812* GtkSpinButton * 813*****************/ 814spinbutton:not(.vertical) { 815padding: 0; } 816notebook > stack:not(:only-child) spinbutton:not(.vertical) entry, 817spinbutton:not(.vertical) entry { 818min-width: 32px; 819margin: 0; 820border-image: none; 821border-radius: 0; 822box-shadow: none; 823background-color: transparent; } 824spinbutton:not(.vertical) button { 825min-height: 24px; 826min-width: 24px; 827padding: 0; 828border: solid 6px transparent; } 829spinbutton:not(.vertical) button.up { 830margin-left: -3px; } 831spinbutton:not(.vertical) button.down { 832margin-right: -3px; } 833spinbutton.vertical:disabled { 834color: rgba(0, 0, 0, 0.32); } 835spinbutton.vertical:drop(active) { 836box-shadow: none; } 837spinbutton.vertical entry { 838min-height: 36px; 839min-width: 48px; 840padding: 0; } 841spinbutton.vertical button { 842min-height: 36px; 843min-width: 48px; 844padding: 0; } 845spinbutton.vertical button.up { 846border-radius: 2px 2px 0 0; } 847spinbutton.vertical button.down { 848border-radius: 0 0 2px 2px; } 849treeview spinbutton:not(.vertical) { 850min-height: 0; 851border-style: none; 852border-radius: 0; } 853treeview spinbutton:not(.vertical) entry { 854min-height: 0; 855padding: 1px 2px; } 856 857/************** 858* ComboBoxes * 859**************/ 860combobox arrow { 861-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); 862min-height: 16px; 863min-width: 16px; } 864combobox menu, 865combobox .menu { 866padding: 2px 0; } 867combobox menu menuitem, 868combobox .menu menuitem { 869min-height: 36px; 870padding: 0 10px; } 871combobox:drop(active) { 872box-shadow: none; } 873 874/************ 875* Toolbars * 876************/ 877toolbar { 878-GtkWidget-window-dragging: true; 879padding: 3px; 880background-color: #F5F5F5; } 881.osd toolbar { 882background-color: transparent; } 883toolbar.osd, .app-notification, 884.app-notification.frame { 885transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 886padding: 6px; 887border-radius: 2px; 888box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); 889background-color: #FFFFFF; } 890toolbar.osd:backdrop, .app-notification:backdrop { 891box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); } 892toolbar.osd.left, .left.app-notification, toolbar.osd.right, .right.app-notification, toolbar.osd.top, .top.app-notification, toolbar.osd.bottom, .bottom.app-notification { 893border-radius: 0; } 894toolbar.horizontal separator { 895margin: 3px; } 896toolbar.vertical separator { 897margin: 3px; } 898toolbar:not(.inline-toolbar):not(.osd) scale, 899toolbar:not(.inline-toolbar):not(.osd) entry, 900toolbar:not(.inline-toolbar):not(.osd) spinbutton, 901toolbar:not(.inline-toolbar):not(.osd) button { 902margin: 3px; } 903toolbar:not(.inline-toolbar):not(.osd) switch { 904margin: 9px 3px; } 905 906.inline-toolbar { 907padding: 6px; 908border-style: solid; 909border-width: 0 1px 1px; 910border-color: rgba(0, 0, 0, 0.1); 911background-color: #fafafa; } 912 913searchbar, 914.location-bar { 915padding: 6px; 916border-style: solid; 917border-width: 0 0 1px; 918border-color: rgba(0, 0, 0, 0.1); 919background-color: #F5F5F5; 920background-clip: border-box; } 921 922/*************** 923* Header bars * 924***************/ 925.titlebar:not(headerbar), 926headerbar { 927transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1), color 0.2s cubic-bezier(0, 0, 0.2, 1); 928min-height: 48px; 929padding: 0 6px; 930box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 1px rgba(255, 255, 255, 0.2); 931background-color: #455A64; 932color: #FFFFFF; } 933.titlebar:backdrop:not(headerbar), 934headerbar:backdrop { 935color: rgba(255, 255, 255, 0.75); } 936.titlebar:not(headerbar) .title, 937headerbar .title { 938padding-left: 12px; 939padding-right: 12px; 940font-weight: bold; } 941.titlebar:not(headerbar) .subtitle, 942headerbar .subtitle { 943padding-left: 12px; 944padding-right: 12px; 945font-size: smaller; } 946.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action), 947headerbar button:not(.suggested-action):not(.destructive-action) { 948border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px; 949color: alpha(currentColor, 0.75); } 950.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active, 951headerbar button:not(.suggested-action):not(.destructive-action):hover, 952headerbar button:not(.suggested-action):not(.destructive-action):active { 953color: currentColor; } 954.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled, 955headerbar button:not(.suggested-action):not(.destructive-action):disabled { 956color: alpha(currentColor, 0.3); } 957.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled > label, 958headerbar button:not(.suggested-action):not(.destructive-action):disabled > label { 959color: inherit; } 960.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, 961headerbar button:not(.suggested-action):not(.destructive-action):checked { 962border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px; 963background-color: transparent; 964color: currentColor; } 965.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, 966headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled { 967background-color: transparent; 968color: alpha(currentColor, 0.4); } 969.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled > label, 970headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled > label { 971color: inherit; } 972.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled, 973headerbar button.suggested-action:disabled, 974headerbar button.destructive-action:disabled { 975color: alpha(currentColor, 0.4); } 976.titlebar:not(headerbar) button.suggested-action:disabled > label, .titlebar:not(headerbar) button.destructive-action:disabled > label, 977headerbar button.suggested-action:disabled > label, 978headerbar button.destructive-action:disabled > label { 979color: inherit; } 980.selection-mode.titlebar:not(headerbar), 981headerbar.selection-mode { 982transition: background-color 0 0.3s, color 0.2s cubic-bezier(0, 0, 0.2, 1); 983animation: header_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1); 984background-color: #42A5F5; 985color: #FFFFFF; } 986.selection-mode.titlebar:backdrop:not(headerbar), 987headerbar.selection-mode:backdrop { 988color: rgba(255, 255, 255, 0.75); } 989.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action), 990headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) { 991border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px; } 992.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action), .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active, 993headerbar.selection-mode button:not(.suggested-action):not(.destructive-action), 994headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):hover, 995headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):active { 996color: currentColor; } 997.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled, 998headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled { 999color: alpha(currentColor, 0.4); } 1000.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled > label, 1001headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled > label { 1002color: inherit; } 1003.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked, 1004headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked { 1005border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px; 1006color: currentColor; } 1007.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled, 1008headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled { 1009color: alpha(currentColor, 0.4); } 1010.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled > label, 1011headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled > label { 1012color: inherit; } 1013.selection-mode.titlebar:not(headerbar) .selection-menu, 1014headerbar.selection-mode .selection-menu { 1015padding-left: 16px; 1016padding-right: 16px; } 1017.selection-mode.titlebar:not(headerbar) .selection-menu GtkArrow, 1018headerbar.selection-mode .selection-menu GtkArrow { 1019-GtkArrow-arrow-scaling: 1; } 1020.selection-mode.titlebar:not(headerbar) .selection-menu .arrow, 1021headerbar.selection-mode .selection-menu .arrow { 1022-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } 1023.fullscreen .titlebar:not(headerbar), .tiled .titlebar:not(headerbar), .maximized .titlebar:not(headerbar), .fullscreen 1024headerbar, .tiled 1025headerbar, .maximized 1026headerbar { 1027border-radius: 0; 1028box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); } 1029.default-decoration.titlebar:not(headerbar), 1030headerbar.default-decoration { 1031min-height: 24px; 1032padding: 6px; 1033border-width: 0; } 1034.default-decoration.titlebar:not(headerbar) button.titlebutton, 1035headerbar.default-decoration button.titlebutton { 1036min-height: 24px; 1037min-width: 24px; 1038margin: 0; 1039padding: 0; } 1040.default-decoration.titlebar:not(headerbar) button.titlebutton:active, 1041headerbar.default-decoration button.titlebutton:active { 1042background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0.15) 100%, transparent 0%), image(alpha(currentColor, 0.15)); } 1043 1044headerbar entry, 1045headerbar spinbutton, 1046headerbar button { 1047margin-top: 6px; 1048margin-bottom: 6px; } 1049 1050.titlebar { 1051border-top-left-radius: 2px; 1052border-top-right-radius: 2px; } 1053 1054separator:first-child + headerbar, headerbar:first-child { 1055border-top-left-radius: 2px; } 1056.tiled separator:first-child + headerbar, .maximized separator:first-child + headerbar, .tiled headerbar:first-child, .maximized headerbar:first-child { 1057border-radius: 0; } 1058headerbar:last-child { 1059border-top-right-radius: 2px; } 1060.tiled headerbar:last-child, .maximized headerbar:last-child { 1061border-radius: 0; } 1062 1063window.csd > .titlebar:not(headerbar) { 1064padding: 0; 1065background-color: transparent; 1066background-image: none; 1067border-style: none; 1068box-shadow: none; } 1069.titlebar:not(headerbar) > separator { 1070background-color: #455A64; 1071background-image: image(rgba(0, 0, 0, 0.1)); } 1072 1073/************ 1074* Pathbars * 1075************/ 1076.path-bar button.text-button, .path-bar button.image-button, .path-bar button { 1077padding-left: 6px; 1078padding-right: 6px; } 1079.path-bar button image { 1080padding-left: 4px; 1081padding-right: 4px; } 1082.path-bar button.slider-button { 1083padding-left: 0; 1084padding-right: 0; } 1085 1086/************** 1087* Tree Views * 1088**************/ 1089treeview.view { 1090-GtkTreeView-grid-line-width: 1; 1091-GtkTreeView-grid-line-pattern: ''; 1092-GtkTreeView-tree-line-width: 1; 1093-GtkTreeView-tree-line-pattern: ''; 1094-GtkTreeView-expander-size: 16; 1095border-left-color: alpha(currentColor, 0.3); 1096border-top-color: rgba(0, 0, 0, 0.1); } 1097treeview.view:hover, treeview.view:active, treeview.view:selected { 1098border-radius: 0; } 1099treeview.view.separator { 1100min-height: 5px; 1101color: rgba(0, 0, 0, 0.1); } 1102treeview.view:drop(active) { 1103border-style: solid none; 1104border-width: 1px; 1105border-color: #FF4081; } 1106treeview.view:drop(active).after { 1107border-top-style: none; } 1108treeview.view:drop(active).before { 1109border-bottom-style: none; } 1110treeview.view.expander { 1111-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); 1112-gtk-icon-transform: rotate(-90deg); 1113color: rgba(0, 0, 0, 0.6); } 1114treeview.view.expander:dir(rtl) { 1115-gtk-icon-transform: rotate(90deg); } 1116treeview.view.expander:checked { 1117-gtk-icon-transform: unset; } 1118treeview.view.expander:hover, treeview.view.expander:active { 1119color: rgba(0, 0, 0, 0.8); } 1120treeview.view.expander:disabled { 1121color: rgba(0, 0, 0, 0.24); } 1122treeview.view.expander:selected { 1123color: rgba(255, 255, 255, 0.75); } 1124treeview.view.expander:selected:hover, treeview.view.expander:selected:active { 1125color: #FFFFFF; } 1126treeview.view.expander:selected:disabled { 1127color: rgba(255, 255, 255, 0.3); } 1128treeview.view.progressbar { 1129border-style: none none solid; 1130border-width: 4px; 1131border-color: #42A5F5; 1132background-color: transparent; 1133background-image: none; } 1134treeview.view.progressbar:selected { 1135border-color: currentColor; } 1136treeview.view.trough { 1137border-style: none none solid; 1138border-width: 4px; 1139border-color: rgba(66, 165, 245, 0.3); 1140background-color: transparent; 1141background-image: none; } 1142treeview.view.trough:selected { 1143border-color: alpha(currentColor, 0.3); } 1144treeview.view header button { 1145padding: 2px 6px; 1146border-style: none solid solid none; 1147border-width: 1px; 1148border-color: rgba(0, 0, 0, 0.1); 1149border-radius: 0; 1150background-clip: border-box; } 1151treeview.view header button, treeview.view header button:hover, treeview.view header button:active { 1152box-shadow: none; } 1153treeview.view header button, treeview.view header button:disabled { 1154background-color: #FFFFFF; } 1155treeview.view header button:last-child { 1156border-right-style: none; } 1157treeview.view button.dnd, 1158treeview.view header.button.dnd { 1159padding: 2px 6px; 1160border-style: none solid solid; 1161border-width: 1px; 1162border-color: rgba(0, 0, 0, 0.1); 1163border-radius: 0; 1164box-shadow: none; 1165background-color: #FFFFFF; 1166background-clip: border-box; 1167color: #42A5F5; } 1168 1169/********* 1170* Menus * 1171*********/ 1172menubar, 1173.menubar { 1174-GtkWidget-window-dragging: true; 1175padding: 0; 1176background-color: #455A64; } 1177menubar > menuitem, 1178.menubar > menuitem { 1179transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1); 1180min-height: 20px; 1181padding: 4px 8px; 1182color: rgba(255, 255, 255, 0.75); } 1183menubar > menuitem:hover, 1184.menubar > menuitem:hover { 1185transition: none; 1186background-color: alpha(currentColor, 0.15); 1187color: #FFFFFF; } 1188menubar > menuitem:disabled, 1189.menubar > menuitem:disabled { 1190color: rgba(255, 255, 255, 0.3); } 1191 1192menu, 1193.menu { 1194margin: 4px 0; 1195padding: 4px 0; 1196background-color: #FFFFFF; 1197border: 1px solid rgba(0, 0, 0, 0.1); } 1198.csd menu, .csd 1199.menu { 1200border: none; 1201border-radius: 2px; } 1202menu menuitem, 1203.menu menuitem { 1204transition: background-color 0.2s cubic-bezier(0, 0, 0.2, 1); 1205min-height: 20px; 1206min-width: 40px; 1207padding: 4px 8px; 1208font: initial; 1209text-shadow: none; } 1210menu menuitem:hover, 1211.menu menuitem:hover { 1212transition: none; 1213background-color: alpha(currentColor, 0.15); } 1214menu menuitem:disabled, 1215.menu menuitem:disabled { 1216color: rgba(0, 0, 0, 0.32); } 1217menu menuitem arrow, 1218.menu menuitem arrow { 1219min-height: 16px; 1220min-width: 16px; } 1221menu menuitem arrow:dir(ltr), 1222.menu menuitem arrow:dir(ltr) { 1223-gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); 1224margin-left: 8px; } 1225menu menuitem arrow:dir(rtl), 1226.menu menuitem arrow:dir(rtl) { 1227-gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); 1228margin-right: 8px; } 1229menu > arrow, 1230.menu > arrow { 1231min-height: 16px; 1232min-width: 16px; 1233padding: 4px; 1234border-radius: 0; 1235background-color: #FFFFFF; 1236color: rgba(0, 0, 0, 0.6); } 1237menu > arrow.top, 1238.menu > arrow.top { 1239margin-top: -4px; 1240border-bottom: 1px solid rgba(0, 0, 0, 0.1); 1241-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } 1242menu > arrow.bottom, 1243.menu > arrow.bottom { 1244margin-bottom: -4px; 1245border-top: 1px solid rgba(0, 0, 0, 0.1); 1246-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } 1247menu > arrow:hover, 1248.menu > arrow:hover { 1249background-image: image(alpha(currentColor, 0.15)); 1250color: rgba(0, 0, 0, 0.8); } 1251menu > arrow:disabled, 1252.menu > arrow:disabled { 1253border-color: transparent; 1254background-color: transparent; 1255color: transparent; } 1256menu separator, 1257.menu separator { 1258margin: 4px 0; } 1259 1260menuitem accelerator { 1261color: alpha(currentColor, 0.6); } 1262menuitem check:dir(ltr), 1263menuitem radio:dir(ltr) { 1264margin-right: -8px; 1265margin-left: -16px; } 1266menuitem check:dir(rtl), 1267menuitem radio:dir(rtl) { 1268margin-right: -16px; 1269margin-left: -8px; } 1270 1271.csd.popup { 1272border-radius: 2px; } 1273 1274/*************** 1275* Popovers * 1276***************/ 1277popover.background { 1278transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 1279padding: 0; 1280box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); 1281background-color: #FAFAFA; } 1282popover.background:backdrop { 1283box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); } 1284popover.background, .csd popover.background { 1285border-style: solid; 1286border-width: 1px; 1287border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.2) rgba(0, 0, 0, 0.3); 1288border-radius: 3px; } 1289popover.background > list, 1290popover.background > .view, 1291popover.background > iconview, 1292popover.background > toolbar { 1293border-style: none; 1294box-shadow: none; 1295background-color: transparent; } 1296popover.background separator { 1297margin: 4px 0; } 1298popover.background list separator { 1299margin: 0; } 1300 1301/************* 1302* Notebooks * 1303*************/ 1304notebook > header { 1305border-width: 1px; 1306border-color: rgba(0, 0, 0, 0.1); 1307background-color: #F5F5F5; 1308background-clip: border-box; } 1309notebook > header.top { 1310border-bottom-style: solid; } 1311notebook > header.top > tabs { 1312margin-bottom: -1px; } 1313notebook > header.top > tabs > tab:hover { 1314box-shadow: inset 0 -2px alpha(currentColor, 0.3); } 1315notebook > header.top > tabs > tab:checked { 1316box-shadow: inset 0 -2px #42A5F5; } 1317notebook > header.bottom { 1318border-top-style: solid; } 1319notebook > header.bottom > tabs { 1320margin-top: -1px; } 1321notebook > header.bottom > tabs > tab:hover { 1322box-shadow: inset 0 2px alpha(currentColor, 0.3); } 1323notebook > header.bottom > tabs > tab:checked { 1324box-shadow: inset 0 2px #42A5F5; } 1325notebook > header.left { 1326border-right-style: solid; } 1327notebook > header.left > tabs { 1328margin-right: -1px; } 1329notebook > header.left > tabs > tab:hover { 1330box-shadow: inset -2px 0 alpha(currentColor, 0.3); } 1331notebook > header.left > tabs > tab:checked { 1332box-shadow: inset -2px 0 #42A5F5; } 1333notebook > header.right { 1334border-left-style: solid; } 1335notebook > header.right > tabs { 1336margin-left: -1px; } 1337notebook > header.right > tabs > tab:hover { 1338box-shadow: inset 2px 0 alpha(currentColor, 0.3); } 1339notebook > header.right > tabs > tab:checked { 1340box-shadow: inset 2px 0 #42A5F5; } 1341notebook > header.top > tabs > arrow { 1342border-top-style: none; } 1343notebook > header.bottom > tabs > arrow { 1344border-bottom-style: none; } 1345notebook > header.top > tabs > arrow, notebook > header.bottom > tabs > arrow { 1346padding-left: 4px; 1347padding-right: 4px; } 1348notebook > header.top > tabs > arrow.down, notebook > header.bottom > tabs > arrow.down { 1349margin-left: -8px; 1350-gtk-icon-source: -gtk-icontheme("pan-start-symbolic"); } 1351notebook > header.top > tabs > arrow.up, notebook > header.bottom > tabs > arrow.up { 1352margin-right: -8px; 1353-gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); } 1354notebook > header.left > tabs > arrow { 1355border-left-style: none; } 1356notebook > header.right > tabs > arrow { 1357border-right-style: none; } 1358notebook > header.left > tabs > arrow, notebook > header.right > tabs > arrow { 1359padding-top: 4px; 1360padding-bottom: 4px; } 1361notebook > header.left > tabs > arrow.down, notebook > header.right > tabs > arrow.down { 1362margin-top: -8px; 1363-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } 1364notebook > header.left > tabs > arrow.up, notebook > header.right > tabs > arrow.up { 1365margin-bottom: -8px; 1366-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } 1367notebook > header > tabs > arrow { 1368min-height: 16px; 1369min-width: 16px; 1370border-radius: 0; } 1371notebook > header tab { 1372transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; 1373min-height: 24px; 1374min-width: 24px; 1375padding: 6px 12px; 1376outline-offset: -6px; 1377border-width: 1px; 1378border-color: transparent; 1379color: rgba(0, 0, 0, 0.6); 1380font-weight: 500; } 1381notebook > header tab:hover { 1382color: rgba(0, 0, 0, 0.8); } 1383notebook > header tab:hover.reorderable-page { 1384border-color: rgba(0, 0, 0, 0.1); 1385background-color: #fafafa; } 1386notebook > header tab:disabled { 1387color: rgba(0, 0, 0, 0.24); } 1388notebook > header tab:checked { 1389animation: tab_ripple_effect 0.9s cubic-bezier(0, 0, 0.2, 1); 1390color: rgba(0, 0, 0, 0.8); } 1391notebook > header tab:checked:disabled { 1392color: rgba(0, 0, 0, 0.32); } 1393notebook > header tab:checked.reorderable-page { 1394border-color: rgba(0, 0, 0, 0.1); 1395background-color: #FFFFFF; } 1396notebook > header tab button.flat { 1397min-width: 24px; 1398min-height: 24px; 1399padding: 0; } 1400notebook > header tab button.flat:last-child { 1401margin-left: 6px; 1402margin-right: -6px; } 1403notebook > header tab button.flat:first-child { 1404margin-left: -6px; 1405margin-right: 6px; } 1406notebook > header.top tabs, notebook > header.bottom tabs { 1407padding-left: 8px; 1408padding-right: 8px; } 1409notebook > header.top tabs:not(:only-child):first-child, notebook > header.bottom tabs:not(:only-child):first-child { 1410margin-left: 0; } 1411notebook > header.top tabs:not(:only-child):last-child, notebook > header.bottom tabs:not(:only-child):last-child { 1412margin-right: 0; } 1413notebook > header.top tabs tab.reorderable-page, notebook > header.bottom tabs tab.reorderable-page { 1414margin: 0 -1px; 1415border-style: none solid; } 1416notebook > header.left tabs, notebook > header.right tabs { 1417padding-top: 8px; 1418padding-bottom: 8px; } 1419notebook > header.left tabs:not(:only-child):first-child, notebook > header.right tabs:not(:only-child):first-child { 1420margin-top: 0; } 1421notebook > header.left tabs:not(:only-child):last-child, notebook > header.right tabs:not(:only-child):last-child { 1422margin-bottom: 0; } 1423notebook > header.left tabs tab.reorderable-page, notebook > header.right tabs tab.reorderable-page { 1424margin: -1px 0; 1425border-style: solid none; } 1426notebook > stack:not(:only-child) { 1427background-color: #FFFFFF; } 1428 1429/************** 1430* Scrollbars * 1431**************/ 1432scrollbar { 1433transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; 1434background-color: #FFFFFF; 1435background-clip: padding-box; } 1436* { 1437-GtkScrollbar-has-backward-stepper: false; 1438-GtkScrollbar-has-forward-stepper: false; } 1439scrollbar.top { 1440border-bottom: 1px solid rgba(0, 0, 0, 0.1); } 1441scrollbar.bottom { 1442border-top: 1px solid rgba(0, 0, 0, 0.1); } 1443scrollbar.left { 1444border-right: 1px solid rgba(0, 0, 0, 0.1); } 1445scrollbar.right { 1446border-left: 1px solid rgba(0, 0, 0, 0.1); } 1447scrollbar slider { 1448transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0; 1449min-width: 8px; 1450min-height: 8px; 1451border: 4px solid transparent; 1452border-radius: 100px; 1453background-clip: padding-box; 1454background-color: rgba(0, 0, 0, 0.48); } 1455scrollbar slider:hover { 1456background-color: rgba(0, 0, 0, 0.6); } 1457scrollbar slider:active { 1458background-color: rgba(0, 0, 0, 0.8); } 1459scrollbar slider:disabled { 1460background-color: rgba(0, 0, 0, 0.192); } 1461scrollbar.fine-tune slider { 1462transition: all 0.2s cubic-bezier(0, 0, 0.2, 1), margin 0, border-width 0, min-width 0, min-height 0; 1463min-width: 4px; 1464min-height: 4px; } 1465scrollbar.fine-tune.horizontal slider { 1466margin: 2px 0; } 1467scrollbar.fine-tune.vertical slider { 1468margin: 0 2px; } 1469scrollbar.overlay-indicator:not(.dragging):not(.hovering) { 1470border-color: transparent; 1471background-color: transparent; } 1472scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { 1473min-width: 4px; 1474min-height: 4px; 1475margin: 2px; 1476border: 2px solid rgba(255, 255, 255, 0.3); } 1477scrollbar.overlay-indicator:not(.dragging):not(.hovering) button { 1478min-width: 4px; 1479min-height: 4px; 1480margin: 2px; 1481border: 2px solid rgba(255, 255, 255, 0.3); 1482border-radius: 100px; 1483background-color: rgba(0, 0, 0, 0.48); 1484background-clip: padding-box; 1485-gtk-icon-source: none; } 1486scrollbar.overlay-indicator:not(.dragging):not(.hovering) button:disabled { 1487background-color: rgba(0, 0, 0, 0.192); } 1488scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { 1489min-width: 24px; } 1490scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal button { 1491min-width: 8px; } 1492scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { 1493min-height: 24px; } 1494scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical button { 1495min-height: 8px; } 1496scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { 1497background-color: rgba(255, 255, 255, 0.9); } 1498scrollbar.horizontal slider { 1499min-width: 24px; } 1500scrollbar.vertical slider { 1501min-height: 24px; } 1502scrollbar button { 1503min-width: 16px; 1504min-height: 16px; 1505padding: 0; 1506border-radius: 0; } 1507scrollbar.vertical button.down { 1508-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } 1509scrollbar.vertical button.up { 1510-gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } 1511scrollbar.horizontal button.down { 1512-gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } 1513scrollbar.horizontal button.up { 1514-gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } 1515 1516/********** 1517* Switch * 1518**********/ 1519switch { 1520transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; 1521margin: 6px 0; 1522border: 4px solid transparent; 1523border-radius: 100px; 1524background-color: alpha(currentColor, 0.3); 1525background-clip: padding-box; 1526font-size: 0; } 1527switch:disabled { 1528color: rgba(0, 0, 0, 0.32); } 1529switch:checked { 1530background-color: rgba(255, 64, 129, 0.5); } 1531switch:checked:disabled { 1532background-color: rgba(255, 64, 129, 0.2); 1533color: rgba(0, 0, 0, 0.32); } 1534switch slider { 1535transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 1536border-image: none; 1537box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 1538background-color: #FFFFFF; 1539color: rgba(0, 0, 0, 0.8); 1540transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, margin 0; 1541min-width: 24px; 1542min-height: 24px; 1543margin: -4px 0 -4px -4px; 1544-gtk-outline-radius: 100px; 1545border-radius: 100px; } 1546switch:hover slider { 1547border-image: none; 1548box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); } 1549switch:disabled slider { 1550box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 1551background-color: #fafafa; 1552color: rgba(0, 0, 0, 0.32); } 1553switch:checked slider { 1554transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, margin 0, background-image 0, background-color 0 0.3s; 1555animation: needs_attention 0.3s cubic-bezier(0, 0, 0.2, 1); 1556margin: -4px -4px -4px 0; 1557background-color: #FF4081; 1558color: #FFFFFF; } 1559switch:checked:disabled slider { 1560animation: none; } 1561 1562/************************* 1563* Check and Radio items * 1564*************************/ 1565.view.content-view.check:not(list), iconview.content-view.check:not(list) { 1566-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 1567-gtk-icon-source: -gtk-scaled(url("assets/checkbox-selectionmode.png"), url("assets/checkbox-selectionmode@2.png")); 1568margin: 8px; 1569background-color: transparent; } 1570 1571.view.content-view.check:hover:not(list), iconview.content-view.check:hover:not(list) { 1572-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 1573-gtk-icon-source: -gtk-scaled(url("assets/checkbox-hover-selectionmode.png"), url("assets/checkbox-hover-selectionmode@2.png")); 1574margin: 8px; 1575background-color: transparent; } 1576 1577.view.content-view.check:checked:not(list), iconview.content-view.check:checked:not(list) { 1578-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 1579-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-selectionmode.png"), url("assets/checkbox-checked-selectionmode@2.png")); 1580margin: 8px; 1581background-color: transparent; } 1582 1583.view.content-view.check:checked:hover:not(list), iconview.content-view.check:checked:hover:not(list) { 1584-gtk-icon-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 1585-gtk-icon-source: -gtk-scaled(url("assets/checkbox-checked-hover-selectionmode.png"), url("assets/checkbox-checked-hover-selectionmode@2.png")); 1586margin: 8px; 1587background-color: transparent; } 1588 1589checkbutton.text-button, 1590radiobutton.text-button { 1591padding: 2px; 1592outline-offset: 0; } 1593checkbutton.text-button label:not(:only-child), 1594radiobutton.text-button label:not(:only-child) { 1595margin: 0 4px; } 1596 1597check, 1598radio { 1599min-height: 24px; 1600min-width: 24px; 1601margin: -12px; 1602padding: 12px; } 1603check:checked, check:checked:disabled, 1604radio:checked, 1605radio:checked:disabled { 1606background-color: transparent; } 1607check:checked, check:indeterminate, 1608radio:checked, 1609radio:indeterminate { 1610color: #FF4081; } 1611check:checked:disabled, check:indeterminate:disabled, 1612radio:checked:disabled, 1613radio:indeterminate:disabled { 1614color: rgba(255, 64, 129, 0.4); } 1615row check:not(:checked):not(:indeterminate), row 1616radio:not(:checked):not(:indeterminate) { 1617color: alpha(currentColor, 0.75); } 1618row check:not(:checked):not(:indeterminate):hover, row check:not(:checked):not(:indeterminate):active, row 1619radio:not(:checked):not(:indeterminate):hover, row 1620radio:not(:checked):not(:indeterminate):active { 1621color: currentColor; } 1622menu menuitem check, menu menuitem 1623radio { 1624transition: none; 1625margin: -16px; } 1626menu menuitem check:not(:checked):not(:indeterminate), menu menuitem 1627radio:not(:checked):not(:indeterminate) { 1628color: alpha(currentColor, 0.6); } 1629menu menuitem check, menu menuitem check:hover, menu menuitem check:disabled, menu menuitem 1630radio, menu menuitem 1631radio:hover, menu menuitem 1632radio:disabled { 1633background-image: none; } 1634 1635check { 1636-gtk-icon-source: image(-gtk-recolor(url("assets/check-unchecked-symbolic.svg")), -gtk-recolor(url("assets/check-unchecked-symbolic.png"))); } 1637check:checked { 1638-gtk-icon-source: image(-gtk-recolor(url("assets/check-checked-symbolic.svg")), -gtk-recolor(url("assets/check-checked-symbolic.png"))); } 1639check:indeterminate { 1640-gtk-icon-source: image(-gtk-recolor(url("assets/check-dash-symbolic.svg")), -gtk-recolor(url("assets/check-dash-symbolic.png"))); } 1641 1642radio { 1643border-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent)) 24/24px; } 1644radio { 1645-gtk-icon-source: image(-gtk-recolor(url("assets/radio-unchecked-symbolic.svg")), -gtk-recolor(url("assets/radio-unchecked-symbolic.png"))); } 1646radio:indeterminate { 1647-gtk-icon-source: image(-gtk-recolor(url("assets/radio-dash-symbolic.svg")), -gtk-recolor(url("assets/radio-dash-symbolic.png"))); } 1648radio:checked { 1649border-image: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(#FF4081), to(transparent)) 24/24px; } 1650radio:checked:disabled { 1651border-image: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(rgba(255, 64, 129, 0.4)), to(transparent)) 24/24px; } 1652radio:indeterminate:checked { 1653border-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent)) 24/24px; } 1654 1655@keyframes check_check { 1656from { 1657-gtk-icon-transform: rotate(90deg); } 1658to { 1659-gtk-icon-transform: unset; } } 1660@keyframes check_radio { 1661from { 1662border-image: -gtk-gradient(radial, center center, 0, center center, 0.001, to(#FF4081), to(transparent)) 24/24px; } 1663to { 1664border-image: -gtk-gradient(radial, center center, 0, center center, 0.10417, to(#FF4081), to(transparent)) 24/24px; } } 1665@keyframes check_indeterminate { 1666from { 1667-gtk-icon-transform: unset; } 166850% { 1669-gtk-icon-transform: scale(0, 1); } 1670to { 1671-gtk-icon-transform: unset; } } 1672modelbutton.flat check:not(:indeterminate):checked, 1673.menuitem.button.flat check:not(:indeterminate):checked, 1674check:not(:indeterminate):checked { 1675animation: check_check 0.3s cubic-bezier(0.4, 0, 0.2, 1); } 1676 1677check:not(:indeterminate):checked:active { 1678animation: check_check 0.3s cubic-bezier(0.4, 0, 0.2, 1), flat_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards; } 1679 1680modelbutton.flat check:indeterminate:checked, modelbutton.flat radio:indeterminate:checked, 1681.menuitem.button.flat check:indeterminate:checked, 1682.menuitem.button.flat radio:indeterminate:checked, 1683check:indeterminate:checked, radio:indeterminate:checked { 1684animation: check_indeterminate 0.3s cubic-bezier(0.4, 0, 0.2, 1); } 1685 1686check:indeterminate:checked:active, radio:indeterminate:checked:active { 1687animation: check_indeterminate 0.3s cubic-bezier(0.4, 0, 0.2, 1), flat_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards; } 1688 1689menu menuitem check:not(:indeterminate):checked, 1690menu menuitem radio:not(:indeterminate):checked, 1691menu menuitem check:indeterminate:checked, 1692menu menuitem radio:indeterminate:checked { 1693animation: none; } 1694 1695treeview.view check, 1696treeview.view radio { 1697padding: 0; } 1698treeview.view check:checked:hover, treeview.view check:selected:checked:hover, 1699treeview.view radio:checked:hover, 1700treeview.view radio:selected:checked:hover { 1701background-image: none; } 1702treeview.view check, 1703treeview.view radio { 1704color: rgba(0, 0, 0, 0.6); } 1705treeview.view check:hover, treeview.view check:active, 1706treeview.view radio:hover, 1707treeview.view radio:active { 1708color: rgba(0, 0, 0, 0.8); } 1709treeview.view check:disabled, 1710treeview.view radio:disabled { 1711color: rgba(0, 0, 0, 0.24); } 1712treeview.view check:checked, treeview.view check:indeterminate, 1713treeview.view radio:checked, 1714treeview.view radio:indeterminate { 1715color: #FF4081; } 1716treeview.view check:checked:disabled, treeview.view check:indeterminate:disabled, 1717treeview.view radio:checked:disabled, 1718treeview.view radio:indeterminate:disabled { 1719color: rgba(255, 64, 129, 0.4); } 1720treeview.view check:selected, 1721treeview.view radio:selected { 1722color: rgba(255, 255, 255, 0.75); } 1723treeview.view check:selected:hover, treeview.view check:selected:active, 1724treeview.view radio:selected:hover, 1725treeview.view radio:selected:active { 1726color: #FFFFFF; } 1727treeview.view check:selected:disabled, 1728treeview.view radio:selected:disabled { 1729color: rgba(255, 255, 255, 0.3); } 1730treeview.view check:selected:checked, treeview.view check:selected:indeterminate, 1731treeview.view radio:selected:checked, 1732treeview.view radio:selected:indeterminate { 1733color: #FF4081; } 1734treeview.view check:selected:checked:disabled, treeview.view check:selected:indeterminate:disabled, 1735treeview.view radio:selected:checked:disabled, 1736treeview.view radio:selected:indeterminate:disabled { 1737color: rgba(255, 64, 129, 0.4); } 1738 1739treeview.view radio:checked { 1740-gtk-icon-source: image(-gtk-recolor(url("assets/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/radio-checked-symbolic.png"))); 1741border-image: none; } 1742 1743/************ 1744* GtkScale * 1745************/ 1746scale { 1747min-height: 12px; 1748min-width: 12px; 1749padding: 12px; } 1750scale * { 1751transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; } 1752scale slider { 1753min-height: 24px; 1754min-width: 24px; 1755margin: -10px; } 1756scale trough { 1757outline-offset: 2px; 1758background-color: alpha(currentColor, 0.3); } 1759scale trough:disabled { 1760color: rgba(0, 0, 0, 0.32); } 1761scale highlight { 1762background-color: #FF4081; } 1763scale highlight:disabled { 1764background-color: transparent; } 1765scale fill { 1766background-color: alpha(currentColor, 0.3); } 1767scale fill:disabled { 1768background-color: transparent; } 1769scale slider { 1770transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); 1771background-repeat: no-repeat; 1772background-position: center; 1773background-size: calc(100% - 8px); } 1774scale slider { 1775background-image: -gtk-scaled(url("assets/slider.png"), url("assets/slider@2.png")); } 1776scale slider:disabled { 1777background-image: -gtk-scaled(url("assets/slider-insensitive.png"), url("assets/slider-insensitive@2.png")); } 1778scale slider:hover { 1779background-size: calc(100% - 4px); } 1780scale slider:active { 1781background-size: calc(100% - 0px); } 1782scale.fine-tune slider { 1783background-size: calc(100% - 12px); } 1784scale value { 1785color: alpha(currentColor, 0.6); } 1786scale marks { 1787color: alpha(currentColor, 0.3); } 1788scale marks.top { 1789margin-bottom: 8px; 1790margin-top: -16px; } 1791scale marks.bottom { 1792margin-top: 8px; 1793margin-bottom: -16px; } 1794scale marks.top { 1795margin-right: 8px; 1796margin-left: -16px; } 1797scale marks.bottom { 1798margin-left: 8px; 1799margin-right: -16px; } 1800scale.horizontal indicator { 1801min-height: 8px; 1802min-width: 1px; } 1803scale.vertical indicator { 1804min-height: 1px; 1805min-width: 8px; } 1806scale.color.horizontal slider, 1807scale.horizontal contents:last-child:not(:only-child) > trough > slider { 1808min-height: 30px; 1809min-width: 24px; 1810margin-top: -16px; 1811background-position: center calc(100% - 4px); } 1812scale.color.horizontal slider, 1813scale.horizontal contents:last-child:not(:only-child) > trough > slider { 1814background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above.png"), url("assets/slider-horz-scale-has-marks-above@2.png")); } 1815scale.color.horizontal slider:hover, 1816scale.horizontal contents:last-child:not(:only-child) > trough > slider:hover { 1817background-position: center calc(100% - 2px); } 1818scale.color.horizontal slider:active, 1819scale.horizontal contents:last-child:not(:only-child) > trough > slider:active { 1820background-position: center calc(100% - 0px); } 1821scale.color.fine-tune.horizontal slider, scale.horizontal.fine-tune contents:last-child:not(:only-child) > trough > slider { 1822background-position: center calc(100% - 6px); } 1823scale.color.horizontal slider, 1824scale.horizontal contents:last-child:not(:only-child) > trough > slider { 1825min-height: 30px; 1826min-width: 24px; 1827margin-top: -16px; 1828background-position: center calc(100% - 4px); } 1829scale.color.horizontal slider:disabled, 1830scale.horizontal contents:last-child:not(:only-child) > trough > slider:disabled { 1831background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-insensitive.png"), url("assets/slider-horz-scale-has-marks-above-insensitive@2.png")); } 1832scale.color.horizontal slider:hover, 1833scale.horizontal contents:last-child:not(:only-child) > trough > slider:hover { 1834background-position: center calc(100% - 2px); } 1835scale.color.horizontal slider:active, 1836scale.horizontal contents:last-child:not(:only-child) > trough > slider:active { 1837background-position: center calc(100% - 0px); } 1838scale.color.fine-tune.horizontal slider, scale.horizontal.fine-tune contents:last-child:not(:only-child) > trough > slider { 1839background-position: center calc(100% - 6px); } 1840scale.horizontal contents:first-child:not(:only-child) > trough > slider { 1841min-height: 30px; 1842min-width: 24px; 1843margin-bottom: -16px; 1844background-position: center calc(4px); } 1845scale.horizontal contents:first-child:not(:only-child) > trough > slider { 1846background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below.png"), url("assets/slider-horz-scale-has-marks-below@2.png")); } 1847scale.horizontal contents:first-child:not(:only-child) > trough > slider:hover { 1848background-position: center calc(2px); } 1849scale.horizontal contents:first-child:not(:only-child) > trough > slider:active { 1850background-position: center calc(0px); } 1851scale.horizontal.fine-tune contents:first-child:not(:only-child) > trough > slider { 1852background-position: center calc(6px); } 1853scale.horizontal contents:first-child:not(:only-child) > trough > slider { 1854min-height: 30px; 1855min-width: 24px; 1856margin-bottom: -16px; 1857background-position: center calc(4px); } 1858scale.horizontal contents:first-child:not(:only-child) > trough > slider:disabled { 1859background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-insensitive.png"), url("assets/slider-horz-scale-has-marks-below-insensitive@2.png")); } 1860scale.horizontal contents:first-child:not(:only-child) > trough > slider:hover { 1861background-position: center calc(2px); } 1862scale.horizontal contents:first-child:not(:only-child) > trough > slider:active { 1863background-position: center calc(0px); } 1864scale.horizontal.fine-tune contents:first-child:not(:only-child) > trough > slider { 1865background-position: center calc(6px); } 1866scale.color.vertical:dir(rtl) slider, 1867scale.vertical contents:last-child:not(:only-child) > trough > slider { 1868min-height: 24px; 1869min-width: 30px; 1870margin-left: -16px; 1871background-position: calc(4px) center; } 1872scale.color.vertical:dir(rtl) slider, 1873scale.vertical contents:last-child:not(:only-child) > trough > slider { 1874background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above.png"), url("assets/slider-vert-scale-has-marks-above@2.png")); } 1875scale.color.vertical:dir(rtl) slider:hover, 1876scale.vertical contents:last-child:not(:only-child) > trough > slider:hover { 1877background-position: calc(2px) center; } 1878scale.color.vertical:dir(rtl) slider:active, 1879scale.vertical contents:last-child:not(:only-child) > trough > slider:active { 1880background-position: calc(0px) center; } 1881scale.color.fine-tune.vertical:dir(rtl) slider, scale.vertical.fine-tune contents:last-child:not(:only-child) > trough > slider { 1882background-position: calc(6px) center; } 1883scale.color.vertical:dir(rtl) slider, 1884scale.vertical contents:last-child:not(:only-child) > trough > slider { 1885min-height: 24px; 1886min-width: 30px; 1887margin-left: -16px; 1888background-position: calc(4px) center; } 1889scale.color.vertical:dir(rtl) slider:disabled, 1890scale.vertical contents:last-child:not(:only-child) > trough > slider:disabled { 1891background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-insensitive.png"), url("assets/slider-vert-scale-has-marks-above-insensitive@2.png")); } 1892scale.color.vertical:dir(rtl) slider:hover, 1893scale.vertical contents:last-child:not(:only-child) > trough > slider:hover { 1894background-position: calc(2px) center; } 1895scale.color.vertical:dir(rtl) slider:active, 1896scale.vertical contents:last-child:not(:only-child) > trough > slider:active { 1897background-position: calc(0px) center; } 1898scale.color.fine-tune.vertical:dir(rtl) slider, scale.vertical.fine-tune contents:last-child:not(:only-child) > trough > slider { 1899background-position: calc(6px) center; } 1900scale.color.vertical:dir(ltr) slider, 1901scale.vertical contents:first-child:not(:only-child) > trough > slider { 1902min-height: 24px; 1903min-width: 30px; 1904margin-right: -16px; 1905background-position: calc(100% - 4px) center; } 1906scale.color.vertical:dir(ltr) slider, 1907scale.vertical contents:first-child:not(:only-child) > trough > slider { 1908background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below.png"), url("assets/slider-vert-scale-has-marks-below@2.png")); } 1909scale.color.vertical:dir(ltr) slider:hover, 1910scale.vertical contents:first-child:not(:only-child) > trough > slider:hover { 1911background-position: calc(100% - 2px) center; } 1912scale.color.vertical:dir(ltr) slider:active, 1913scale.vertical contents:first-child:not(:only-child) > trough > slider:active { 1914background-position: calc(100% - 0px) center; } 1915scale.color.fine-tune.vertical:dir(ltr) slider, scale.vertical.fine-tune contents:first-child:not(:only-child) > trough > slider { 1916background-position: calc(100% - 6px) center; } 1917scale.color.vertical:dir(ltr) slider, 1918scale.vertical contents:first-child:not(:only-child) > trough > slider { 1919min-height: 24px; 1920min-width: 30px; 1921margin-right: -16px; 1922background-position: calc(100% - 4px) center; } 1923scale.color.vertical:dir(ltr) slider:disabled, 1924scale.vertical contents:first-child:not(:only-child) > trough > slider:disabled { 1925background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-insensitive.png"), url("assets/slider-vert-scale-has-marks-below-insensitive@2.png")); } 1926scale.color.vertical:dir(ltr) slider:hover, 1927scale.vertical contents:first-child:not(:only-child) > trough > slider:hover { 1928background-position: calc(100% - 2px) center; } 1929scale.color.vertical:dir(ltr) slider:active, 1930scale.vertical contents:first-child:not(:only-child) > trough > slider:active { 1931background-position: calc(100% - 0px) center; } 1932scale.color.fine-tune.vertical:dir(ltr) slider, scale.vertical.fine-tune contents:first-child:not(:only-child) > trough > slider { 1933background-position: calc(100% - 6px) center; } 1934scale.color { 1935min-height: 0; 1936min-width: 0; } 1937scale.color.horizontal { 1938padding: 0 0 12px 0; } 1939scale.color.horizontal trough { 1940padding-bottom: 4px; } 1941scale.color.horizontal slider { 1942margin-bottom: -14px; 1943margin-top: 0; } 1944scale.color.vertical:dir(ltr) { 1945padding: 0 0 0 12px; } 1946scale.color.vertical:dir(ltr) trough { 1947padding-left: 4px; } 1948scale.color.vertical:dir(ltr) slider { 1949margin-left: -14px; 1950margin-right: 0; } 1951scale.color.vertical:dir(rtl) { 1952padding: 0 12px 0 0; } 1953scale.color.vertical:dir(rtl) trough { 1954padding-right: 4px; } 1955scale.color.vertical:dir(rtl) slider { 1956margin-right: -14px; 1957margin-left: 0; } 1958 1959/***************** 1960* Progress bars * 1961*****************/ 1962progressbar { 1963color: rgba(0, 0, 0, 0.48); 1964font-size: smaller; } 1965progressbar.horizontal trough, 1966progressbar.horizontal progress { 1967min-height: 4px; } 1968progressbar.vertical trough, 1969progressbar.vertical progress { 1970min-width: 4px; } 1971progressbar trough { 1972background-color: rgba(66, 165, 245, 0.3); } 1973progressbar progress { 1974background-color: #42A5F5; } 1975 1976/************* 1977* Level Bar * 1978*************/ 1979levelbar block { 1980min-width: 36px; 1981min-height: 4px; } 1982levelbar.vertical block { 1983min-width: 4px; 1984min-height: 36px; } 1985levelbar trough { 1986padding: 2px; 1987border-radius: 2px; 1988transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 1989border-image: none; 1990box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 1991background-color: #FFFFFF; 1992color: rgba(0, 0, 0, 0.8); } 1993levelbar trough:disabled { 1994box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); 1995background-color: #fafafa; 1996color: rgba(0, 0, 0, 0.32); } 1997levelbar.horizontal.discrete block { 1998margin: 0 1px; } 1999levelbar.vertical.discrete block { 2000margin: 1px 0; } 2001levelbar.horizontal.discrete trough { 2002padding: 2px 1px; } 2003levelbar.vertical.discrete trough { 2004padding: 1px 2px; } 2005levelbar block.low { 2006background-color: #FF6D00; } 2007levelbar block.high { 2008background-color: #42A5F5; } 2009levelbar block.full { 2010background-color: #00C853; } 2011levelbar block.empty { 2012background-color: alpha(currentColor, 0.3); 2013color: rgba(0, 0, 0, 0.32); } 2014 2015/**************** 2016* Print dialog * 2017*****************/ 2018printdialog paper { 2019padding: 0; 2020border: 1px solid rgba(0, 0, 0, 0.1); 2021background: #FFFFFF; 2022color: rgba(0, 0, 0, 0.8); } 2023printdialog .dialog-action-box { 2024margin: 12px; } 2025 2026/********** 2027* Frames * 2028**********/ 2029frame > border, 2030.frame { 2031margin: 0; 2032padding: 0; 2033border: 1px solid rgba(0, 0, 0, 0.1); 2034border-radius: 0; 2035box-shadow: none; } 2036frame > border.flat, 2037.frame.flat { 2038border-style: none; } 2039 2040actionbar > revealer > box { 2041padding: 6px; 2042border-top: 1px solid rgba(0, 0, 0, 0.1); } 2043 2044scrolledwindow viewport.frame { 2045border-style: none; } 2046scrolledwindow overshoot.top { 2047background-image: -gtk-gradient(radial, center top, 0, center top, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent)); 2048background-repeat: no-repeat; 2049background-position: center top; 2050background-color: transparent; 2051border: none; 2052box-shadow: none; } 2053scrolledwindow overshoot.bottom { 2054background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent)); 2055background-repeat: no-repeat; 2056background-position: center bottom; 2057background-color: transparent; 2058border: none; 2059box-shadow: none; } 2060scrolledwindow overshoot.left { 2061background-image: -gtk-gradient(radial, left center, 0, left center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent)); 2062background-repeat: no-repeat; 2063background-position: left center; 2064background-color: transparent; 2065border: none; 2066box-shadow: none; } 2067scrolledwindow overshoot.right { 2068background-image: -gtk-gradient(radial, right center, 0, right center, 0.75, to(rgba(64, 196, 255, 0.3)), to(transparent)); 2069background-repeat: no-repeat; 2070background-position: right center; 2071background-color: transparent; 2072border: none; 2073box-shadow: none; } 2074scrolledwindow undershoot.top { 2075background-color: transparent; 2076background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%); 2077padding-top: 1px; 2078background-size: 12px 1px; 2079background-repeat: repeat-x; 2080background-origin: content-box; 2081background-position: left top; } 2082scrolledwindow undershoot.bottom { 2083background-color: transparent; 2084background-image: linear-gradient(to left, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%); 2085padding-bottom: 1px; 2086background-size: 12px 1px; 2087background-repeat: repeat-x; 2088background-origin: content-box; 2089background-position: left bottom; } 2090scrolledwindow undershoot.left { 2091background-color: transparent; 2092background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%); 2093padding-left: 1px; 2094background-size: 1px 12px; 2095background-repeat: repeat-y; 2096background-origin: content-box; 2097background-position: left top; } 2098scrolledwindow undershoot.right { 2099background-color: transparent; 2100background-image: linear-gradient(to top, rgba(255, 255, 255, 0.3) 50%, rgba(0, 0, 0, 0.24) 50%); 2101padding-right: 1px; 2102background-size: 1px 12px; 2103background-repeat: repeat-y; 2104background-origin: content-box; 2105background-position: right top; } 2106scrolledwindow junction { 2107border-style: solid none none solid; 2108border-width: 1px; 2109border-color: rgba(0, 0, 0, 0.1); 2110background-color: #FFFFFF; } 2111scrolledwindow junction:dir(rtl) { 2112border-style: solid solid none none; } 2113 2114separator { 2115min-width: 1px; 2116min-height: 1px; 2117background: rgba(0, 0, 0, 0.1); } 2118 2119/********* 2120* Lists * 2121*********/ 2122list { 2123border-color: rgba(0, 0, 0, 0.1); 2124background-color: #FFFFFF; } 2125list row { 2126padding: 2px; } 2127 2128row { 2129transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; } 2130row:hover { 2131transition: none; } 2132row.activatable, .view, iconview, treeview.view header button { 2133background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0)); } 2134row.activatable:hover, .view:hover, iconview:hover, treeview.view header button:hover { 2135background-image: radial-gradient(circle farthest-corner at center, alpha(currentColor, 0) 100%, transparent 0%), image(alpha(currentColor, 0.05)); } 2136row.activatable.has-open-popup, .has-open-popup.view, iconview.has-open-popup, treeview.view header button.has-open-popup, row.activatable:active, .view:active, iconview:active, treeview.view header button:active { 2137transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, background-image 0; 2138animation: row_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards; } 2139 2140/********************* 2141* App Notifications * 2142*********************/ 2143.app-notification, 2144.app-notification.frame { 2145margin: 8px; } 2146.app-notification border, 2147.app-notification.frame border { 2148border: none; } 2149 2150/************* 2151* Expanders * 2152*************/ 2153expander arrow { 2154transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); 2155min-width: 16px; 2156min-height: 16px; 2157-gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); 2158-gtk-icon-transform: rotate(-90deg); 2159color: rgba(0, 0, 0, 0.6); } 2160expander arrow:dir(rtl) { 2161-gtk-icon-transform: rotate(90deg); } 2162expander arrow:checked { 2163-gtk-icon-transform: unset; } 2164expander arrow:hover, expander arrow:active { 2165color: rgba(0, 0, 0, 0.8); } 2166expander arrow:disabled { 2167color: rgba(0, 0, 0, 0.24); } 2168expander arrow:selected { 2169color: rgba(255, 255, 255, 0.75); } 2170expander arrow:selected:hover, expander arrow:selected:active { 2171color: #FFFFFF; } 2172expander arrow:selected:disabled { 2173color: rgba(255, 255, 255, 0.3); } 2174 2175/************ 2176* Calendar * 2177***********/ 2178calendar { 2179padding: 1px; 2180border: 1px solid rgba(0, 0, 0, 0.1); 2181color: rgba(0, 0, 0, 0.8); } 2182calendar:disabled { 2183color: rgba(0, 0, 0, 0.32); } 2184calendar:selected { 2185border-radius: 3px; } 2186calendar.header { 2187border-style: none none solid; 2188border-radius: 0; } 2189calendar.highlight { 2190color: alpha(currentColor, 0.6); 2191font-weight: 500; } 2192calendar:indeterminate { 2193color: alpha(currentColor, 0.4); } 2194 2195/*********** 2196* Dialogs * 2197***********/ 2198messagedialog.background { 2199background-color: #FAFAFA; } 2200messagedialog .titlebar { 2201min-height: 24px; 2202border-style: none; 2203box-shadow: inset 0 1px rgba(255, 255, 255, 0.4); 2204background-color: #FAFAFA; } 2205messagedialog.csd.background { 2206border-bottom-left-radius: 2px; 2207border-bottom-right-radius: 2px; } 2208messagedialog.csd .dialog-action-area button { 2209padding: 8px 16px; 2210border-top: 1px solid rgba(0, 0, 0, 0.1); 2211border-radius: 0; } 2212messagedialog.csd .dialog-action-area button:first-child { 2213border-bottom-left-radius: 2px; } 2214messagedialog.csd .dialog-action-area button:last-child { 2215border-bottom-right-radius: 2px; } 2216 2217filechooser .dialog-action-box { 2218border-top: 1px solid rgba(0, 0, 0, 0.1); } 2219filechooser #pathbarbox { 2220border-bottom: 1px solid rgba(0, 0, 0, 0.1); } 2221 2222filechooserbutton:drop(active) { 2223box-shadow: none; } 2224 2225/*********** 2226* Sidebar * 2227***********/ 2228.sidebar { 2229border-style: none; 2230background-color: #FAFAFA; } 2231stacksidebar.sidebar:dir(ltr) list, stacksidebar.sidebar.left list, stacksidebar.sidebar.left:dir(rtl) list, .sidebar:dir(ltr), .sidebar.left, .sidebar.left:dir(rtl) { 2232border-right: 1px solid rgba(0, 0, 0, 0.1); 2233border-left-style: none; } 2234stacksidebar.sidebar:dir(rtl) list 2235.sidebar:dir(rtl), stacksidebar.sidebar.right list 2236.sidebar:dir(rtl), .sidebar.right { 2237border-left: 1px solid rgba(0, 0, 0, 0.1); 2238border-right-style: none; } 2239.sidebar list { 2240background-color: transparent; } 2241paned .sidebar.left, paned .sidebar.right, paned .sidebar.left:dir(rtl), paned .sidebar:dir(rtl), paned .sidebar:dir(ltr), paned .sidebar { 2242border-style: none; } 2243 2244stacksidebar row { 2245padding: 10px 4px; } 2246stacksidebar row > label { 2247padding-left: 6px; 2248padding-right: 6px; } 2249 2250/**************** 2251* File chooser * 2252****************/ 2253placessidebar > viewport.frame { 2254border-style: none; } 2255placessidebar row { 2256min-height: 32px; 2257padding: 0; } 2258placessidebar row > revealer { 2259padding: 0 12px; } 2260placessidebar row:selected { 2261color: #FFFFFF; } 2262placessidebar row:disabled { 2263color: rgba(0, 0, 0, 0.32); } 2264placessidebar row image.sidebar-icon { 2265opacity: 0.6; } 2266placessidebar row image.sidebar-icon:dir(ltr) { 2267padding-right: 8px; } 2268placessidebar row image.sidebar-icon:dir(rtl) { 2269padding-left: 8px; } 2270placessidebar row label.sidebar-label:dir(ltr) { 2271padding-right: 2px; } 2272placessidebar row label.sidebar-label:dir(rtl) { 2273padding-left: 2px; } 2274button.sidebar-button { 2275min-height: 24px; 2276min-width: 24px; 2277margin-top: 0; 2278margin-bottom: 0; 2279padding: 0; 2280border-radius: 100%; 2281-gtk-outline-radius: 100%; } 2282placessidebar row.sidebar-placeholder-row { 2283min-height: 2px; 2284padding: 0 8px; 2285background-image: image(#FF4081); 2286background-clip: content-box; } 2287placessidebar row.sidebar-new-bookmark-row { 2288color: #FF4081; } 2289placessidebar row:drop(active):not(:disabled) { 2290box-shadow: inset 0 0 0 2px #FF4081; } 2291 2292placesview .server-list-button > image { 2293-gtk-icon-transform: rotate(0turn); } 2294placesview .server-list-button:checked > image { 2295-gtk-icon-transform: rotate(-0.5turn); } 2296placesview > actionbar > revealer > box > label { 2297padding-left: 8px; 2298padding-right: 8px; } 2299 2300/********* 2301* Paned * 2302*********/ 2303paned > separator { 2304min-width: 1px; 2305min-height: 1px; 2306-gtk-icon-source: none; 2307border-style: none; 2308background-color: transparent; 2309background-image: image(rgba(0, 0, 0, 0.1)); 2310background-size: 1px 1px; } 2311paned > separator.wide { 2312min-width: 6px; 2313min-height: 6px; 2314background-color: #F5F5F5; 2315background-image: image(rgba(0, 0, 0, 0.1)), image(rgba(0, 0, 0, 0.1)); 2316background-size: 1px 1px, 1px 1px; } 2317paned.horizontal > separator { 2318background-repeat: repeat-y; } 2319paned.horizontal > separator:dir(ltr) { 2320margin: 0 -8px 0 0; 2321padding: 0 8px 0 0; 2322background-position: left; } 2323paned.horizontal > separator:dir(rtl) { 2324margin: 0 0 0 -8px; 2325padding: 0 0 0 8px; 2326background-position: right; } 2327paned.horizontal > separator.wide { 2328margin: 0; 2329padding: 0; 2330background-repeat: repeat-y, repeat-y; 2331background-position: left, right; } 2332paned.vertical > separator { 2333margin: 0 0 -8px 0; 2334padding: 0 0 8px 0; 2335background-repeat: repeat-x; 2336background-position: top; } 2337paned.vertical > separator.wide { 2338margin: 0; 2339padding: 0; 2340background-repeat: repeat-x, repeat-x; 2341background-position: bottom, top; } 2342 2343/************** 2344* GtkInfoBar * 2345**************/ 2346infobar { 2347border-style: none; } 2348 2349.info { 2350background-color: #66BB6A; } 2351 2352.question { 2353background-color: #42A5F5; } 2354 2355.warning { 2356background-color: #FFA726; } 2357 2358.error { 2359background-color: #EF5350; } 2360 2361.info, 2362.question, 2363.warning, 2364.error { 2365color: #FFFFFF; } 2366 2367/************ 2368* Tooltips * 2369************/ 2370tooltip { 2371border-radius: 2px; 2372box-shadow: none; } 2373tooltip.background { 2374background-color: rgba(255, 255, 255, 0.9); } 2375tooltip decoration { 2376background-color: transparent; } 2377tooltip label { 2378min-height: 20px; 2379padding: 2px 2px; } 2380tooltip * { 2381padding: 0; 2382background-color: transparent; 2383color: inherit; } 2384 2385/***************** 2386* Color Chooser * 2387*****************/ 2388colorswatch.top { 2389border-top-left-radius: 2.5px; 2390border-top-right-radius: 2.5px; } 2391colorswatch.top overlay { 2392border-top-left-radius: 2px; 2393border-top-right-radius: 2px; } 2394colorswatch.bottom { 2395border-bottom-left-radius: 2.5px; 2396border-bottom-right-radius: 2.5px; } 2397colorswatch.bottom overlay { 2398border-bottom-left-radius: 2px; 2399border-bottom-right-radius: 2px; } 2400colorswatch.left, colorswatch:first-child:not(.top) { 2401border-top-left-radius: 2.5px; 2402border-bottom-left-radius: 2.5px; } 2403colorswatch.left overlay, colorswatch:first-child:not(.top) overlay { 2404border-top-left-radius: 2px; 2405border-bottom-left-radius: 2px; } 2406colorswatch.right, colorswatch:last-child:not(.bottom) { 2407border-top-right-radius: 2.5px; 2408border-bottom-right-radius: 2.5px; } 2409colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay { 2410border-top-right-radius: 2px; 2411border-bottom-right-radius: 2px; } 2412colorswatch.dark overlay { 2413color: white; } 2414colorswatch.light overlay { 2415color: rgba(0, 0, 0, 0.8); } 2416colorswatch.dark { 2417color: white; } 2418colorswatch.light { 2419color: rgba(0, 0, 0, 0.8); } 2420colorswatch:drop(active) { 2421box-shadow: none; } 2422colorswatch:drop(active).light overlay { 2423box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), 0 0 0 2px #FF4081; } 2424colorswatch:drop(active).dark overlay { 2425box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), 0 0 0 2px #FF4081; } 2426colorswatch overlay { 2427transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 2428box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); } 2429colorswatch overlay:hover { 2430box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); } 2431colorswatch#add-color-button { 2432border-radius: 2px 2px 0 0; 2433color: white; } 2434colorswatch#add-color-button:only-child { 2435border-radius: 2px; } 2436colorswatch#add-color-button overlay { 2437background-image: linear-gradient(to right, #EF5350 25%, #FFA726 25%, #FFA726 50%, #66BB6A 50%, #66BB6A 75%, #42A5F5 75%); 2438color: white; } 2439colorswatch:disabled { 2440opacity: 0.4; } 2441colorswatch:disabled overlay { 2442box-shadow: none; } 2443colorswatch#editor-color-sample { 2444border-radius: 2.5px; } 2445colorswatch#editor-color-sample overlay { 2446border-radius: 2px; } 2447 2448colorchooser .popover.osd { 2449transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 2450border-radius: 2px; 2451box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); 2452background-color: #FFFFFF; } 2453colorchooser .popover.osd:backdrop { 2454box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); } 2455 2456/******** 2457* Misc * 2458********/ 2459.content-view { 2460background-color: #F5F5F5; } 2461 2462/********************** 2463* Window Decorations * 2464*********************/ 2465decoration { 2466transition: box-shadow 0.2s cubic-bezier(0, 0, 0.2, 1); 2467border-radius: 2px 2px 0 0; 2468box-shadow: 0 14px 14px rgba(0, 0, 0, 0.25), 0 10px 5px rgba(0, 0, 0, 0.22), 0 16px 16px transparent; 2469margin: 8px; } 2470decoration:backdrop { 2471box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23), 0 16px 16px transparent; } 2472.fullscreen decoration, .tiled decoration { 2473border-radius: 0; } 2474.popup decoration { 2475box-shadow: none; } 2476.ssd decoration { 2477box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16); } 2478.csd.popup decoration { 2479border-radius: 2px; 2480box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); } 2481tooltip.csd decoration { 2482border-radius: 2px; 2483box-shadow: 0 3px 3px rgba(0, 0, 0, 0.16), 0 3px 3px rgba(0, 0, 0, 0.23); } 2484messagedialog.csd decoration { 2485border-radius: 2px; } 2486.solid-csd decoration { 2487margin: 4px; 2488border-radius: 0; 2489box-shadow: none; 2490background-color: #F5F5F5; } 2491 2492.view:selected, iconview:selected, .view text selection, iconview text selection, 2493textview text selection, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection, notebook > stack:not(:only-child) revealer entry selection, 2494notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) selection, 2495entry selection, modelbutton.flat:selected, 2496.menuitem.button.flat:selected, row:selected, calendar:selected { 2497background-color: #42A5F5; } 2498row:selected label, label:selected, .view:selected, iconview:selected, .view text selection, iconview text selection, 2499textview text selection, flowbox flowboxchild:selected, spinbutton:not(.vertical) selection, notebook > stack:not(:only-child) revealer entry selection, 2500notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) selection, 2501entry selection, modelbutton.flat:selected, 2502.menuitem.button.flat:selected, row:selected, calendar:selected { 2503color: #FFFFFF; } 2504row:selected label:disabled, label:disabled:selected, .view:disabled:selected, iconview:disabled:selected, .view text selection:disabled, iconview text selection:disabled, 2505textview text selection:disabled, flowbox flowboxchild:disabled:selected, label:disabled selection, spinbutton:not(.vertical) selection:disabled, notebook > stack:not(:only-child) revealer entry selection:disabled, 2506notebook > stack:not(:only-child) revealer spinbutton:not(.vertical) selection:disabled, 2507entry selection:disabled, modelbutton.flat:disabled:selected, 2508.menuitem.button.flat:disabled:selected, row:disabled:selected, calendar:disabled:selected { 2509color: rgba(255, 255, 255, 0.4); } 2510 2511.monospace { 2512font: Monospace; } 2513 2514/********************** 2515* Touch Copy & Paste * 2516*********************/ 2517cursor-handle { 2518border-radius: 100px; 2519background-color: #FF4081; 2520background-image: none; } 2521cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) { 2522padding-left: 6px; 2523border-top-right-radius: 0; } 2524cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) { 2525padding-right: 6px; 2526border-top-left-radius: 0; } 2527cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) { 2528-GtkWidget-text-handle-width: 24; 2529-GtkWidget-text-handle-height: 30; 2530-gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above.png"), url("assets/slider-horz-scale-has-marks-above@2.png")); } 2531 2532.context-menu { 2533font: initial; } 2534 2535button.circular { 2536border-radius: 100px; 2537-gtk-outline-radius: 100px; } 2538button.circular label { 2539padding: 0; } 2540 2541.keycap { 2542min-width: 12px; 2543min-height: 26px; 2544margin-top: 2px; 2545padding-bottom: 2px; 2546padding-left: 8px; 2547padding-right: 8px; 2548border: solid 1px rgba(0, 0, 0, 0.1); 2549border-radius: 3px; 2550box-shadow: inset 0 -2px rgba(0, 0, 0, 0.1); 2551background-color: #FFFFFF; 2552color: rgba(0, 0, 0, 0.8); 2553font-size: smaller; } 2554 2555*:drop(active) { 2556transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0; 2557box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), inset 0 0 0 2px #FF4081; 2558caret-color: #FF4081; } 2559 2560stackswitcher button.text-button { 2561min-width: 100px; } 2562 2563stackswitcher button.circular, 2564stackswitcher button.text-button.circular { 2565min-width: 36px; 2566min-height: 36px; 2567padding: 0; } 2568 2569.floating-bar { 2570min-height: 32px; 2571padding: 0; 2572border-style: solid solid none; 2573border-width: 1px; 2574border-color: rgba(0, 0, 0, 0.1); 2575border-radius: 3px 3px 0 0; 2576background-color: #FFFFFF; 2577background-clip: padding-box; 2578transition: all 0.3s cubic-bezier(0, 0, 0.2, 1), color 0, border-width 0; } 2579.floating-bar.left { 2580margin-right: 7px; 2581border-left-style: none; 2582border-top-left-radius: 0; } 2583.floating-bar.right { 2584margin-left: 7px; 2585border-right-style: none; 2586border-top-right-radius: 0; } 2587.floating-bar button { 2588min-height: 24px; 2589min-width: 24px; 2590margin: 4px; 2591padding: 0; } 2592 2593/************ 2594* Nautilus * 2595************/ 2596.nautilus-window, 2597.nautilus-window notebook, 2598.nautilus-window notebook > stack { 2599background: #FFFFFF; } 2600 2601.nautilus-desktop-window, 2602.nautilus-desktop-window notebook, 2603.nautilus-desktop-window notebook > stack { 2604background: transparent; } 2605 2606.nautilus-desktop.nautilus-canvas-item { 2607color: #FFFFFF; 2608text-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); } 2609 2610.nautilus-desktop.nautilus-canvas-item:selected { 2611text-shadow: none; } 2612 2613@keyframes needs_attention_keyframes { 26140% { 2615background-color: transparent; } 261650% { 2617background-color: alpha(currentColor, 0.3); } 2618100% { 2619background-color: transparent; } } 2620.nautilus-operations-button-needs-attention { 2621color: #FF4081; 2622animation: needs_attention_keyframes 2s cubic-bezier(0.4, 0, 0.2, 1); } 2623 2624.nautilus-operations-button-needs-attention-multiple { 2625color: #FF4081; 2626animation: needs_attention_keyframes 2s cubic-bezier(0.4, 0, 0.2, 1); 2627animation-iteration-count: 2; } 2628 2629.disk-space-display.unknown { 2630background-color: #FF6D00; } 2631 2632.disk-space-display.used { 2633background-color: #42A5F5; } 2634 2635.disk-space-display.free { 2636background-color: alpha(currentColor, 0.3); 2637color: rgba(0, 0, 0, 0.32); } 2638 2639.documents-entry-tag { 2640margin: 3px -2px 3px 8px; 2641padding: 0 8px; 2642border-radius: 100px; 2643box-shadow: none; 2644background-color: #42A5F5; 2645color: #FFFFFF; } 2646.documents-entry-tag:hover { 2647box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); } 2648 2649.documents-entry-tag.button { 2650margin: 0 -2px; 2651padding: 4px; 2652border-radius: 100px; 2653box-shadow: none; 2654color: rgba(255, 255, 255, 0.75); } 2655.documents-entry-tag.button:hover, .documents-entry-tag.button:active { 2656color: #FFFFFF; } 2657 2658.nautilus-window searchbar { 2659border-top: 1px solid rgba(0, 0, 0, 0.1); } 2660 2661.nautilus-window .searchbar-container { 2662margin-top: -1px; } 2663 2664/*********** 2665* Firefox * 2666***********/ 2667menubar { 2668color: rgba(255, 255, 255, 0.75); } 2669menubar:hover { 2670color: #FFFFFF; } 2671 2672separator { 2673color: rgba(0, 0, 0, 0.1); } 2674 2675/* FIXME: not working */ 2676window.background > widget > check, 2677window.background > widget > radio { 2678margin: 0; 2679padding: 0; } 2680 2681window.background > widget > radio:checked { 2682-gtk-icon-source: image(-gtk-recolor(url("assets/radio-checked-symbolic.svg")), -gtk-recolor(url("assets/radio-checked-symbolic.png"))); 2683border-image: none; } 2684 2685/*********** 2686* Synapse * 2687***********/ 2688box > widget > widget:selected { 2689background-color: #42A5F5; } 2690 2691/* GTK NAMED COLORS 2692---------------- 2693use responsibly! */ 2694/* 2695widget text/foreground color */ 2696@define-color theme_fg_color rgba(0, 0, 0, 0.8); 2697/* 2698text color for entries, views and content in general */ 2699@define-color theme_text_color rgba(0, 0, 0, 0.8); 2700/* 2701widget base background color */ 2702@define-color theme_bg_color #F5F5F5; 2703/* 2704text widgets and the like base background color */ 2705@define-color theme_base_color #FFFFFF; 2706/* 2707base background color of selections */ 2708@define-color theme_selected_bg_color #42A5F5; 2709/* 2710text/foreground color of selections */ 2711@define-color theme_selected_fg_color #FFFFFF; 2712/* 2713base background color of insensitive widgets */ 2714@define-color insensitive_bg_color #F5F5F5; 2715/* 2716text foreground color of insensitive widgets */ 2717@define-color insensitive_fg_color rgba(0, 0, 0, 0.32); 2718/* 2719insensitive text widgets and the like base background color */ 2720@define-color insensitive_base_color #fafafa; 2721/* 2722widget text/foreground color on backdrop windows */ 2723@define-color theme_unfocused_fg_color rgba(0, 0, 0, 0.8); 2724/* 2725text color for entries, views and content in general on backdrop windows */ 2726@define-color theme_unfocused_text_color rgba(0, 0, 0, 0.8); 2727/* 2728widget base background color on backdrop windows */ 2729@define-color theme_unfocused_bg_color #F5F5F5; 2730/* 2731text widgets and the like base background color on backdrop windows */ 2732@define-color theme_unfocused_base_color #FFFFFF; 2733/* 2734base background color of selections on backdrop windows */ 2735@define-color theme_unfocused_selected_bg_color #42A5F5; 2736/* 2737text/foreground color of selections on backdrop windows */ 2738@define-color theme_unfocused_selected_fg_color #FFFFFF; 2739/* 2740insensitive color on backdrop windows*/ 2741@define-color unfocused_insensitive_color rgba(0, 0, 0, 0.32); 2742/* 2743widgets main borders color */ 2744@define-color borders rgba(0, 0, 0, 0.1); 2745/* 2746widgets main borders color on backdrop windows */ 2747@define-color unfocused_borders rgba(0, 0, 0, 0.1); 2748/* 2749these are pretty self explicative */ 2750@define-color warning_color #FF6D00; 2751@define-color error_color #DD2C00; 2752@define-color success_color #00C853; 2753@define-color content_view_bg #FFFFFF; 2754