diff --git a/common/gtk-3.0/3.20/gtk-dark.css b/common/gtk-3.0/3.20/gtk-dark.css index ac96b2d..87ceb4e 100644 --- a/common/gtk-3.0/3.20/gtk-dark.css +++ b/common/gtk-3.0/3.20/gtk-dark.css @@ -1779,127 +1779,73 @@ notebook { notebook > header > tabs > tab button.flat:active, notebook > header > tabs > tab button.sidebar-button:active, notebook > header > tabs > tab button.flat:active:hover, notebook > header > tabs > tab button.sidebar-button:active:hover { color: #5294E2; } -* { - -GtkScrollbar-has-backward-stepper: false; - -GtkScrollbar-has-forward-stepper: false; } - -scrollbar button, -.scrollbar button { - border: none; } - -scrollbar.vertical button.down, -.scrollbar.vertical button.down { - -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } - -scrollbar.vertical button.up, -.scrollbar.vertical button.up { - -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } - -scrollbar.horizontal button.down, -.scrollbar.horizontal button.down { - -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } - -scrollbar.horizontal button.up, -.scrollbar.horizontal button.up { - -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } - -scrollbar.overlay-indicator:not(.dragging):not(.hovering), -.scrollbar.overlay-indicator:not(.dragging):not(.hovering) { - opacity: 0.4; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { - margin: 0; - background-color: #a5abb5; - border: 1px solid rgba(0, 0, 0, 0.3); - background-clip: padding-box; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough { - border-style: none; - background-color: transparent; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { - min-width: 4px; - margin-top: 2px; - margin-bottom: 2px; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { - min-height: 4px; - margin-left: 2px; - margin-right: 2px; } - -scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering, -.scrollbar.overlay-indicator.dragging, -.scrollbar.overlay-indicator.hovering { - opacity: 0.99; } - -scrollbar trough, -.scrollbar trough { +scrollbar { background-color: #3e434f; - border: 1px none #2b2e39; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - background-color: #767b87; } - scrollbar slider:hover, - scrollbar .slider:hover, - .scrollbar slider:hover, - .scrollbar .slider:hover { - background-color: #676b78; } - scrollbar slider:hover:active, - scrollbar .slider:hover:active, - .scrollbar slider:hover:active, - .scrollbar .slider:hover:active { - background-color: #5294E2; } - scrollbar slider:disabled, - scrollbar .slider:disabled, - .scrollbar slider:disabled, - .scrollbar .slider:disabled { + transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); } + * { + -GtkScrollbar-has-backward-stepper: false; + -GtkScrollbar-has-forward-stepper: false; } + scrollbar.top { + border-bottom: 1px solid #2b2e39; } + scrollbar.bottom { + border-top: 1px solid #2b2e39; } + scrollbar.left { + border-right: 1px solid #2b2e39; } + scrollbar.right { + border-left: 1px solid #2b2e39; } + scrollbar button { + border: none; } + scrollbar.vertical button.down { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } + scrollbar.vertical button.up { + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } + scrollbar.horizontal button.down { + -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } + scrollbar.horizontal button.up { + -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } + scrollbar slider { + min-width: 6px; + min-height: 6px; + margin: -1px; + border: 4px solid transparent; + border-radius: 8px; + background-clip: padding-box; + background-color: #767b87; } + scrollbar slider:hover { + background-color: #676b78; } + scrollbar slider:hover:active { + background-color: #5294E2; } + scrollbar slider:disabled { + background-color: transparent; } + scrollbar.fine-tune slider { + min-width: 4px; + min-height: 4px; } + scrollbar.fine-tune.horizontal slider { + border-width: 5px 4px; } + scrollbar.fine-tune.vertical slider { + border-width: 4px 5px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) { + opacity: 0.4; + border-color: transparent; background-color: transparent; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - border-radius: 100px; - margin: 3px; } - -scrollbar.vertical.fine-tune slider, -.scrollbar.vertical.fine-tune slider { - min-width: 4px; - margin: 4px; } - -scrollbar.vertical slider, -.scrollbar.vertical slider { - min-height: 42px; - min-width: 6px; - margin: 3px; } - -scrollbar.vertical trough:dir(ltr), -.scrollbar.vertical trough:dir(ltr) { - border-left-style: solid; } - -scrollbar.vertical trough:dir(rtl), -.scrollbar.vertical trough:dir(rtl) { - border-right-style: solid; } - -scrollbar.horizontal.fine-tune slider, -.scrollbar.horizontal.fine-tune slider { - min-height: 4px; - margin: 4px; } - -scrollbar.horizontal slider, -scrollbar.horizontal .slider, -.scrollbar.horizontal slider, -.scrollbar.horizontal .slider { - min-height: 6px; - min-width: 42px; - margin-top: 3px; } - -scrollbar.horizontal trough, -.scrollbar.horizontal trough { - border-top-style: solid; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { + margin: 0; + min-width: 4px; + min-height: 4px; + background-color: #a5abb5; + border: 1px solid rgba(0, 0, 0, 0.3); } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { + margin: 0 2px; + min-width: 40px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { + margin: 2px 0; + min-height: 40px; } + scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { + opacity: 0.99; } + scrollbar.horizontal slider { + min-width: 40px; } + scrollbar.vertical slider { + min-height: 40px; } switch { font: 1; @@ -3141,12 +3087,6 @@ modelbutton.flat:selected arrow, treeview.view:selected, treeview.view:selected: terminal-window notebook > header.top > tabs > tab:checked { box-shadow: inset 0 -1px #2b2e39; } -terminal-window scrollbar.vertical slider { - margin-left: 3px; } - -terminal-window scrollbar trough { - border-width: 0; } - terminal-window notebook > header.top { padding-top: 3px; box-shadow: inset 0 1px #262a33, inset 0 -1px #2b2e39; } diff --git a/common/gtk-3.0/3.20/gtk-darker.css b/common/gtk-3.0/3.20/gtk-darker.css index 83db1c3..e89f368 100644 --- a/common/gtk-3.0/3.20/gtk-darker.css +++ b/common/gtk-3.0/3.20/gtk-darker.css @@ -1778,127 +1778,73 @@ notebook { notebook > header > tabs > tab button.flat:active, notebook > header > tabs > tab button.sidebar-button:active, notebook > header > tabs > tab button.flat:active:hover, notebook > header > tabs > tab button.sidebar-button:active:hover { color: #5294E2; } -* { - -GtkScrollbar-has-backward-stepper: false; - -GtkScrollbar-has-forward-stepper: false; } - -scrollbar button, -.scrollbar button { - border: none; } - -scrollbar.vertical button.down, -.scrollbar.vertical button.down { - -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } - -scrollbar.vertical button.up, -.scrollbar.vertical button.up { - -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } - -scrollbar.horizontal button.down, -.scrollbar.horizontal button.down { - -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } - -scrollbar.horizontal button.up, -.scrollbar.horizontal button.up { - -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } - -scrollbar.overlay-indicator:not(.dragging):not(.hovering), -.scrollbar.overlay-indicator:not(.dragging):not(.hovering) { - opacity: 0.4; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { - margin: 0; - background-color: #8a8e96; - border: 1px solid rgba(255, 255, 255, 0.6); - background-clip: padding-box; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough { - border-style: none; - background-color: transparent; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { - min-width: 4px; - margin-top: 2px; - margin-bottom: 2px; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { - min-height: 4px; - margin-left: 2px; - margin-right: 2px; } - -scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering, -.scrollbar.overlay-indicator.dragging, -.scrollbar.overlay-indicator.hovering { - opacity: 0.99; } - -scrollbar trough, -.scrollbar trough { +scrollbar { background-color: #fcfcfc; - border: 1px none #dcdfe3; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - background-color: #b8babf; } - scrollbar slider:hover, - scrollbar .slider:hover, - .scrollbar slider:hover, - .scrollbar .slider:hover { - background-color: #c7c9cd; } - scrollbar slider:hover:active, - scrollbar .slider:hover:active, - .scrollbar slider:hover:active, - .scrollbar .slider:hover:active { - background-color: #5294E2; } - scrollbar slider:disabled, - scrollbar .slider:disabled, - .scrollbar slider:disabled, - .scrollbar .slider:disabled { + transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); } + * { + -GtkScrollbar-has-backward-stepper: false; + -GtkScrollbar-has-forward-stepper: false; } + scrollbar.top { + border-bottom: 1px solid #dcdfe3; } + scrollbar.bottom { + border-top: 1px solid #dcdfe3; } + scrollbar.left { + border-right: 1px solid #dcdfe3; } + scrollbar.right { + border-left: 1px solid #dcdfe3; } + scrollbar button { + border: none; } + scrollbar.vertical button.down { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } + scrollbar.vertical button.up { + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } + scrollbar.horizontal button.down { + -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } + scrollbar.horizontal button.up { + -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } + scrollbar slider { + min-width: 6px; + min-height: 6px; + margin: -1px; + border: 4px solid transparent; + border-radius: 8px; + background-clip: padding-box; + background-color: #b8babf; } + scrollbar slider:hover { + background-color: #c7c9cd; } + scrollbar slider:hover:active { + background-color: #5294E2; } + scrollbar slider:disabled { + background-color: transparent; } + scrollbar.fine-tune slider { + min-width: 4px; + min-height: 4px; } + scrollbar.fine-tune.horizontal slider { + border-width: 5px 4px; } + scrollbar.fine-tune.vertical slider { + border-width: 4px 5px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) { + opacity: 0.4; + border-color: transparent; background-color: transparent; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - border-radius: 100px; - margin: 3px; } - -scrollbar.vertical.fine-tune slider, -.scrollbar.vertical.fine-tune slider { - min-width: 4px; - margin: 4px; } - -scrollbar.vertical slider, -.scrollbar.vertical slider { - min-height: 42px; - min-width: 6px; - margin: 3px; } - -scrollbar.vertical trough:dir(ltr), -.scrollbar.vertical trough:dir(ltr) { - border-left-style: solid; } - -scrollbar.vertical trough:dir(rtl), -.scrollbar.vertical trough:dir(rtl) { - border-right-style: solid; } - -scrollbar.horizontal.fine-tune slider, -.scrollbar.horizontal.fine-tune slider { - min-height: 4px; - margin: 4px; } - -scrollbar.horizontal slider, -scrollbar.horizontal .slider, -.scrollbar.horizontal slider, -.scrollbar.horizontal .slider { - min-height: 6px; - min-width: 42px; - margin-top: 3px; } - -scrollbar.horizontal trough, -.scrollbar.horizontal trough { - border-top-style: solid; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { + margin: 0; + min-width: 4px; + min-height: 4px; + background-color: #8a8e96; + border: 1px solid rgba(255, 255, 255, 0.6); } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { + margin: 0 2px; + min-width: 40px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { + margin: 2px 0; + min-height: 40px; } + scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { + opacity: 0.99; } + scrollbar.horizontal slider { + min-width: 40px; } + scrollbar.vertical slider { + min-height: 40px; } switch { font: 1; @@ -3140,12 +3086,6 @@ modelbutton.flat:selected arrow, treeview.view:selected, treeview.view:selected: terminal-window notebook > header.top > tabs > tab:checked { box-shadow: inset 0 -1px #dcdfe3; } -terminal-window scrollbar.vertical slider { - margin-left: 3px; } - -terminal-window scrollbar trough { - border-width: 0; } - terminal-window notebook > header.top { padding-top: 3px; box-shadow: inset 0 1px #262a33, inset 0 -1px #dcdfe3; } diff --git a/common/gtk-3.0/3.20/gtk-solid-dark.css b/common/gtk-3.0/3.20/gtk-solid-dark.css index d320cae..af746a3 100644 --- a/common/gtk-3.0/3.20/gtk-solid-dark.css +++ b/common/gtk-3.0/3.20/gtk-solid-dark.css @@ -1779,127 +1779,73 @@ notebook { notebook > header > tabs > tab button.flat:active, notebook > header > tabs > tab button.sidebar-button:active, notebook > header > tabs > tab button.flat:active:hover, notebook > header > tabs > tab button.sidebar-button:active:hover { color: #5294E2; } -* { - -GtkScrollbar-has-backward-stepper: false; - -GtkScrollbar-has-forward-stepper: false; } - -scrollbar button, -.scrollbar button { - border: none; } - -scrollbar.vertical button.down, -.scrollbar.vertical button.down { - -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } - -scrollbar.vertical button.up, -.scrollbar.vertical button.up { - -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } - -scrollbar.horizontal button.down, -.scrollbar.horizontal button.down { - -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } - -scrollbar.horizontal button.up, -.scrollbar.horizontal button.up { - -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } - -scrollbar.overlay-indicator:not(.dragging):not(.hovering), -.scrollbar.overlay-indicator:not(.dragging):not(.hovering) { - opacity: 0.4; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { - margin: 0; - background-color: #a5abb5; - border: 1px solid rgba(0, 0, 0, 0.3); - background-clip: padding-box; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough { - border-style: none; - background-color: transparent; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { - min-width: 4px; - margin-top: 2px; - margin-bottom: 2px; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { - min-height: 4px; - margin-left: 2px; - margin-right: 2px; } - -scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering, -.scrollbar.overlay-indicator.dragging, -.scrollbar.overlay-indicator.hovering { - opacity: 0.99; } - -scrollbar trough, -.scrollbar trough { +scrollbar { background-color: #3e434f; - border: 1px none #2b2e39; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - background-color: #767b87; } - scrollbar slider:hover, - scrollbar .slider:hover, - .scrollbar slider:hover, - .scrollbar .slider:hover { - background-color: #676b78; } - scrollbar slider:hover:active, - scrollbar .slider:hover:active, - .scrollbar slider:hover:active, - .scrollbar .slider:hover:active { - background-color: #5294E2; } - scrollbar slider:disabled, - scrollbar .slider:disabled, - .scrollbar slider:disabled, - .scrollbar .slider:disabled { + transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); } + * { + -GtkScrollbar-has-backward-stepper: false; + -GtkScrollbar-has-forward-stepper: false; } + scrollbar.top { + border-bottom: 1px solid #2b2e39; } + scrollbar.bottom { + border-top: 1px solid #2b2e39; } + scrollbar.left { + border-right: 1px solid #2b2e39; } + scrollbar.right { + border-left: 1px solid #2b2e39; } + scrollbar button { + border: none; } + scrollbar.vertical button.down { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } + scrollbar.vertical button.up { + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } + scrollbar.horizontal button.down { + -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } + scrollbar.horizontal button.up { + -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } + scrollbar slider { + min-width: 6px; + min-height: 6px; + margin: -1px; + border: 4px solid transparent; + border-radius: 8px; + background-clip: padding-box; + background-color: #767b87; } + scrollbar slider:hover { + background-color: #676b78; } + scrollbar slider:hover:active { + background-color: #5294E2; } + scrollbar slider:disabled { + background-color: transparent; } + scrollbar.fine-tune slider { + min-width: 4px; + min-height: 4px; } + scrollbar.fine-tune.horizontal slider { + border-width: 5px 4px; } + scrollbar.fine-tune.vertical slider { + border-width: 4px 5px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) { + opacity: 0.4; + border-color: transparent; background-color: transparent; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - border-radius: 100px; - margin: 3px; } - -scrollbar.vertical.fine-tune slider, -.scrollbar.vertical.fine-tune slider { - min-width: 4px; - margin: 4px; } - -scrollbar.vertical slider, -.scrollbar.vertical slider { - min-height: 42px; - min-width: 6px; - margin: 3px; } - -scrollbar.vertical trough:dir(ltr), -.scrollbar.vertical trough:dir(ltr) { - border-left-style: solid; } - -scrollbar.vertical trough:dir(rtl), -.scrollbar.vertical trough:dir(rtl) { - border-right-style: solid; } - -scrollbar.horizontal.fine-tune slider, -.scrollbar.horizontal.fine-tune slider { - min-height: 4px; - margin: 4px; } - -scrollbar.horizontal slider, -scrollbar.horizontal .slider, -.scrollbar.horizontal slider, -.scrollbar.horizontal .slider { - min-height: 6px; - min-width: 42px; - margin-top: 3px; } - -scrollbar.horizontal trough, -.scrollbar.horizontal trough { - border-top-style: solid; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { + margin: 0; + min-width: 4px; + min-height: 4px; + background-color: #a5abb5; + border: 1px solid rgba(0, 0, 0, 0.3); } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { + margin: 0 2px; + min-width: 40px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { + margin: 2px 0; + min-height: 40px; } + scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { + opacity: 0.99; } + scrollbar.horizontal slider { + min-width: 40px; } + scrollbar.vertical slider { + min-height: 40px; } switch { font: 1; @@ -3141,12 +3087,6 @@ modelbutton.flat:selected arrow, treeview.view:selected, treeview.view:selected: terminal-window notebook > header.top > tabs > tab:checked { box-shadow: inset 0 -1px #2b2e39; } -terminal-window scrollbar.vertical slider { - margin-left: 3px; } - -terminal-window scrollbar trough { - border-width: 0; } - terminal-window notebook > header.top { padding-top: 3px; box-shadow: inset 0 1px #262a33, inset 0 -1px #2b2e39; } diff --git a/common/gtk-3.0/3.20/gtk-solid-darker.css b/common/gtk-3.0/3.20/gtk-solid-darker.css index 559549e..3651180 100644 --- a/common/gtk-3.0/3.20/gtk-solid-darker.css +++ b/common/gtk-3.0/3.20/gtk-solid-darker.css @@ -1778,127 +1778,73 @@ notebook { notebook > header > tabs > tab button.flat:active, notebook > header > tabs > tab button.sidebar-button:active, notebook > header > tabs > tab button.flat:active:hover, notebook > header > tabs > tab button.sidebar-button:active:hover { color: #5294E2; } -* { - -GtkScrollbar-has-backward-stepper: false; - -GtkScrollbar-has-forward-stepper: false; } - -scrollbar button, -.scrollbar button { - border: none; } - -scrollbar.vertical button.down, -.scrollbar.vertical button.down { - -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } - -scrollbar.vertical button.up, -.scrollbar.vertical button.up { - -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } - -scrollbar.horizontal button.down, -.scrollbar.horizontal button.down { - -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } - -scrollbar.horizontal button.up, -.scrollbar.horizontal button.up { - -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } - -scrollbar.overlay-indicator:not(.dragging):not(.hovering), -.scrollbar.overlay-indicator:not(.dragging):not(.hovering) { - opacity: 0.4; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { - margin: 0; - background-color: #8a8e96; - border: 1px solid rgba(255, 255, 255, 0.6); - background-clip: padding-box; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough { - border-style: none; - background-color: transparent; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { - min-width: 4px; - margin-top: 2px; - margin-bottom: 2px; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { - min-height: 4px; - margin-left: 2px; - margin-right: 2px; } - -scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering, -.scrollbar.overlay-indicator.dragging, -.scrollbar.overlay-indicator.hovering { - opacity: 0.99; } - -scrollbar trough, -.scrollbar trough { +scrollbar { background-color: #fcfcfc; - border: 1px none #dcdfe3; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - background-color: #b8babf; } - scrollbar slider:hover, - scrollbar .slider:hover, - .scrollbar slider:hover, - .scrollbar .slider:hover { - background-color: #c7c9cd; } - scrollbar slider:hover:active, - scrollbar .slider:hover:active, - .scrollbar slider:hover:active, - .scrollbar .slider:hover:active { - background-color: #5294E2; } - scrollbar slider:disabled, - scrollbar .slider:disabled, - .scrollbar slider:disabled, - .scrollbar .slider:disabled { + transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); } + * { + -GtkScrollbar-has-backward-stepper: false; + -GtkScrollbar-has-forward-stepper: false; } + scrollbar.top { + border-bottom: 1px solid #dcdfe3; } + scrollbar.bottom { + border-top: 1px solid #dcdfe3; } + scrollbar.left { + border-right: 1px solid #dcdfe3; } + scrollbar.right { + border-left: 1px solid #dcdfe3; } + scrollbar button { + border: none; } + scrollbar.vertical button.down { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } + scrollbar.vertical button.up { + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } + scrollbar.horizontal button.down { + -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } + scrollbar.horizontal button.up { + -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } + scrollbar slider { + min-width: 6px; + min-height: 6px; + margin: -1px; + border: 4px solid transparent; + border-radius: 8px; + background-clip: padding-box; + background-color: #b8babf; } + scrollbar slider:hover { + background-color: #c7c9cd; } + scrollbar slider:hover:active { + background-color: #5294E2; } + scrollbar slider:disabled { + background-color: transparent; } + scrollbar.fine-tune slider { + min-width: 4px; + min-height: 4px; } + scrollbar.fine-tune.horizontal slider { + border-width: 5px 4px; } + scrollbar.fine-tune.vertical slider { + border-width: 4px 5px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) { + opacity: 0.4; + border-color: transparent; background-color: transparent; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - border-radius: 100px; - margin: 3px; } - -scrollbar.vertical.fine-tune slider, -.scrollbar.vertical.fine-tune slider { - min-width: 4px; - margin: 4px; } - -scrollbar.vertical slider, -.scrollbar.vertical slider { - min-height: 42px; - min-width: 6px; - margin: 3px; } - -scrollbar.vertical trough:dir(ltr), -.scrollbar.vertical trough:dir(ltr) { - border-left-style: solid; } - -scrollbar.vertical trough:dir(rtl), -.scrollbar.vertical trough:dir(rtl) { - border-right-style: solid; } - -scrollbar.horizontal.fine-tune slider, -.scrollbar.horizontal.fine-tune slider { - min-height: 4px; - margin: 4px; } - -scrollbar.horizontal slider, -scrollbar.horizontal .slider, -.scrollbar.horizontal slider, -.scrollbar.horizontal .slider { - min-height: 6px; - min-width: 42px; - margin-top: 3px; } - -scrollbar.horizontal trough, -.scrollbar.horizontal trough { - border-top-style: solid; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { + margin: 0; + min-width: 4px; + min-height: 4px; + background-color: #8a8e96; + border: 1px solid rgba(255, 255, 255, 0.6); } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { + margin: 0 2px; + min-width: 40px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { + margin: 2px 0; + min-height: 40px; } + scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { + opacity: 0.99; } + scrollbar.horizontal slider { + min-width: 40px; } + scrollbar.vertical slider { + min-height: 40px; } switch { font: 1; @@ -3140,12 +3086,6 @@ modelbutton.flat:selected arrow, treeview.view:selected, treeview.view:selected: terminal-window notebook > header.top > tabs > tab:checked { box-shadow: inset 0 -1px #dcdfe3; } -terminal-window scrollbar.vertical slider { - margin-left: 3px; } - -terminal-window scrollbar trough { - border-width: 0; } - terminal-window notebook > header.top { padding-top: 3px; box-shadow: inset 0 1px #262a33, inset 0 -1px #dcdfe3; } diff --git a/common/gtk-3.0/3.20/gtk-solid.css b/common/gtk-3.0/3.20/gtk-solid.css index 353da1e..c16b3ba 100644 --- a/common/gtk-3.0/3.20/gtk-solid.css +++ b/common/gtk-3.0/3.20/gtk-solid.css @@ -1782,127 +1782,73 @@ notebook { notebook > header > tabs > tab button.flat:active, notebook > header > tabs > tab button.sidebar-button:active, notebook > header > tabs > tab button.flat:active:hover, notebook > header > tabs > tab button.sidebar-button:active:hover { color: #5294E2; } -* { - -GtkScrollbar-has-backward-stepper: false; - -GtkScrollbar-has-forward-stepper: false; } - -scrollbar button, -.scrollbar button { - border: none; } - -scrollbar.vertical button.down, -.scrollbar.vertical button.down { - -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } - -scrollbar.vertical button.up, -.scrollbar.vertical button.up { - -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } - -scrollbar.horizontal button.down, -.scrollbar.horizontal button.down { - -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } - -scrollbar.horizontal button.up, -.scrollbar.horizontal button.up { - -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } - -scrollbar.overlay-indicator:not(.dragging):not(.hovering), -.scrollbar.overlay-indicator:not(.dragging):not(.hovering) { - opacity: 0.4; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { - margin: 0; - background-color: #8a8e96; - border: 1px solid rgba(255, 255, 255, 0.6); - background-clip: padding-box; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough { - border-style: none; - background-color: transparent; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { - min-width: 4px; - margin-top: 2px; - margin-bottom: 2px; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { - min-height: 4px; - margin-left: 2px; - margin-right: 2px; } - -scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering, -.scrollbar.overlay-indicator.dragging, -.scrollbar.overlay-indicator.hovering { - opacity: 0.99; } - -scrollbar trough, -.scrollbar trough { +scrollbar { background-color: #fcfcfc; - border: 1px none #dcdfe3; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - background-color: #b8babf; } - scrollbar slider:hover, - scrollbar .slider:hover, - .scrollbar slider:hover, - .scrollbar .slider:hover { - background-color: #c7c9cd; } - scrollbar slider:hover:active, - scrollbar .slider:hover:active, - .scrollbar slider:hover:active, - .scrollbar .slider:hover:active { - background-color: #5294E2; } - scrollbar slider:disabled, - scrollbar .slider:disabled, - .scrollbar slider:disabled, - .scrollbar .slider:disabled { + transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); } + * { + -GtkScrollbar-has-backward-stepper: false; + -GtkScrollbar-has-forward-stepper: false; } + scrollbar.top { + border-bottom: 1px solid #dcdfe3; } + scrollbar.bottom { + border-top: 1px solid #dcdfe3; } + scrollbar.left { + border-right: 1px solid #dcdfe3; } + scrollbar.right { + border-left: 1px solid #dcdfe3; } + scrollbar button { + border: none; } + scrollbar.vertical button.down { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } + scrollbar.vertical button.up { + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } + scrollbar.horizontal button.down { + -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } + scrollbar.horizontal button.up { + -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } + scrollbar slider { + min-width: 6px; + min-height: 6px; + margin: -1px; + border: 4px solid transparent; + border-radius: 8px; + background-clip: padding-box; + background-color: #b8babf; } + scrollbar slider:hover { + background-color: #c7c9cd; } + scrollbar slider:hover:active { + background-color: #5294E2; } + scrollbar slider:disabled { + background-color: transparent; } + scrollbar.fine-tune slider { + min-width: 4px; + min-height: 4px; } + scrollbar.fine-tune.horizontal slider { + border-width: 5px 4px; } + scrollbar.fine-tune.vertical slider { + border-width: 4px 5px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) { + opacity: 0.4; + border-color: transparent; background-color: transparent; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - border-radius: 100px; - margin: 3px; } - -scrollbar.vertical.fine-tune slider, -.scrollbar.vertical.fine-tune slider { - min-width: 4px; - margin: 4px; } - -scrollbar.vertical slider, -.scrollbar.vertical slider { - min-height: 42px; - min-width: 6px; - margin: 3px; } - -scrollbar.vertical trough:dir(ltr), -.scrollbar.vertical trough:dir(ltr) { - border-left-style: solid; } - -scrollbar.vertical trough:dir(rtl), -.scrollbar.vertical trough:dir(rtl) { - border-right-style: solid; } - -scrollbar.horizontal.fine-tune slider, -.scrollbar.horizontal.fine-tune slider { - min-height: 4px; - margin: 4px; } - -scrollbar.horizontal slider, -scrollbar.horizontal .slider, -.scrollbar.horizontal slider, -.scrollbar.horizontal .slider { - min-height: 6px; - min-width: 42px; - margin-top: 3px; } - -scrollbar.horizontal trough, -.scrollbar.horizontal trough { - border-top-style: solid; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { + margin: 0; + min-width: 4px; + min-height: 4px; + background-color: #8a8e96; + border: 1px solid rgba(255, 255, 255, 0.6); } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { + margin: 0 2px; + min-width: 40px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { + margin: 2px 0; + min-height: 40px; } + scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { + opacity: 0.99; } + scrollbar.horizontal slider { + min-width: 40px; } + scrollbar.vertical slider { + min-height: 40px; } switch { font: 1; @@ -3144,12 +3090,6 @@ modelbutton.flat:selected arrow, treeview.view:selected, treeview.view:selected: terminal-window notebook > header.top > tabs > tab:checked { box-shadow: inset 0 -1px #dcdfe3; } -terminal-window scrollbar.vertical slider { - margin-left: 3px; } - -terminal-window scrollbar trough { - border-width: 0; } - terminal-window notebook > header.top { padding-top: 3px; box-shadow: inset 0 1px #d4d5db, inset 0 -1px #dcdfe3; } diff --git a/common/gtk-3.0/3.20/gtk.css b/common/gtk-3.0/3.20/gtk.css index 9776266..fafb64f 100644 --- a/common/gtk-3.0/3.20/gtk.css +++ b/common/gtk-3.0/3.20/gtk.css @@ -1782,127 +1782,73 @@ notebook { notebook > header > tabs > tab button.flat:active, notebook > header > tabs > tab button.sidebar-button:active, notebook > header > tabs > tab button.flat:active:hover, notebook > header > tabs > tab button.sidebar-button:active:hover { color: #5294E2; } -* { - -GtkScrollbar-has-backward-stepper: false; - -GtkScrollbar-has-forward-stepper: false; } - -scrollbar button, -.scrollbar button { - border: none; } - -scrollbar.vertical button.down, -.scrollbar.vertical button.down { - -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } - -scrollbar.vertical button.up, -.scrollbar.vertical button.up { - -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } - -scrollbar.horizontal button.down, -.scrollbar.horizontal button.down { - -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } - -scrollbar.horizontal button.up, -.scrollbar.horizontal button.up { - -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } - -scrollbar.overlay-indicator:not(.dragging):not(.hovering), -.scrollbar.overlay-indicator:not(.dragging):not(.hovering) { - opacity: 0.4; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { - margin: 0; - background-color: #8a8e96; - border: 1px solid rgba(255, 255, 255, 0.6); - background-clip: padding-box; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering) trough { - border-style: none; - background-color: transparent; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { - min-width: 4px; - margin-top: 2px; - margin-bottom: 2px; } - scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider, - .scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { - min-height: 4px; - margin-left: 2px; - margin-right: 2px; } - -scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering, -.scrollbar.overlay-indicator.dragging, -.scrollbar.overlay-indicator.hovering { - opacity: 0.99; } - -scrollbar trough, -.scrollbar trough { +scrollbar { background-color: #fcfcfc; - border: 1px none #dcdfe3; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - background-color: #b8babf; } - scrollbar slider:hover, - scrollbar .slider:hover, - .scrollbar slider:hover, - .scrollbar .slider:hover { - background-color: #c7c9cd; } - scrollbar slider:hover:active, - scrollbar .slider:hover:active, - .scrollbar slider:hover:active, - .scrollbar .slider:hover:active { - background-color: #5294E2; } - scrollbar slider:disabled, - scrollbar .slider:disabled, - .scrollbar slider:disabled, - .scrollbar .slider:disabled { + transition: 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); } + * { + -GtkScrollbar-has-backward-stepper: false; + -GtkScrollbar-has-forward-stepper: false; } + scrollbar.top { + border-bottom: 1px solid #dcdfe3; } + scrollbar.bottom { + border-top: 1px solid #dcdfe3; } + scrollbar.left { + border-right: 1px solid #dcdfe3; } + scrollbar.right { + border-left: 1px solid #dcdfe3; } + scrollbar button { + border: none; } + scrollbar.vertical button.down { + -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } + scrollbar.vertical button.up { + -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } + scrollbar.horizontal button.down { + -gtk-icon-source: -gtk-icontheme("pan-right-symbolic"); } + scrollbar.horizontal button.up { + -gtk-icon-source: -gtk-icontheme("pan-left-symbolic"); } + scrollbar slider { + min-width: 6px; + min-height: 6px; + margin: -1px; + border: 4px solid transparent; + border-radius: 8px; + background-clip: padding-box; + background-color: #b8babf; } + scrollbar slider:hover { + background-color: #c7c9cd; } + scrollbar slider:hover:active { + background-color: #5294E2; } + scrollbar slider:disabled { + background-color: transparent; } + scrollbar.fine-tune slider { + min-width: 4px; + min-height: 4px; } + scrollbar.fine-tune.horizontal slider { + border-width: 5px 4px; } + scrollbar.fine-tune.vertical slider { + border-width: 4px 5px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) { + opacity: 0.4; + border-color: transparent; background-color: transparent; } - -scrollbar slider, -scrollbar .slider, -.scrollbar slider, -.scrollbar .slider { - border-radius: 100px; - margin: 3px; } - -scrollbar.vertical.fine-tune slider, -.scrollbar.vertical.fine-tune slider { - min-width: 4px; - margin: 4px; } - -scrollbar.vertical slider, -.scrollbar.vertical slider { - min-height: 42px; - min-width: 6px; - margin: 3px; } - -scrollbar.vertical trough:dir(ltr), -.scrollbar.vertical trough:dir(ltr) { - border-left-style: solid; } - -scrollbar.vertical trough:dir(rtl), -.scrollbar.vertical trough:dir(rtl) { - border-right-style: solid; } - -scrollbar.horizontal.fine-tune slider, -.scrollbar.horizontal.fine-tune slider { - min-height: 4px; - margin: 4px; } - -scrollbar.horizontal slider, -scrollbar.horizontal .slider, -.scrollbar.horizontal slider, -.scrollbar.horizontal .slider { - min-height: 6px; - min-width: 42px; - margin-top: 3px; } - -scrollbar.horizontal trough, -.scrollbar.horizontal trough { - border-top-style: solid; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering) slider { + margin: 0; + min-width: 4px; + min-height: 4px; + background-color: #8a8e96; + border: 1px solid rgba(255, 255, 255, 0.6); } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).horizontal slider { + margin: 0 2px; + min-width: 40px; } + scrollbar.overlay-indicator:not(.dragging):not(.hovering).vertical slider { + margin: 2px 0; + min-height: 40px; } + scrollbar.overlay-indicator.dragging, scrollbar.overlay-indicator.hovering { + opacity: 0.99; } + scrollbar.horizontal slider { + min-width: 40px; } + scrollbar.vertical slider { + min-height: 40px; } switch { font: 1; @@ -3144,12 +3090,6 @@ modelbutton.flat:selected arrow, treeview.view:selected, treeview.view:selected: terminal-window notebook > header.top > tabs > tab:checked { box-shadow: inset 0 -1px #dcdfe3; } -terminal-window scrollbar.vertical slider { - margin-left: 3px; } - -terminal-window scrollbar trough { - border-width: 0; } - terminal-window notebook > header.top { padding-top: 3px; box-shadow: inset 0 1px #d4d5db, inset 0 -1px #dcdfe3; } diff --git a/common/gtk-3.0/3.20/sass/_applications.scss b/common/gtk-3.0/3.20/sass/_applications.scss index f7b9d54..c709235 100644 --- a/common/gtk-3.0/3.20/sass/_applications.scss +++ b/common/gtk-3.0/3.20/sass/_applications.scss @@ -11,12 +11,6 @@ terminal-window notebook { // terminal-window { - scrollbar { - &.vertical slider { margin-left: 3px; } - - trough { border-width: 0; } - } - notebook { > header.top { padding-top: 3px; diff --git a/common/gtk-3.0/3.20/sass/_common.scss b/common/gtk-3.0/3.20/sass/_common.scss index b024f0f..42c4211 100644 --- a/common/gtk-3.0/3.20/sass/_common.scss +++ b/common/gtk-3.0/3.20/sass/_common.scss @@ -1866,15 +1866,23 @@ notebook { // $_scrollbar_bg_color: darken($base_color, 1%); -scrollbar, -.scrollbar { +scrollbar { + $_slider_min_length: 40px; + + // disable steppers @at-root * { -GtkScrollbar-has-backward-stepper: false; -GtkScrollbar-has-forward-stepper: false; } - $_slider_margin: 3px; - $_slider_fine_tune_margin: 4px; + background-color: $_scrollbar_bg_color; + transition: 300ms $ease-out-quad; + + // scrollbar border + &.top { border-bottom: 1px solid $borders_color; } + &.bottom { border-top: 1px solid $borders_color; } + &.left { border-right: 1px solid $borders_color; } + &.right { border-left: 1px solid $borders_color; } button { border: none; } @@ -1888,32 +1896,55 @@ scrollbar, &.up { -gtk-icon-source: -gtk-icontheme('pan-left-symbolic'); } } + // slider + slider { + min-width: 6px; + min-height: 6px; + margin: -1px; + border: 4px solid transparent; + border-radius: 8px; + background-clip: padding-box; + background-color: mix($fg_color, $bg_color, 40%); + + &:hover { background-color: mix($fg_color, $bg_color, 30%); } + + &:hover:active { background-color: $selected_bg_color;} + + &:disabled { background-color: transparent; } + } + + &.fine-tune { + slider { + min-width: 4px; + min-height: 4px; + } + + &.horizontal slider { border-width: 5px 4px; } + &.vertical slider { border-width: 4px 5px; } + } + &.overlay-indicator { - &:not(.dragging):not(.hovering) { // Overlay scrolling indicator + &:not(.dragging):not(.hovering) { opacity: 0.4; + border-color: transparent; + background-color: transparent; slider { margin: 0; + min-width: 4px; + min-height: 4px; background-color: mix($fg_color, $bg_color, 70%); border: 1px solid if($variant == 'light', transparentize(white, 0.4), transparentize(black, 0.7)); - background-clip: padding-box; - } - - trough { - border-style: none; - background-color: transparent; - } - - &.vertical slider { - min-width: 4px; - margin-top: $_slider_margin - 1px; - margin-bottom: $_slider_margin - 1px; } &.horizontal slider { - min-height: 4px; - margin-left: $_slider_margin - 1px; - margin-right: $_slider_margin - 1px; + margin: 0 2px; + min-width: $_slider_min_length; + } + + &.vertical slider { + margin: 2px 0; + min-height: $_slider_min_length; } } @@ -1921,68 +1952,8 @@ scrollbar, &.hovering { opacity: 0.99; } } - // trough coloring - trough { - background-color: $_scrollbar_bg_color; - border: 1px none $borders_color; - } - - // slider coloring - slider, - .slider { - background-color: mix($fg_color, $bg_color, 40%); - - &:hover { background-color: mix($fg_color, $bg_color, 30%); } - - &:hover:active { background-color: $selected_bg_color;} - - &:disabled { - background-color: transparent; - } - } - - // sizing - slider, - .slider { - border-radius: 100px; - margin: $_slider_margin; - } - - &.vertical { - - &.fine-tune slider { - min-width: 4px; - margin: $_slider_fine_tune_margin; - } - - slider { - min-height: 42px; - min-width: 6px; - margin: $_slider_margin; - } - - trough { - &:dir(ltr) { border-left-style: solid; } - &:dir(rtl) { border-right-style: solid; } - } - } - - &.horizontal { - - &.fine-tune slider { - min-height: 4px; - margin: $_slider_fine_tune_margin; - } - - slider, - .slider { - min-height: 6px; - min-width: 42px; - margin-top: $_slider_margin; - } - - trough { border-top-style: solid; } - } + &.horizontal slider { min-width: $_slider_min_length; } + &.vertical slider { min-height: $_slider_min_length; } } //