mirror of
https://git.disroot.org/eudaimon/Simplewaita.git
synced 2026-03-10 04:21:07 +00:00
Improved sliders with marks, sliders in fine-tune
This commit is contained in:
Eudaimon
parent
36a201343b
commit
5a0ce409d8
9 changed files with 313 additions and 493 deletions
|
|
@ -1135,15 +1135,7 @@ scale { min-height: 10px; min-width: 10px; padding: 12px; }
|
||||||
|
|
||||||
scale fill, scale highlight { margin: -1px; }
|
scale fill, scale highlight { margin: -1px; }
|
||||||
|
|
||||||
scale slider { min-height: 18px; min-width: 18px; margin: -9px; }
|
scale.fine-tune slider, scale.fine-tune slider:active, scale.fine-tune slider:hover, scale.fine-tune slider:focus { background-color: #6789b4; }
|
||||||
|
|
||||||
scale.fine-tune.horizontal { padding-top: 9px; padding-bottom: 9px; min-height: 16px; }
|
|
||||||
|
|
||||||
scale.fine-tune.vertical { padding-left: 9px; padding-right: 9px; min-width: 16px; }
|
|
||||||
|
|
||||||
scale.fine-tune slider { margin: -6px; }
|
|
||||||
|
|
||||||
scale.fine-tune fill, scale.fine-tune highlight, scale.fine-tune trough { border-radius: 5px; -gtk-outline-radius: 7px; }
|
|
||||||
|
|
||||||
scale trough { outline-offset: 2px; -gtk-outline-radius: 5px; }
|
scale trough { outline-offset: 2px; -gtk-outline-radius: 5px; }
|
||||||
|
|
||||||
|
|
@ -1155,7 +1147,7 @@ scale fill:disabled:backdrop, scale fill:disabled { border-color: transparent; b
|
||||||
|
|
||||||
.osd scale fill:disabled:backdrop, .osd scale fill:disabled { border-color: transparent; background-color: transparent; }
|
.osd scale fill:disabled:backdrop, .osd scale fill:disabled { border-color: transparent; background-color: transparent; }
|
||||||
|
|
||||||
scale slider { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.4); border: 1px solid #626262; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; }
|
scale slider { min-height: 18px; min-width: 18px; margin: -9px; color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.4); border: 1px solid #626262; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; }
|
||||||
|
|
||||||
scale slider:hover { background-color: shade(#bcbeb9, 1.1); }
|
scale slider:hover { background-color: shade(#bcbeb9, 1.1); }
|
||||||
|
|
||||||
|
|
@ -1183,35 +1175,23 @@ scale marks, scale value { color: alpha(currentColor,0.55); font-feature-setting
|
||||||
|
|
||||||
scale.horizontal marks.top { margin-bottom: 6px; margin-top: -12px; }
|
scale.horizontal marks.top { margin-bottom: 6px; margin-top: -12px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune marks.top { margin-bottom: 6px; margin-top: -9px; }
|
|
||||||
|
|
||||||
scale.horizontal marks.bottom { margin-top: 6px; margin-bottom: -12px; }
|
scale.horizontal marks.bottom { margin-top: 6px; margin-bottom: -12px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune marks.bottom { margin-top: 6px; margin-bottom: -9px; }
|
|
||||||
|
|
||||||
scale.vertical marks.top { margin-right: 6px; margin-left: -12px; }
|
scale.vertical marks.top { margin-right: 6px; margin-left: -12px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune marks.top { margin-right: 6px; margin-left: -9px; }
|
|
||||||
|
|
||||||
scale.vertical marks.bottom { margin-left: 6px; margin-right: -12px; }
|
scale.vertical marks.bottom { margin-left: 6px; margin-right: -12px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune marks.bottom { margin-left: 6px; margin-right: -9px; }
|
|
||||||
|
|
||||||
scale.horizontal indicator { min-height: 6px; min-width: 1px; }
|
scale.horizontal indicator { min-height: 6px; min-width: 1px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune indicator { min-height: 3px; }
|
scale.horizontal.marks-after slider { border-radius: 5px 5px 100% 100%; min-width: 10px; padding: 0; margin-right: 5px; margin-left: 5px; }
|
||||||
|
|
||||||
scale.horizontal.marks-after slider { border-radius: 5px 5px 100% 100%; }
|
scale.horizontal.marks-before slider { border-radius: 100% 100% 5px 5px; min-width: 10px; padding: 0; margin-right: 5px; margin-left: 5px; }
|
||||||
|
|
||||||
scale.horizontal.marks-before slider { border-radius: 100% 100% 5px 5px; }
|
|
||||||
|
|
||||||
scale.vertical indicator { min-height: 1px; min-width: 6px; }
|
scale.vertical indicator { min-height: 1px; min-width: 6px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune indicator { min-width: 3px; }
|
scale.vertical.marks-after slider { border-radius: 5px 100% 100% 5px; min-height: 10px; padding: 0; margin-top: 5px; margin-bottom: 5px; }
|
||||||
|
|
||||||
scale.vertical.marks-after slider { border-radius: 5px 100% 100% 5px; }
|
scale.vertical.marks-before slider { border-radius: 100% 5px 5px 100%; min-height: 10px; padding: 0; margin-top: 5px; margin-bottom: 5px; }
|
||||||
|
|
||||||
scale.vertical.marks-before slider { border-radius: 100% 5px 5px 100%; }
|
|
||||||
|
|
||||||
scale.color { min-height: 0; min-width: 0; }
|
scale.color { min-height: 0; min-width: 0; }
|
||||||
|
|
||||||
|
|
@ -1235,24 +1215,6 @@ scale.color.vertical:dir(rtl) trough { padding-right: 4px; background-position:
|
||||||
|
|
||||||
scale.color.vertical:dir(rtl) slider:hover, scale.color.vertical:dir(rtl) slider:backdrop, scale.color.vertical:dir(rtl) slider:disabled, scale.color.vertical:dir(rtl) slider:backdrop:disabled, scale.color.vertical:dir(rtl) slider { margin-right: -15px; margin-left: 6px; }
|
scale.color.vertical:dir(rtl) slider:hover, scale.color.vertical:dir(rtl) slider:backdrop, scale.color.vertical:dir(rtl) slider:disabled, scale.color.vertical:dir(rtl) slider:backdrop:disabled, scale.color.vertical:dir(rtl) slider { margin-right: -15px; margin-left: 6px; }
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr), scale.color.fine-tune.horizontal:dir(rtl) { padding: 0 0 12px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr) trough, scale.color.fine-tune.horizontal:dir(rtl) trough { padding-bottom: 7px; background-position: 0 -6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr) slider, scale.color.fine-tune.horizontal:dir(rtl) slider { margin-bottom: -15px; margin-top: 6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) { padding: 0 0 0 12px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) trough { padding-left: 7px; background-position: 6px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) slider { margin-left: -15px; margin-right: 6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) { padding: 0 12px 0 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) trough { padding-right: 7px; background-position: -6px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) slider { margin-right: -15px; margin-left: 6px; }
|
|
||||||
|
|
||||||
/***************** Progress bars * */
|
/***************** Progress bars * */
|
||||||
progressbar { font-size: smaller; color: rgba(36, 31, 49, 0.4); font-feature-settings: "tnum"; }
|
progressbar { font-size: smaller; color: rgba(36, 31, 49, 0.4); font-feature-settings: "tnum"; }
|
||||||
|
|
||||||
|
|
@ -1580,13 +1542,13 @@ infobar.info selection, infobar.question selection, infobar.warning selection, i
|
||||||
infobar.info *:link, infobar.question *:link, infobar.warning *:link, infobar.error *:link { color: #004B91; }
|
infobar.info *:link, infobar.question *:link, infobar.warning *:link, infobar.error *:link { color: #004B91; }
|
||||||
|
|
||||||
/************ Tooltips * */
|
/************ Tooltips * */
|
||||||
tooltip { padding: 4px; /* not working */ border-radius: 5px; text-shadow: none; }
|
tooltip { border-radius: 5px; text-shadow: none; }
|
||||||
|
|
||||||
tooltip.background { background-color: rgba(103, 137, 180, 0.8); background-clip: padding-box; border: 1px solid #002269; }
|
tooltip.background { background-color: rgba(103, 137, 180, 0.9); background-clip: padding-box; border: 1px solid #002269; }
|
||||||
|
|
||||||
tooltip decoration { background-color: transparent; }
|
tooltip decoration { background-color: transparent; }
|
||||||
|
|
||||||
tooltip * { padding: 4px; background-color: transparent; color: #002269; }
|
tooltip * { background-color: transparent; color: #002269; }
|
||||||
|
|
||||||
/***************** Color Chooser * */
|
/***************** Color Chooser * */
|
||||||
colorswatch:drop(active), colorswatch { border-style: none; }
|
colorswatch:drop(active), colorswatch { border-style: none; }
|
||||||
|
|
@ -1675,7 +1637,7 @@ decoration:backdrop { box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(
|
||||||
|
|
||||||
.maximized decoration, .fullscreen decoration { border-radius: 0; box-shadow: none; }
|
.maximized decoration, .fullscreen decoration { border-radius: 0; box-shadow: none; }
|
||||||
|
|
||||||
.tiled decoration, .tiled-top decoration, .tiled-right decoration, .tiled-bottom decoration, .tiled-left decoration { border-radius: 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 20px transparent; }
|
.tiled decoration, .tiled-top decoration, .tiled-right decoration, .tiled-bottom decoration, .tiled-left decoration { border-radius: 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.7), 0 0 0 20px transparent; }
|
||||||
|
|
||||||
.tiled decoration:backdrop, .tiled-top decoration:backdrop, .tiled-right decoration:backdrop, .tiled-bottom decoration:backdrop, .tiled-left decoration:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.4), 0 0 0 20px transparent; }
|
.tiled decoration:backdrop, .tiled-top decoration:backdrop, .tiled-right decoration:backdrop, .tiled-bottom decoration:backdrop, .tiled-left decoration:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.4), 0 0 0 20px transparent; }
|
||||||
|
|
||||||
|
|
@ -1687,13 +1649,13 @@ decoration:backdrop { box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(
|
||||||
|
|
||||||
.csd.popup decoration { border-radius: 5px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
.csd.popup decoration { border-radius: 5px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
||||||
|
|
||||||
tooltip.csd decoration { border-radius: 5px; box-shadow: none; }
|
tooltip.csd decoration { border-radius: 5px; box-shadow: 0 3px 4px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
messagedialog.csd decoration { border-radius: 8px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
messagedialog.csd decoration { border-radius: 8px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
||||||
|
|
||||||
.solid-csd decoration { margin: 0; padding: 4px; background-color: #797979; border: solid 1px #797979; border-radius: 0; box-shadow: inset 0 0 0 3px #b4b4b4, inset 0 1px rgba(255, 255, 255, 0.8), 0 1px 5px rgba(0, 0, 0, 0.2); }
|
.solid-csd decoration { margin: 0; padding: 4px; background-color: #797979; border: solid 1px #797979; border-radius: 0; box-shadow: inset 0 0 0 3px #b4b4b4, inset 0 1px rgba(255, 255, 255, 0.8), 0 3px 5px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
.solid-csd decoration:backdrop { box-shadow: inset 0 0 0 3px #a7a7a7, inset 0 1px rgba(255, 255, 255, 0.8), 0 1px 5px rgba(0, 0, 0, 0.2); }
|
.solid-csd decoration:backdrop { box-shadow: inset 0 0 0 3px #a7a7a7, inset 0 1px rgba(255, 255, 255, 0.8), 0 3px 5px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
button.titlebutton { text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); }
|
button.titlebutton { text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); }
|
||||||
|
|
||||||
|
|
@ -1710,25 +1672,18 @@ button.titlebutton:backdrop { -gtk-icon-shadow: none; }
|
||||||
.monospace { font-family: monospace; }
|
.monospace { font-family: monospace; }
|
||||||
|
|
||||||
/********************** Touch Copy & Paste * */
|
/********************** Touch Copy & Paste * */
|
||||||
cursor-handle { background-color: transparent; background-image: none; box-shadow: none; border-style: none; }
|
/********************** Touch Copy & Paste * */
|
||||||
|
cursor-handle { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); border: 1px solid #626262; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; min-height: 18px; min-width: 10px; }
|
||||||
|
|
||||||
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start.png"), url("assets/text-select-start@2.png")); padding-left: 10px; }
|
cursor-handle:hover { background-color: shade(#bcbeb9, 1.1); }
|
||||||
|
|
||||||
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end.png"), url("assets/text-select-end@2.png")); padding-right: 10px; }
|
cursor-handle:active { border-color: #8bcd41; }
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above.png"), url("assets/slider-horz-scale-has-marks-above@2.png")); }
|
cursor-handle:disabled { color: #552222; background-color: #938989; background-image: none; }
|
||||||
|
|
||||||
cursor-handle.top:hover:dir(ltr), cursor-handle.bottom:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start-hover.png"), url("assets/text-select-start-hover@2.png")); padding-left: 10px; }
|
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) { border-radius: 100% 5px 5px 5px; }
|
||||||
|
|
||||||
cursor-handle.bottom:hover:dir(ltr), cursor-handle.top:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end-hover.png"), url("assets/text-select-end-hover@2.png")); padding-right: 10px; }
|
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) { border-radius: 5px 100% 5px 5px; }
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:hover:dir(ltr), cursor-handle.insertion-cursor:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-hover.png"), url("assets/slider-horz-scale-has-marks-above-hover@2.png")); }
|
|
||||||
|
|
||||||
cursor-handle.top:active:dir(ltr), cursor-handle.bottom:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start-active.png"), url("assets/text-select-start-active@2.png")); padding-left: 10px; }
|
|
||||||
|
|
||||||
cursor-handle.bottom:active:dir(ltr), cursor-handle.top:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end-active.png"), url("assets/text-select-end-active@2.png")); padding-right: 10px; }
|
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:active:dir(ltr), cursor-handle.insertion-cursor:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-active.png"), url("assets/slider-horz-scale-has-marks-above-active@2.png")); }
|
|
||||||
|
|
||||||
.context-menu { font: initial; }
|
.context-menu { font: initial; }
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1024,15 +1024,7 @@ scale > trough { transition: outline-width 200ms cubic-bezier(0.25, 0.46, 0.45,
|
||||||
|
|
||||||
scale > trough > fill, scale > trough > highlight { margin: -1px; }
|
scale > trough > fill, scale > trough > highlight { margin: -1px; }
|
||||||
|
|
||||||
scale > trough > slider { min-height: 18px; min-width: 18px; margin: -9px; }
|
scale.fine-tune > trough > slider, scale.fine-tune > trough > slider:active, scale.fine-tune > trough > slider:hover, scale.fine-tune > trough > slider:focus { background-color: #6789b4; }
|
||||||
|
|
||||||
scale.fine-tune.horizontal { padding-top: 9px; padding-bottom: 9px; min-height: 16px; }
|
|
||||||
|
|
||||||
scale.fine-tune.vertical { padding-left: 9px; padding-right: 9px; min-width: 16px; }
|
|
||||||
|
|
||||||
scale.fine-tune > trough > slider { margin: -6px; }
|
|
||||||
|
|
||||||
scale.fine-tune > trough > fill, scale.fine-tune > trough > highlight, scale.fine-tune > trough { border-radius: 5px; }
|
|
||||||
|
|
||||||
scale > trough > fill:disabled { border-color: transparent; background-color: transparent; }
|
scale > trough > fill:disabled { border-color: transparent; background-color: transparent; }
|
||||||
|
|
||||||
|
|
@ -1040,7 +1032,7 @@ scale > trough > fill:disabled { border-color: transparent; background-color: tr
|
||||||
|
|
||||||
.osd scale > trough > fill:disabled { border-color: transparent; background-color: transparent; }
|
.osd scale > trough > fill:disabled { border-color: transparent; background-color: transparent; }
|
||||||
|
|
||||||
scale > trough > slider { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); border-width: 1px; border-style: solid; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; }
|
scale > trough > slider { min-height: 18px; min-width: 18px; margin: -9px; color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); border-width: 1px; border-style: solid; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; }
|
||||||
|
|
||||||
scale > trough > slider:hover { background-color: shade(#bcbeb9, 1.1); }
|
scale > trough > slider:hover { background-color: shade(#bcbeb9, 1.1); }
|
||||||
|
|
||||||
|
|
@ -1072,15 +1064,9 @@ scale.horizontal > value.left { margin-right: 9px; }
|
||||||
|
|
||||||
scale.horizontal > value.right { margin-left: 9px; }
|
scale.horizontal > value.right { margin-left: 9px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune > marks.top { margin-top: 3px; }
|
scale.horizontal.marks-after slider { border-radius: 5px 5px 100% 100%; min-width: 10px; padding: 0; margin-right: 5px; margin-left: 5px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune > marks.bottom { margin-bottom: 3px; }
|
scale.horizontal.marks-before slider { border-radius: 100% 100% 5px 5px; min-width: 10px; padding: 0; margin-right: 5px; margin-left: 5px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune > marks indicator { min-height: 3px; }
|
|
||||||
|
|
||||||
scale.horizontal.marks-after slider { border-radius: 5px 5px 100% 100%; }
|
|
||||||
|
|
||||||
scale.horizontal.marks-before slider { border-radius: 100% 100% 5px 5px; }
|
|
||||||
|
|
||||||
scale.vertical > marks { color: alpha(currentColor,0.55); }
|
scale.vertical > marks { color: alpha(currentColor,0.55); }
|
||||||
|
|
||||||
|
|
@ -1094,15 +1080,9 @@ scale.vertical > value.top { margin-bottom: 9px; }
|
||||||
|
|
||||||
scale.vertical > value.bottom { margin-top: 9px; }
|
scale.vertical > value.bottom { margin-top: 9px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune > marks.top { margin-left: 3px; }
|
scale.vertical.marks-after slider { border-radius: 5px 100% 100% 5px; min-height: 10px; padding: 0; margin-top: 54px; margin-bottom: 5px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune > marks.bottom { margin-right: 3px; }
|
scale.vertical.marks-before slider { border-radius: 100% 5px 5px 100%; min-height: 10px; padding: 0; margin-top: 5px; margin-bottom: 5px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune > marks indicator { min-height: 3px; }
|
|
||||||
|
|
||||||
scale.vertical.marks-after slider { border-radius: 5px 100% 100% 5px; }
|
|
||||||
|
|
||||||
scale.vertical.marks-before slider { border-radius: 100% 5px 5px 100%; }
|
|
||||||
|
|
||||||
scale.color { min-height: 0; min-width: 0; }
|
scale.color { min-height: 0; min-width: 0; }
|
||||||
|
|
||||||
|
|
@ -1126,24 +1106,6 @@ scale.color.vertical:dir(rtl) > trough { padding-right: 4px; background-position
|
||||||
|
|
||||||
scale.color.vertical:dir(rtl) > trough > slider:hover, scale.color.vertical:dir(rtl) > trough > slider:backdrop, scale.color.vertical:dir(rtl) > trough > slider:disabled, scale.color.vertical:dir(rtl) > trough > slider:backdrop:disabled, scale.color.vertical:dir(rtl) > trough > slider { margin-right: -15px; margin-left: 6px; }
|
scale.color.vertical:dir(rtl) > trough > slider:hover, scale.color.vertical:dir(rtl) > trough > slider:backdrop, scale.color.vertical:dir(rtl) > trough > slider:disabled, scale.color.vertical:dir(rtl) > trough > slider:backdrop:disabled, scale.color.vertical:dir(rtl) > trough > slider { margin-right: -15px; margin-left: 6px; }
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr), scale.color.fine-tune.horizontal:dir(rtl) { padding: 0 0 12px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr) > trough, scale.color.fine-tune.horizontal:dir(rtl) > trough { padding-bottom: 7px; background-position: 0 -6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr) > trough > slider, scale.color.fine-tune.horizontal:dir(rtl) > trough > slider { margin-bottom: -15px; margin-top: 6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) { padding: 0 0 0 12px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) > trough { padding-left: 7px; background-position: 6px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) > trough > slider { margin-left: -15px; margin-right: 6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) { padding: 0 12px 0 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) > trough { padding-right: 7px; background-position: -6px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) > trough > slider { margin-right: -15px; margin-left: 6px; }
|
|
||||||
|
|
||||||
/***************** Progress bars * */
|
/***************** Progress bars * */
|
||||||
progressbar { font-size: smaller; color: rgba(36, 31, 49, 0.4); font-feature-settings: "tnum"; }
|
progressbar { font-size: smaller; color: rgba(36, 31, 49, 0.4); font-feature-settings: "tnum"; }
|
||||||
|
|
||||||
|
|
@ -1483,9 +1445,9 @@ video { background: black; }
|
||||||
video image.osd { min-width: 64px; min-height: 64px; border-radius: 32px; }
|
video image.osd { min-width: 64px; min-height: 64px; border-radius: 32px; }
|
||||||
|
|
||||||
/************ Tooltips * */
|
/************ Tooltips * */
|
||||||
tooltip { padding: 6px 10px; border-radius: 8px; box-shadow: none; }
|
tooltip { padding: 6px 10px; border-radius: 8px; }
|
||||||
|
|
||||||
tooltip.background { background-color: rgba(103, 137, 180, 0.8); background-clip: padding-box; border: 1px solid #002269; color: #002269; }
|
tooltip.background { background-color: rgba(103, 137, 180, 0.9); background-clip: padding-box; border: 1px solid #002269; color: #002269; }
|
||||||
|
|
||||||
tooltip > box { border-spacing: 6px; }
|
tooltip > box { border-spacing: 6px; }
|
||||||
|
|
||||||
|
|
@ -1584,13 +1546,13 @@ window.csd.popup { border-radius: 5px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2),
|
||||||
|
|
||||||
window.csd.dialog.message { border-radius: 8px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
window.csd.dialog.message { border-radius: 8px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
||||||
|
|
||||||
window.solid-csd { margin: 0; padding: 4px; border: solid 1px #797979; border-radius: 0; box-shadow: inset 0 0 0 4px #797979, inset 0 0 0 3px #b4b4b4, inset 0 1px rgba(255, 255, 255, 0.8), 0 1px 5px rgba(0, 0, 0, 0.2); }
|
window.solid-csd { margin: 0; padding: 4px; border: solid 1px #797979; border-radius: 0; box-shadow: inset 0 0 0 4px #797979, inset 0 0 0 3px #b4b4b4, inset 0 1px rgba(255, 255, 255, 0.8), 0 3px 5px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
window.solid-csd:backdrop { box-shadow: inset 0 0 0 4px #797979, inset 0 0 0 3px #a7a7a7, inset 0 1px rgba(255, 255, 255, 0.8), 0 1px 5px rgba(0, 0, 0, 0.2); }
|
window.solid-csd:backdrop { box-shadow: inset 0 0 0 4px #797979, inset 0 0 0 3px #a7a7a7, inset 0 1px rgba(255, 255, 255, 0.8), 0 3px 5px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
window.maximized, window.fullscreen { border-radius: 0; box-shadow: none; }
|
window.maximized, window.fullscreen { border-radius: 0; box-shadow: none; }
|
||||||
|
|
||||||
window.tiled, window.tiled-top, window.tiled-left, window.tiled-right, window.tiled-bottom { border-radius: 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.23), 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 20px transparent; }
|
window.tiled, window.tiled-top, window.tiled-left, window.tiled-right, window.tiled-bottom { border-radius: 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.23), 0 2px 6px 2px rgba(0, 0, 0, 0.7), 0 0 0 20px transparent; }
|
||||||
|
|
||||||
window.tiled:backdrop, window.tiled-top:backdrop, window.tiled-left:backdrop, window.tiled-right:backdrop, window.tiled-bottom:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.4), 0 0 0 20px transparent; }
|
window.tiled:backdrop, window.tiled-top:backdrop, window.tiled-left:backdrop, window.tiled-right:backdrop, window.tiled-bottom:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.4), 0 0 0 20px transparent; }
|
||||||
|
|
||||||
|
|
@ -1598,30 +1560,23 @@ window.popup { box-shadow: none; }
|
||||||
|
|
||||||
window.ssd { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.23); }
|
window.ssd { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.23); }
|
||||||
|
|
||||||
tooltip.csd { border-radius: 5px; box-shadow: none; }
|
tooltip.csd { border-radius: 5px; box-shadow: 0 3px 4px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
.monospace { font-family: monospace; }
|
.monospace { font-family: monospace; }
|
||||||
|
|
||||||
/********************** Touch Copy & Paste * */
|
/********************** Touch Copy & Paste * */
|
||||||
cursor-handle { background-color: transparent; background-image: none; box-shadow: none; border-style: none; min-width: 20px; min-height: 24px; padding-left: 20px; padding-right: 20px; padding-top: 24px; padding-bottom: 24px; }
|
/********************** Touch Copy & Paste * */
|
||||||
|
cursor-handle { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); border: 1px solid #626262; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; min-height: 18px; min-width: 10px; }
|
||||||
|
|
||||||
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start.png"), url("assets/text-select-start@2.png")); }
|
cursor-handle:hover { background-color: shade(#bcbeb9, 1.1); }
|
||||||
|
|
||||||
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end.png"), url("assets/text-select-end@2.png")); }
|
cursor-handle:active { border-color: #8bcd41; }
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above.png"), url("assets/slider-horz-scale-has-marks-above@2.png")); }
|
cursor-handle:disabled { color: #552222; background-color: #938989; background-image: none; }
|
||||||
|
|
||||||
cursor-handle.top:hover:dir(ltr), cursor-handle.bottom:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start-hover.png"), url("assets/text-select-start-hover@2.png")); }
|
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) { border-radius: 100% 5px 5px 5px; }
|
||||||
|
|
||||||
cursor-handle.bottom:hover:dir(ltr), cursor-handle.top:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end-hover.png"), url("assets/text-select-end-hover@2.png")); }
|
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) { border-radius: 5px 100% 5px 5px; }
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:hover:dir(ltr), cursor-handle.insertion-cursor:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-hover.png"), url("assets/slider-horz-scale-has-marks-above-hover@2.png")); }
|
|
||||||
|
|
||||||
cursor-handle.top:active:dir(ltr), cursor-handle.bottom:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start-active.png"), url("assets/text-select-start-active@2.png")); }
|
|
||||||
|
|
||||||
cursor-handle.bottom:active:dir(ltr), cursor-handle.top:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end-active.png"), url("assets/text-select-end-active@2.png")); }
|
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:active:dir(ltr), cursor-handle.insertion-cursor:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-active.png"), url("assets/slider-horz-scale-has-marks-above-active@2.png")); }
|
|
||||||
|
|
||||||
shortcuts-section { margin: 20px; }
|
shortcuts-section { margin: 20px; }
|
||||||
|
|
||||||
|
|
|
||||||
26
source/common/cursor-handle.scss
Normal file
26
source/common/cursor-handle.scss
Normal file
|
|
@ -0,0 +1,26 @@
|
||||||
|
/**********************
|
||||||
|
* Touch Copy & Paste *
|
||||||
|
*********************/
|
||||||
|
//touch selection handlebars for the Popover.osd above
|
||||||
|
cursor-handle {
|
||||||
|
|
||||||
|
//copying slider code, so not DRYing, here...
|
||||||
|
//I don't know how to test this...
|
||||||
|
@include button(normal-alt);
|
||||||
|
|
||||||
|
border: 1px solid darken($alt_borders_color, 3%);
|
||||||
|
border-radius: 100%;
|
||||||
|
transition: $button_transition;
|
||||||
|
transition-property: background, border, box-shadow;
|
||||||
|
min-height: 18px;
|
||||||
|
min-width: 10px;
|
||||||
|
|
||||||
|
&:hover { @include button(hover-alt, $edge: $shadow_color); }
|
||||||
|
|
||||||
|
&:active { border-color: $progress_border_color; }
|
||||||
|
|
||||||
|
&:disabled { @include button(insensitive); }
|
||||||
|
|
||||||
|
&.top:dir(ltr), &.bottom:dir(rtl) {border-radius: 100% 5px 5px 5px;}
|
||||||
|
&.bottom:dir(ltr), &.top:dir(rtl) {border-radius: 5px 100% 5px 5px;}
|
||||||
|
}
|
||||||
|
|
@ -567,3 +567,88 @@ levelbar {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/**********************
|
||||||
|
* Touch Copy & Paste *
|
||||||
|
*********************/
|
||||||
|
//touch selection handlebars for the Popover.osd above
|
||||||
|
cursor-handle {
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
box-shadow: none;
|
||||||
|
border-style: none;
|
||||||
|
|
||||||
|
@each $s,$as in ('',''),
|
||||||
|
(':hover','-hover'),
|
||||||
|
(':active','-active') { //no need for insensitive and backdrop
|
||||||
|
&.top#{$s}:dir(ltr), &.bottom#{$s}:dir(rtl) {
|
||||||
|
$_url: 'assets/text-select-start#{$as}#{$asset_suffix}';
|
||||||
|
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
||||||
|
url('#{$_url}@2.png'));
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.bottom#{$s}:dir(ltr), &.top#{$s}:dir(rtl) {
|
||||||
|
$_url: 'assets/text-select-end#{$as}#{$asset_suffix}';
|
||||||
|
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
||||||
|
url('#{$_url}@2.png'));
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.insertion-cursor#{$s}:dir(ltr), &.insertion-cursor#{$s}:dir(rtl) {
|
||||||
|
$_url: 'assets/slider-horz-scale-has-marks-above#{$as}#{$asset_suffix}';
|
||||||
|
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
||||||
|
url('#{$_url}@2.png'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//inside scale .color
|
||||||
|
&.fine-tune {
|
||||||
|
&.horizontal {
|
||||||
|
&:dir(ltr), &:dir(rtl) { // specificity bump
|
||||||
|
padding: 0 0 12px 0;
|
||||||
|
|
||||||
|
trough {
|
||||||
|
padding-bottom: 7px;
|
||||||
|
background-position: 0 -6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
slider {
|
||||||
|
margin-bottom: -15px;
|
||||||
|
margin-top: 6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.vertical {
|
||||||
|
&:dir(ltr) {
|
||||||
|
padding: 0 0 0 12px;
|
||||||
|
|
||||||
|
trough {
|
||||||
|
padding-left: 7px;
|
||||||
|
background-position: 6px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
slider {
|
||||||
|
margin-left: -15px;
|
||||||
|
margin-right: 6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:dir(rtl) {
|
||||||
|
padding: 0 12px 0 0;
|
||||||
|
|
||||||
|
trough {
|
||||||
|
padding-right: 7px;
|
||||||
|
background-position: -6px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
slider {
|
||||||
|
margin-right: -15px;
|
||||||
|
margin-left: 6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -423,5 +423,45 @@
|
||||||
|
|
||||||
&.dragging,
|
&.dragging,
|
||||||
&.hovering { opacity: 0.8; }
|
&.hovering { opacity: 0.8; }
|
||||||
}*/
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/**********************
|
||||||
|
* Touch Copy & Paste *
|
||||||
|
*********************/
|
||||||
|
//touch selection handlebars for the Popover.osd above
|
||||||
|
cursor-handle {
|
||||||
|
background-color: transparent;
|
||||||
|
background-image: none;
|
||||||
|
box-shadow: none;
|
||||||
|
border-style: none;
|
||||||
|
min-width: 20px;
|
||||||
|
min-height: 24px;
|
||||||
|
padding-left: 20px;
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-top: 24px;
|
||||||
|
padding-bottom: 24px;
|
||||||
|
|
||||||
|
@each $s,$as in ('',''),
|
||||||
|
(':hover','-hover'),
|
||||||
|
(':active','-active') { //no need for insensitive and backdrop
|
||||||
|
&.top#{$s}:dir(ltr), &.bottom#{$s}:dir(rtl) {
|
||||||
|
$_url: '#{$assets}/text-select-start#{$as}#{$asset_suffix}';
|
||||||
|
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
||||||
|
url('#{$_url}@2.png'));
|
||||||
|
}
|
||||||
|
|
||||||
|
&.bottom#{$s}:dir(ltr), &.top#{$s}:dir(rtl) {
|
||||||
|
$_url: '#{$assets}/text-select-end#{$as}#{$asset_suffix}';
|
||||||
|
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
||||||
|
url('#{$_url}@2.png'));
|
||||||
|
}
|
||||||
|
|
||||||
|
&.insertion-cursor#{$s}:dir(ltr), &.insertion-cursor#{$s}:dir(rtl) {
|
||||||
|
$_url: '#{$assets}/slider-horz-scale-has-marks-above#{$as}#{$asset_suffix}';
|
||||||
|
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
||||||
|
url('#{$_url}@2.png'));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -3105,34 +3105,31 @@ scale {
|
||||||
|
|
||||||
// the slider is inside the trough, so to have make it bigger there's a negative margin
|
// the slider is inside the trough, so to have make it bigger there's a negative margin
|
||||||
|
|
||||||
slider {
|
|
||||||
min-height: 18px;
|
|
||||||
min-width: 18px;
|
|
||||||
margin: -9px;
|
|
||||||
}
|
|
||||||
|
|
||||||
// click-and-hold the slider to activate
|
// click-and-hold the slider to activate
|
||||||
&.fine-tune {
|
&.fine-tune {
|
||||||
&.horizontal {
|
//&.horizontal {
|
||||||
padding-top: 9px;
|
// padding-top: 9px;
|
||||||
padding-bottom: 9px;
|
// padding-bottom: 9px;
|
||||||
min-height: 16px;
|
// min-height: 16px;
|
||||||
}
|
//}
|
||||||
|
|
||||||
&.vertical {
|
//&.vertical {
|
||||||
padding-left: 9px;
|
// padding-left: 9px;
|
||||||
padding-right: 9px;
|
// padding-right: 9px;
|
||||||
min-width: 16px;
|
// min-width: 16px;
|
||||||
}
|
//}
|
||||||
|
|
||||||
// to make the trough grow in fine-tune mode
|
// to make the trough grow in fine-tune mode
|
||||||
slider { margin: -6px; }
|
//trough {border-color: $success_color;}
|
||||||
|
slider {&, &:active, &:hover, &:focus { background-color: $hint_bg;}}//margin: -6px; }
|
||||||
|
|
||||||
fill,
|
fill,
|
||||||
highlight,
|
highlight,
|
||||||
trough {
|
trough {
|
||||||
border-radius: 5px;
|
//border-radius: 5px;
|
||||||
-gtk-outline-radius: 7px;
|
//-gtk-outline-radius: 7px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -3174,7 +3171,11 @@ scale {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
slider {
|
slider, %slider {
|
||||||
|
|
||||||
|
min-height: 18px;
|
||||||
|
min-width: 18px;
|
||||||
|
margin: -9px;
|
||||||
@include button(normal-alt, $edge: $shadow_color);
|
@include button(normal-alt, $edge: $shadow_color);
|
||||||
|
|
||||||
border: 1px solid darken($alt_borders_color, 3%);
|
border: 1px solid darken($alt_borders_color, 3%);
|
||||||
|
|
@ -3250,12 +3251,12 @@ scale {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.#{$scale_orient}.fine-tune marks {
|
//&.#{$scale_orient}.fine-tune marks {
|
||||||
&.#{$marks_class} {
|
// &.#{$marks_class} {
|
||||||
margin-#{$marks_margin}: $_marks_distance;
|
// margin-#{$marks_margin}: $_marks_distance;
|
||||||
margin-#{$marks_pos}: -($_marks_distance + $_marks_length - 3px);
|
// margin-#{$marks_pos}: -($_marks_distance + $_marks_length - 3px);
|
||||||
}
|
// }
|
||||||
}
|
//}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -3266,9 +3267,10 @@ scale {
|
||||||
min-width: 1px;
|
min-width: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.fine-tune indicator { min-height: ($_marks_length - 3px); }
|
//&.fine-tune indicator { min-height: ($_marks_length - 3px); }
|
||||||
&.marks-after {slider{ border-radius: 5px 5px 100% 100%;}}
|
&.marks-after {
|
||||||
&.marks-before {slider{ border-radius: 100% 100% 5px 5px;}}
|
slider{ border-radius: 5px 5px 100% 100%; min-width: 10px; padding: 0; margin-right: 5px; margin-left:5px;}}
|
||||||
|
&.marks-before {slider{ border-radius: 100% 100% 5px 5px;min-width: 10px;padding: 0;margin-right: 5px; margin-left:5px;}}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.vertical {
|
&.vertical {
|
||||||
|
|
@ -3277,10 +3279,10 @@ scale {
|
||||||
min-width: $_marks_length;
|
min-width: $_marks_length;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.fine-tune indicator { min-width: ($_marks_length - 3px); }
|
//&.fine-tune indicator { min-width: ($_marks_length - 3px); }
|
||||||
|
|
||||||
&.marks-after {slider{ border-radius: 5px 100% 100% 5px;}}
|
&.marks-after {slider{ border-radius: 5px 100% 100% 5px; min-height: 10px;padding: 0;margin-top: 5px; margin-bottom:5px;}}
|
||||||
&.marks-before {slider{ border-radius: 100% 5px 5px 100%;}}
|
&.marks-before {slider{ border-radius: 100% 5px 5px 100%; min-height: 10px;padding: 0;margin-top: 5px; margin-bottom:5px;}}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Old warning to help locate where this madness used to be. I've used a much saner approach to marked sliders, IMHO, without assets.
|
// Old warning to help locate where this madness used to be. I've used a much saner approach to marked sliders, IMHO, without assets.
|
||||||
|
|
@ -3354,53 +3356,7 @@ scale {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.fine-tune {
|
//removed fine-tune bit
|
||||||
&.horizontal {
|
|
||||||
&:dir(ltr), &:dir(rtl) { // specificity bump
|
|
||||||
padding: 0 0 12px 0;
|
|
||||||
|
|
||||||
trough {
|
|
||||||
padding-bottom: 7px;
|
|
||||||
background-position: 0 -6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
slider {
|
|
||||||
margin-bottom: -15px;
|
|
||||||
margin-top: 6px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.vertical {
|
|
||||||
&:dir(ltr) {
|
|
||||||
padding: 0 0 0 12px;
|
|
||||||
|
|
||||||
trough {
|
|
||||||
padding-left: 7px;
|
|
||||||
background-position: 6px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
slider {
|
|
||||||
margin-left: -15px;
|
|
||||||
margin-right: 6px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:dir(rtl) {
|
|
||||||
padding: 0 12px 0 0;
|
|
||||||
|
|
||||||
trough {
|
|
||||||
padding-right: 7px;
|
|
||||||
background-position: -6px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
slider {
|
|
||||||
margin-right: -15px;
|
|
||||||
margin-left: 6px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -4110,14 +4066,14 @@ tooltip {
|
||||||
&.background {
|
&.background {
|
||||||
// background-color needs to be set this way otherwise it gets drawn twice
|
// background-color needs to be set this way otherwise it gets drawn twice
|
||||||
// see https://bugzilla.gnome.org/show_bug.cgi?id=736155 for details.
|
// see https://bugzilla.gnome.org/show_bug.cgi?id=736155 for details.
|
||||||
background-color: transparentize($hint_bg, 0.2);
|
background-color: transparentize($hint_bg, 0.1);
|
||||||
background-clip: padding-box;
|
background-clip: padding-box;
|
||||||
border: 1px solid $tooltip_borders_color; // this suble border is meant to
|
border: 1px solid $tooltip_borders_color; // this suble border is meant to
|
||||||
// not make the tooltip melt with
|
// not make the tooltip melt with
|
||||||
// very dark backgrounds
|
// very dark backgrounds
|
||||||
}
|
}
|
||||||
|
|
||||||
padding: 4px; /* not working */
|
//padding: 4px; /* not working */
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
//box-shadow: none; // otherwise it gets inherited by windowframe.csd
|
//box-shadow: none; // otherwise it gets inherited by windowframe.csd
|
||||||
text-shadow: none;
|
text-shadow: none;
|
||||||
|
|
@ -4126,7 +4082,7 @@ tooltip {
|
||||||
decoration { background-color: transparent; }
|
decoration { background-color: transparent; }
|
||||||
|
|
||||||
* { // Yeah this is ugly
|
* { // Yeah this is ugly
|
||||||
padding: 4px;
|
//padding: 4px;
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
color: $hint_fg;
|
color: $hint_fg;
|
||||||
}
|
}
|
||||||
|
|
@ -4357,7 +4313,7 @@ decoration {
|
||||||
.tiled-left & {
|
.tiled-left & {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
box-shadow: 0 0 0 1px $_wm_border_backdrop,
|
box-shadow: 0 0 0 1px $_wm_border_backdrop,
|
||||||
0 2px 6px 2px transparentize(black, 0.8),
|
0 2px 6px 2px transparentize(black, 0.3),
|
||||||
0 0 0 20px transparent; //transparent control workaround -- #3670
|
0 0 0 20px transparent; //transparent control workaround -- #3670
|
||||||
|
|
||||||
&:backdrop { box-shadow: 0 0 0 1px $_wm_border_backdrop,
|
&:backdrop { box-shadow: 0 0 0 1px $_wm_border_backdrop,
|
||||||
|
|
@ -4381,7 +4337,7 @@ decoration {
|
||||||
|
|
||||||
tooltip.csd & {
|
tooltip.csd & {
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
box-shadow: none;
|
box-shadow: 0 3px 4px transparentize(black, 0.3); //none;
|
||||||
}
|
}
|
||||||
|
|
||||||
messagedialog.csd & {
|
messagedialog.csd & {
|
||||||
|
|
@ -4396,9 +4352,9 @@ decoration {
|
||||||
background-color: $borders_color;
|
background-color: $borders_color;
|
||||||
border: solid 1px $borders_color;
|
border: solid 1px $borders_color;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
box-shadow: inset 0 0 0 3px $headerbar_color, inset 0 1px $top_hilight, 0 1px 5px transparentize(black, 0.8);
|
box-shadow: inset 0 0 0 3px $headerbar_color, inset 0 1px $top_hilight, 0 3px 5px transparentize(black, 0.3);
|
||||||
|
|
||||||
&:backdrop { box-shadow: inset 0 0 0 3px $backdrop_bg_color, inset 0 1px $top_hilight, 0 1px 5px transparentize(black, 0.8); }
|
&:backdrop { box-shadow: inset 0 0 0 3px $backdrop_bg_color, inset 0 1px $top_hilight, 0 3px 5px transparentize(black, 0.3); }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -4448,36 +4404,8 @@ headerbar.selection-mode button.titlebutton,
|
||||||
* Touch Copy & Paste *
|
* Touch Copy & Paste *
|
||||||
*********************/
|
*********************/
|
||||||
//touch selection handlebars for the Popover.osd above
|
//touch selection handlebars for the Popover.osd above
|
||||||
cursor-handle {
|
|
||||||
background-color: transparent;
|
|
||||||
background-image: none;
|
|
||||||
box-shadow: none;
|
|
||||||
border-style: none;
|
|
||||||
|
|
||||||
@each $s,$as in ('',''),
|
@import '../common/cursor-handle.scss';
|
||||||
(':hover','-hover'),
|
|
||||||
(':active','-active') { //no need for insensitive and backdrop
|
|
||||||
&.top#{$s}:dir(ltr), &.bottom#{$s}:dir(rtl) {
|
|
||||||
$_url: 'assets/text-select-start#{$as}#{$asset_suffix}';
|
|
||||||
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
|
||||||
url('#{$_url}@2.png'));
|
|
||||||
padding-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.bottom#{$s}:dir(ltr), &.top#{$s}:dir(rtl) {
|
|
||||||
$_url: 'assets/text-select-end#{$as}#{$asset_suffix}';
|
|
||||||
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
|
||||||
url('#{$_url}@2.png'));
|
|
||||||
padding-right: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.insertion-cursor#{$s}:dir(ltr), &.insertion-cursor#{$s}:dir(rtl) {
|
|
||||||
$_url: 'assets/slider-horz-scale-has-marks-above#{$as}#{$asset_suffix}';
|
|
||||||
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
|
||||||
url('#{$_url}@2.png'));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.context-menu { font: initial; } // Decouple the font of context menus from their entry/textview
|
.context-menu { font: initial; } // Decouple the font of context menus from their entry/textview
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1135,15 +1135,7 @@ scale { min-height: 10px; min-width: 10px; padding: 12px; }
|
||||||
|
|
||||||
scale fill, scale highlight { margin: -1px; }
|
scale fill, scale highlight { margin: -1px; }
|
||||||
|
|
||||||
scale slider { min-height: 18px; min-width: 18px; margin: -9px; }
|
scale.fine-tune slider, scale.fine-tune slider:active, scale.fine-tune slider:hover, scale.fine-tune slider:focus { background-color: #6789b4; }
|
||||||
|
|
||||||
scale.fine-tune.horizontal { padding-top: 9px; padding-bottom: 9px; min-height: 16px; }
|
|
||||||
|
|
||||||
scale.fine-tune.vertical { padding-left: 9px; padding-right: 9px; min-width: 16px; }
|
|
||||||
|
|
||||||
scale.fine-tune slider { margin: -6px; }
|
|
||||||
|
|
||||||
scale.fine-tune fill, scale.fine-tune highlight, scale.fine-tune trough { border-radius: 5px; -gtk-outline-radius: 7px; }
|
|
||||||
|
|
||||||
scale trough { outline-offset: 2px; -gtk-outline-radius: 5px; }
|
scale trough { outline-offset: 2px; -gtk-outline-radius: 5px; }
|
||||||
|
|
||||||
|
|
@ -1155,7 +1147,7 @@ scale fill:disabled:backdrop, scale fill:disabled { border-color: transparent; b
|
||||||
|
|
||||||
.osd scale fill:disabled:backdrop, .osd scale fill:disabled { border-color: transparent; background-color: transparent; }
|
.osd scale fill:disabled:backdrop, .osd scale fill:disabled { border-color: transparent; background-color: transparent; }
|
||||||
|
|
||||||
scale slider { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.4); border: 1px solid #626262; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; }
|
scale slider { min-height: 18px; min-width: 18px; margin: -9px; color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.4); border: 1px solid #626262; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; }
|
||||||
|
|
||||||
scale slider:hover { background-color: shade(#bcbeb9, 1.1); }
|
scale slider:hover { background-color: shade(#bcbeb9, 1.1); }
|
||||||
|
|
||||||
|
|
@ -1183,35 +1175,23 @@ scale marks, scale value { color: alpha(currentColor,0.55); font-feature-setting
|
||||||
|
|
||||||
scale.horizontal marks.top { margin-bottom: 6px; margin-top: -12px; }
|
scale.horizontal marks.top { margin-bottom: 6px; margin-top: -12px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune marks.top { margin-bottom: 6px; margin-top: -9px; }
|
|
||||||
|
|
||||||
scale.horizontal marks.bottom { margin-top: 6px; margin-bottom: -12px; }
|
scale.horizontal marks.bottom { margin-top: 6px; margin-bottom: -12px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune marks.bottom { margin-top: 6px; margin-bottom: -9px; }
|
|
||||||
|
|
||||||
scale.vertical marks.top { margin-right: 6px; margin-left: -12px; }
|
scale.vertical marks.top { margin-right: 6px; margin-left: -12px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune marks.top { margin-right: 6px; margin-left: -9px; }
|
|
||||||
|
|
||||||
scale.vertical marks.bottom { margin-left: 6px; margin-right: -12px; }
|
scale.vertical marks.bottom { margin-left: 6px; margin-right: -12px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune marks.bottom { margin-left: 6px; margin-right: -9px; }
|
|
||||||
|
|
||||||
scale.horizontal indicator { min-height: 6px; min-width: 1px; }
|
scale.horizontal indicator { min-height: 6px; min-width: 1px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune indicator { min-height: 3px; }
|
scale.horizontal.marks-after slider { border-radius: 5px 5px 100% 100%; min-width: 10px; padding: 0; margin-right: 5px; margin-left: 5px; }
|
||||||
|
|
||||||
scale.horizontal.marks-after slider { border-radius: 5px 5px 100% 100%; }
|
scale.horizontal.marks-before slider { border-radius: 100% 100% 5px 5px; min-width: 10px; padding: 0; margin-right: 5px; margin-left: 5px; }
|
||||||
|
|
||||||
scale.horizontal.marks-before slider { border-radius: 100% 100% 5px 5px; }
|
|
||||||
|
|
||||||
scale.vertical indicator { min-height: 1px; min-width: 6px; }
|
scale.vertical indicator { min-height: 1px; min-width: 6px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune indicator { min-width: 3px; }
|
scale.vertical.marks-after slider { border-radius: 5px 100% 100% 5px; min-height: 10px; padding: 0; margin-top: 5px; margin-bottom: 5px; }
|
||||||
|
|
||||||
scale.vertical.marks-after slider { border-radius: 5px 100% 100% 5px; }
|
scale.vertical.marks-before slider { border-radius: 100% 5px 5px 100%; min-height: 10px; padding: 0; margin-top: 5px; margin-bottom: 5px; }
|
||||||
|
|
||||||
scale.vertical.marks-before slider { border-radius: 100% 5px 5px 100%; }
|
|
||||||
|
|
||||||
scale.color { min-height: 0; min-width: 0; }
|
scale.color { min-height: 0; min-width: 0; }
|
||||||
|
|
||||||
|
|
@ -1235,24 +1215,6 @@ scale.color.vertical:dir(rtl) trough { padding-right: 4px; background-position:
|
||||||
|
|
||||||
scale.color.vertical:dir(rtl) slider:hover, scale.color.vertical:dir(rtl) slider:backdrop, scale.color.vertical:dir(rtl) slider:disabled, scale.color.vertical:dir(rtl) slider:backdrop:disabled, scale.color.vertical:dir(rtl) slider { margin-right: -15px; margin-left: 6px; }
|
scale.color.vertical:dir(rtl) slider:hover, scale.color.vertical:dir(rtl) slider:backdrop, scale.color.vertical:dir(rtl) slider:disabled, scale.color.vertical:dir(rtl) slider:backdrop:disabled, scale.color.vertical:dir(rtl) slider { margin-right: -15px; margin-left: 6px; }
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr), scale.color.fine-tune.horizontal:dir(rtl) { padding: 0 0 12px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr) trough, scale.color.fine-tune.horizontal:dir(rtl) trough { padding-bottom: 7px; background-position: 0 -6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr) slider, scale.color.fine-tune.horizontal:dir(rtl) slider { margin-bottom: -15px; margin-top: 6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) { padding: 0 0 0 12px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) trough { padding-left: 7px; background-position: 6px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) slider { margin-left: -15px; margin-right: 6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) { padding: 0 12px 0 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) trough { padding-right: 7px; background-position: -6px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) slider { margin-right: -15px; margin-left: 6px; }
|
|
||||||
|
|
||||||
/***************** Progress bars * */
|
/***************** Progress bars * */
|
||||||
progressbar { font-size: smaller; color: rgba(36, 31, 49, 0.4); font-feature-settings: "tnum"; }
|
progressbar { font-size: smaller; color: rgba(36, 31, 49, 0.4); font-feature-settings: "tnum"; }
|
||||||
|
|
||||||
|
|
@ -1580,13 +1542,13 @@ infobar.info selection, infobar.question selection, infobar.warning selection, i
|
||||||
infobar.info *:link, infobar.question *:link, infobar.warning *:link, infobar.error *:link { color: #004B91; }
|
infobar.info *:link, infobar.question *:link, infobar.warning *:link, infobar.error *:link { color: #004B91; }
|
||||||
|
|
||||||
/************ Tooltips * */
|
/************ Tooltips * */
|
||||||
tooltip { padding: 4px; /* not working */ border-radius: 5px; text-shadow: none; }
|
tooltip { border-radius: 5px; text-shadow: none; }
|
||||||
|
|
||||||
tooltip.background { background-color: rgba(103, 137, 180, 0.8); background-clip: padding-box; border: 1px solid #002269; }
|
tooltip.background { background-color: rgba(103, 137, 180, 0.9); background-clip: padding-box; border: 1px solid #002269; }
|
||||||
|
|
||||||
tooltip decoration { background-color: transparent; }
|
tooltip decoration { background-color: transparent; }
|
||||||
|
|
||||||
tooltip * { padding: 4px; background-color: transparent; color: #002269; }
|
tooltip * { background-color: transparent; color: #002269; }
|
||||||
|
|
||||||
/***************** Color Chooser * */
|
/***************** Color Chooser * */
|
||||||
colorswatch:drop(active), colorswatch { border-style: none; }
|
colorswatch:drop(active), colorswatch { border-style: none; }
|
||||||
|
|
@ -1675,7 +1637,7 @@ decoration:backdrop { box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(
|
||||||
|
|
||||||
.maximized decoration, .fullscreen decoration { border-radius: 0; box-shadow: none; }
|
.maximized decoration, .fullscreen decoration { border-radius: 0; box-shadow: none; }
|
||||||
|
|
||||||
.tiled decoration, .tiled-top decoration, .tiled-right decoration, .tiled-bottom decoration, .tiled-left decoration { border-radius: 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 20px transparent; }
|
.tiled decoration, .tiled-top decoration, .tiled-right decoration, .tiled-bottom decoration, .tiled-left decoration { border-radius: 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.7), 0 0 0 20px transparent; }
|
||||||
|
|
||||||
.tiled decoration:backdrop, .tiled-top decoration:backdrop, .tiled-right decoration:backdrop, .tiled-bottom decoration:backdrop, .tiled-left decoration:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.4), 0 0 0 20px transparent; }
|
.tiled decoration:backdrop, .tiled-top decoration:backdrop, .tiled-right decoration:backdrop, .tiled-bottom decoration:backdrop, .tiled-left decoration:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.4), 0 0 0 20px transparent; }
|
||||||
|
|
||||||
|
|
@ -1687,13 +1649,13 @@ decoration:backdrop { box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(
|
||||||
|
|
||||||
.csd.popup decoration { border-radius: 5px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
.csd.popup decoration { border-radius: 5px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
||||||
|
|
||||||
tooltip.csd decoration { border-radius: 5px; box-shadow: none; }
|
tooltip.csd decoration { border-radius: 5px; box-shadow: 0 3px 4px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
messagedialog.csd decoration { border-radius: 8px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
messagedialog.csd decoration { border-radius: 8px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
||||||
|
|
||||||
.solid-csd decoration { margin: 0; padding: 4px; background-color: #797979; border: solid 1px #797979; border-radius: 0; box-shadow: inset 0 0 0 3px #b4b4b4, inset 0 1px rgba(255, 255, 255, 0.8), 0 1px 5px rgba(0, 0, 0, 0.2); }
|
.solid-csd decoration { margin: 0; padding: 4px; background-color: #797979; border: solid 1px #797979; border-radius: 0; box-shadow: inset 0 0 0 3px #b4b4b4, inset 0 1px rgba(255, 255, 255, 0.8), 0 3px 5px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
.solid-csd decoration:backdrop { box-shadow: inset 0 0 0 3px #a7a7a7, inset 0 1px rgba(255, 255, 255, 0.8), 0 1px 5px rgba(0, 0, 0, 0.2); }
|
.solid-csd decoration:backdrop { box-shadow: inset 0 0 0 3px #a7a7a7, inset 0 1px rgba(255, 255, 255, 0.8), 0 3px 5px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
button.titlebutton { text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); }
|
button.titlebutton { text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); }
|
||||||
|
|
||||||
|
|
@ -1710,25 +1672,18 @@ button.titlebutton:backdrop { -gtk-icon-shadow: none; }
|
||||||
.monospace { font-family: monospace; }
|
.monospace { font-family: monospace; }
|
||||||
|
|
||||||
/********************** Touch Copy & Paste * */
|
/********************** Touch Copy & Paste * */
|
||||||
cursor-handle { background-color: transparent; background-image: none; box-shadow: none; border-style: none; }
|
/********************** Touch Copy & Paste * */
|
||||||
|
cursor-handle { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); border: 1px solid #626262; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; min-height: 18px; min-width: 10px; }
|
||||||
|
|
||||||
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start.png"), url("assets/text-select-start@2.png")); padding-left: 10px; }
|
cursor-handle:hover { background-color: shade(#bcbeb9, 1.1); }
|
||||||
|
|
||||||
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end.png"), url("assets/text-select-end@2.png")); padding-right: 10px; }
|
cursor-handle:active { border-color: #8bcd41; }
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above.png"), url("assets/slider-horz-scale-has-marks-above@2.png")); }
|
cursor-handle:disabled { color: #552222; background-color: #938989; background-image: none; }
|
||||||
|
|
||||||
cursor-handle.top:hover:dir(ltr), cursor-handle.bottom:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start-hover.png"), url("assets/text-select-start-hover@2.png")); padding-left: 10px; }
|
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) { border-radius: 100% 5px 5px 5px; }
|
||||||
|
|
||||||
cursor-handle.bottom:hover:dir(ltr), cursor-handle.top:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end-hover.png"), url("assets/text-select-end-hover@2.png")); padding-right: 10px; }
|
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) { border-radius: 5px 100% 5px 5px; }
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:hover:dir(ltr), cursor-handle.insertion-cursor:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-hover.png"), url("assets/slider-horz-scale-has-marks-above-hover@2.png")); }
|
|
||||||
|
|
||||||
cursor-handle.top:active:dir(ltr), cursor-handle.bottom:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start-active.png"), url("assets/text-select-start-active@2.png")); padding-left: 10px; }
|
|
||||||
|
|
||||||
cursor-handle.bottom:active:dir(ltr), cursor-handle.top:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end-active.png"), url("assets/text-select-end-active@2.png")); padding-right: 10px; }
|
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:active:dir(ltr), cursor-handle.insertion-cursor:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-active.png"), url("assets/slider-horz-scale-has-marks-above-active@2.png")); }
|
|
||||||
|
|
||||||
.context-menu { font: initial; }
|
.context-menu { font: initial; }
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2622,36 +2622,31 @@ scale {
|
||||||
> fill,
|
> fill,
|
||||||
> highlight { margin: -1px; }
|
> highlight { margin: -1px; }
|
||||||
|
|
||||||
// the slider is inside the trough, so to have make it bigger there's a negative margin
|
|
||||||
|
|
||||||
> slider {
|
|
||||||
min-height: 18px;
|
|
||||||
min-width: 18px;
|
|
||||||
margin: -9px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// click-and-hold the slider to activate
|
// click-and-hold the slider to activate
|
||||||
&.fine-tune {
|
&.fine-tune {
|
||||||
&.horizontal {
|
//&.horizontal {
|
||||||
padding-top: 9px;
|
// padding-top: 9px;
|
||||||
padding-bottom: 9px;
|
// padding-bottom: 9px;
|
||||||
min-height: 16px;
|
// min-height: 16px;
|
||||||
}
|
//}
|
||||||
|
|
||||||
&.vertical {
|
//&.vertical {
|
||||||
padding-left: 9px;
|
// padding-left: 9px;
|
||||||
padding-right: 9px;
|
// padding-right: 9px;
|
||||||
min-width: 16px;
|
// min-width: 16px;
|
||||||
}
|
//}
|
||||||
|
|
||||||
// to make the trough grow in fine-tune mode
|
// to make the trough grow in fine-tune mode //no longer, just background change
|
||||||
> trough > slider { margin: -6px; }
|
> trough > slider {&, &:active, &:hover, &:focus { background-color: $hint_bg;}} //margin: -6px; }
|
||||||
|
|
||||||
> trough > fill,
|
> trough > fill,
|
||||||
> trough > highlight,
|
> trough > highlight,
|
||||||
> trough {
|
> trough {
|
||||||
border-radius: 5px;
|
//border-radius: 5px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -2685,7 +2680,10 @@ scale {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
> trough > slider {
|
> trough > slider, %slider {
|
||||||
|
min-height: 18px;
|
||||||
|
min-width: 18px;
|
||||||
|
margin: -9px; // the slider is inside the trough, so to have make it bigger there's a negative margin
|
||||||
@include button(normal);
|
@include button(normal);
|
||||||
border-width: 1px;
|
border-width: 1px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
|
|
@ -2746,14 +2744,14 @@ scale {
|
||||||
> value.left { margin-right: 9px; }
|
> value.left { margin-right: 9px; }
|
||||||
> value.right { margin-left: 9px; }
|
> value.right { margin-left: 9px; }
|
||||||
|
|
||||||
&.fine-tune >marks {
|
//&.fine-tune >marks {
|
||||||
&.top { margin-top: 3px; }
|
// &.top { margin-top: 3px; }
|
||||||
&.bottom { margin-bottom: 3px; }
|
// &.bottom { margin-bottom: 3px; }
|
||||||
|
|
||||||
indicator { min-height: ($_marks_length - 3px); }
|
// indicator { min-height: ($_marks_length - 3px); }
|
||||||
}
|
//}
|
||||||
&.marks-after {slider{ border-radius: 5px 5px 100% 100%;}}
|
&.marks-after {slider{ border-radius: 5px 5px 100% 100%;min-width: 10px; padding: 0; margin-right: 5px; margin-left:5px;}}
|
||||||
&.marks-before {slider{ border-radius: 100% 100% 5px 5px;}}
|
&.marks-before {slider{ border-radius: 100% 100% 5px 5px;min-width: 10px; padding: 0; margin-right: 5px; margin-left:5px;}}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -2773,14 +2771,14 @@ scale {
|
||||||
> value.top { margin-bottom: 9px; }
|
> value.top { margin-bottom: 9px; }
|
||||||
> value.bottom { margin-top: 9px; }
|
> value.bottom { margin-top: 9px; }
|
||||||
|
|
||||||
&.fine-tune >marks {
|
//&.fine-tune >marks {
|
||||||
&.top { margin-left: 3px; }
|
// &.top { margin-left: 3px; }
|
||||||
&.bottom { margin-right: 3px; }
|
// &.bottom { margin-right: 3px; }
|
||||||
|
|
||||||
indicator { min-height: ($_marks_length - 3px); }
|
// indicator { min-height: ($_marks_length - 3px); }
|
||||||
}
|
// }
|
||||||
&.marks-after {slider{ border-radius: 5px 100% 100% 5px;}}
|
&.marks-after {slider{ border-radius: 5px 100% 100% 5px;min-height: 10px;padding: 0;margin-top: 54px; margin-bottom:5px;}}
|
||||||
&.marks-before {slider{ border-radius: 100% 5px 5px 100%;}}
|
&.marks-before {slider{ border-radius: 100% 5px 5px 100%;min-height: 10px;padding: 0;margin-top: 5px; margin-bottom:5px;}}
|
||||||
}
|
}
|
||||||
|
|
||||||
// *WARNING* scale with marks madness following
|
// *WARNING* scale with marks madness following
|
||||||
|
|
@ -2854,53 +2852,7 @@ scale {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&.fine-tune {
|
//removed fine-tune bit
|
||||||
&.horizontal {
|
|
||||||
&:dir(ltr), &:dir(rtl) { // specificity bump
|
|
||||||
padding: 0 0 12px 0;
|
|
||||||
|
|
||||||
> trough {
|
|
||||||
padding-bottom: 7px;
|
|
||||||
background-position: 0 -6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
> trough > slider {
|
|
||||||
margin-bottom: -15px;
|
|
||||||
margin-top: 6px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.vertical {
|
|
||||||
&:dir(ltr) {
|
|
||||||
padding: 0 0 0 12px;
|
|
||||||
|
|
||||||
> trough {
|
|
||||||
padding-left: 7px;
|
|
||||||
background-position: 6px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
> trough > slider {
|
|
||||||
margin-left: -15px;
|
|
||||||
margin-right: 6px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:dir(rtl) {
|
|
||||||
padding: 0 12px 0 0;
|
|
||||||
|
|
||||||
> trough {
|
|
||||||
padding-right: 7px;
|
|
||||||
background-position: -6px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
> trough > slider {
|
|
||||||
margin-right: -15px;
|
|
||||||
margin-left: 6px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -3671,7 +3623,7 @@ tooltip {
|
||||||
&.background {
|
&.background {
|
||||||
// background-color needs to be set this way otherwise it gets drawn twice
|
// background-color needs to be set this way otherwise it gets drawn twice
|
||||||
// see https://bugzilla.gnome.org/show_bug.cgi?id=736155 for details.
|
// see https://bugzilla.gnome.org/show_bug.cgi?id=736155 for details.
|
||||||
background-color: transparentize($hint_bg, 0.2);
|
background-color: transparentize($hint_bg, 0.1);
|
||||||
background-clip: padding-box;
|
background-clip: padding-box;
|
||||||
border: 1px solid $tooltip_borders_color; // this subtle border is meant to
|
border: 1px solid $tooltip_borders_color; // this subtle border is meant to
|
||||||
// not make the tooltip melt with
|
// not make the tooltip melt with
|
||||||
|
|
@ -3681,7 +3633,7 @@ tooltip {
|
||||||
|
|
||||||
padding: 6px 10px;
|
padding: 6px 10px;
|
||||||
border-radius: $window_radius;
|
border-radius: $window_radius;
|
||||||
box-shadow: none; // otherwise it gets inherited by windowframe.csd
|
//box-shadow: none; // otherwise it gets inherited by windowframe.csd
|
||||||
|
|
||||||
> box {
|
> box {
|
||||||
border-spacing: 6px;
|
border-spacing: 6px;
|
||||||
|
|
@ -3924,9 +3876,9 @@ window {
|
||||||
padding: 4px;
|
padding: 4px;
|
||||||
border: solid 1px $borders_color;
|
border: solid 1px $borders_color;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
box-shadow: inset 0 0 0 4px $borders_color, inset 0 0 0 3px $headerbar_bg_color, inset 0 1px $top_hilight, 0 1px 5px transparentize(black, 0.8);
|
box-shadow: inset 0 0 0 4px $borders_color, inset 0 0 0 3px $headerbar_bg_color, inset 0 1px $top_hilight, 0 3px 5px transparentize(black, 0.3);
|
||||||
|
|
||||||
&:backdrop { box-shadow: inset 0 0 0 4px $borders_color, inset 0 0 0 3px $backdrop_bg_color, inset 0 1px $top_hilight, 0 1px 5px transparentize(black, 0.8); }
|
&:backdrop { box-shadow: inset 0 0 0 4px $borders_color, inset 0 0 0 3px $backdrop_bg_color, inset 0 1px $top_hilight, 0 3px 5px transparentize(black, 0.3); }
|
||||||
}
|
}
|
||||||
|
|
||||||
&.maximized,
|
&.maximized,
|
||||||
|
|
@ -3939,7 +3891,7 @@ window {
|
||||||
&.tiled-bottom {
|
&.tiled-bottom {
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
box-shadow: 0 0 0 1px $_wm_border,
|
box-shadow: 0 0 0 1px $_wm_border,
|
||||||
0 2px 6px 2px transparentize(black, 0.8),
|
0 2px 6px 2px transparentize(black, 0.3),
|
||||||
0 0 0 20px transparent; //transparent control workaround -- #3670
|
0 0 0 20px transparent; //transparent control workaround -- #3670
|
||||||
|
|
||||||
&:backdrop { box-shadow: 0 0 0 1px $_wm_border_backdrop,
|
&:backdrop { box-shadow: 0 0 0 1px $_wm_border_backdrop,
|
||||||
|
|
@ -3953,11 +3905,12 @@ window {
|
||||||
// server-side decorations as used by mutter
|
// server-side decorations as used by mutter
|
||||||
&.ssd { box-shadow: 0 0 0 1px $_wm_border; } //just doing borders, wm draws actual shadows
|
&.ssd { box-shadow: 0 0 0 1px $_wm_border; } //just doing borders, wm draws actual shadows
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
tooltip.csd {
|
tooltip.csd {
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
box-shadow: none;
|
box-shadow: 0 3px 4px transparentize(black, 0.3); //none;
|
||||||
}
|
}
|
||||||
|
|
||||||
// catch all extend :)
|
// catch all extend :)
|
||||||
|
|
@ -3971,40 +3924,8 @@ tooltip.csd {
|
||||||
* Touch Copy & Paste *
|
* Touch Copy & Paste *
|
||||||
*********************/
|
*********************/
|
||||||
//touch selection handlebars for the Popover.osd above
|
//touch selection handlebars for the Popover.osd above
|
||||||
cursor-handle {
|
|
||||||
background-color: transparent;
|
|
||||||
background-image: none;
|
|
||||||
box-shadow: none;
|
|
||||||
border-style: none;
|
|
||||||
min-width: 20px;
|
|
||||||
min-height: 24px;
|
|
||||||
padding-left: 20px;
|
|
||||||
padding-right: 20px;
|
|
||||||
padding-top: 24px;
|
|
||||||
padding-bottom: 24px;
|
|
||||||
|
|
||||||
@each $s,$as in ('',''),
|
@import '../common/cursor-handle.scss';
|
||||||
(':hover','-hover'),
|
|
||||||
(':active','-active') { //no need for insensitive and backdrop
|
|
||||||
&.top#{$s}:dir(ltr), &.bottom#{$s}:dir(rtl) {
|
|
||||||
$_url: '#{$assets}/text-select-start#{$as}#{$asset_suffix}';
|
|
||||||
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
|
||||||
url('#{$_url}@2.png'));
|
|
||||||
}
|
|
||||||
|
|
||||||
&.bottom#{$s}:dir(ltr), &.top#{$s}:dir(rtl) {
|
|
||||||
$_url: '#{$assets}/text-select-end#{$as}#{$asset_suffix}';
|
|
||||||
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
|
||||||
url('#{$_url}@2.png'));
|
|
||||||
}
|
|
||||||
|
|
||||||
&.insertion-cursor#{$s}:dir(ltr), &.insertion-cursor#{$s}:dir(rtl) {
|
|
||||||
$_url: '#{$assets}/slider-horz-scale-has-marks-above#{$as}#{$asset_suffix}';
|
|
||||||
-gtk-icon-source: -gtk-scaled(url('#{$_url}.png'),
|
|
||||||
url('#{$_url}@2.png'));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
shortcuts-section {
|
shortcuts-section {
|
||||||
margin: 20px;
|
margin: 20px;
|
||||||
|
|
|
||||||
|
|
@ -1024,15 +1024,7 @@ scale > trough { transition: outline-width 200ms cubic-bezier(0.25, 0.46, 0.45,
|
||||||
|
|
||||||
scale > trough > fill, scale > trough > highlight { margin: -1px; }
|
scale > trough > fill, scale > trough > highlight { margin: -1px; }
|
||||||
|
|
||||||
scale > trough > slider { min-height: 18px; min-width: 18px; margin: -9px; }
|
scale.fine-tune > trough > slider, scale.fine-tune > trough > slider:active, scale.fine-tune > trough > slider:hover, scale.fine-tune > trough > slider:focus { background-color: #6789b4; }
|
||||||
|
|
||||||
scale.fine-tune.horizontal { padding-top: 9px; padding-bottom: 9px; min-height: 16px; }
|
|
||||||
|
|
||||||
scale.fine-tune.vertical { padding-left: 9px; padding-right: 9px; min-width: 16px; }
|
|
||||||
|
|
||||||
scale.fine-tune > trough > slider { margin: -6px; }
|
|
||||||
|
|
||||||
scale.fine-tune > trough > fill, scale.fine-tune > trough > highlight, scale.fine-tune > trough { border-radius: 5px; }
|
|
||||||
|
|
||||||
scale > trough > fill:disabled { border-color: transparent; background-color: transparent; }
|
scale > trough > fill:disabled { border-color: transparent; background-color: transparent; }
|
||||||
|
|
||||||
|
|
@ -1040,7 +1032,7 @@ scale > trough > fill:disabled { border-color: transparent; background-color: tr
|
||||||
|
|
||||||
.osd scale > trough > fill:disabled { border-color: transparent; background-color: transparent; }
|
.osd scale > trough > fill:disabled { border-color: transparent; background-color: transparent; }
|
||||||
|
|
||||||
scale > trough > slider { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); border-width: 1px; border-style: solid; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; }
|
scale > trough > slider { min-height: 18px; min-width: 18px; margin: -9px; color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); border-width: 1px; border-style: solid; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; }
|
||||||
|
|
||||||
scale > trough > slider:hover { background-color: shade(#bcbeb9, 1.1); }
|
scale > trough > slider:hover { background-color: shade(#bcbeb9, 1.1); }
|
||||||
|
|
||||||
|
|
@ -1072,15 +1064,9 @@ scale.horizontal > value.left { margin-right: 9px; }
|
||||||
|
|
||||||
scale.horizontal > value.right { margin-left: 9px; }
|
scale.horizontal > value.right { margin-left: 9px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune > marks.top { margin-top: 3px; }
|
scale.horizontal.marks-after slider { border-radius: 5px 5px 100% 100%; min-width: 10px; padding: 0; margin-right: 5px; margin-left: 5px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune > marks.bottom { margin-bottom: 3px; }
|
scale.horizontal.marks-before slider { border-radius: 100% 100% 5px 5px; min-width: 10px; padding: 0; margin-right: 5px; margin-left: 5px; }
|
||||||
|
|
||||||
scale.horizontal.fine-tune > marks indicator { min-height: 3px; }
|
|
||||||
|
|
||||||
scale.horizontal.marks-after slider { border-radius: 5px 5px 100% 100%; }
|
|
||||||
|
|
||||||
scale.horizontal.marks-before slider { border-radius: 100% 100% 5px 5px; }
|
|
||||||
|
|
||||||
scale.vertical > marks { color: alpha(currentColor,0.55); }
|
scale.vertical > marks { color: alpha(currentColor,0.55); }
|
||||||
|
|
||||||
|
|
@ -1094,15 +1080,9 @@ scale.vertical > value.top { margin-bottom: 9px; }
|
||||||
|
|
||||||
scale.vertical > value.bottom { margin-top: 9px; }
|
scale.vertical > value.bottom { margin-top: 9px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune > marks.top { margin-left: 3px; }
|
scale.vertical.marks-after slider { border-radius: 5px 100% 100% 5px; min-height: 10px; padding: 0; margin-top: 54px; margin-bottom: 5px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune > marks.bottom { margin-right: 3px; }
|
scale.vertical.marks-before slider { border-radius: 100% 5px 5px 100%; min-height: 10px; padding: 0; margin-top: 5px; margin-bottom: 5px; }
|
||||||
|
|
||||||
scale.vertical.fine-tune > marks indicator { min-height: 3px; }
|
|
||||||
|
|
||||||
scale.vertical.marks-after slider { border-radius: 5px 100% 100% 5px; }
|
|
||||||
|
|
||||||
scale.vertical.marks-before slider { border-radius: 100% 5px 5px 100%; }
|
|
||||||
|
|
||||||
scale.color { min-height: 0; min-width: 0; }
|
scale.color { min-height: 0; min-width: 0; }
|
||||||
|
|
||||||
|
|
@ -1126,24 +1106,6 @@ scale.color.vertical:dir(rtl) > trough { padding-right: 4px; background-position
|
||||||
|
|
||||||
scale.color.vertical:dir(rtl) > trough > slider:hover, scale.color.vertical:dir(rtl) > trough > slider:backdrop, scale.color.vertical:dir(rtl) > trough > slider:disabled, scale.color.vertical:dir(rtl) > trough > slider:backdrop:disabled, scale.color.vertical:dir(rtl) > trough > slider { margin-right: -15px; margin-left: 6px; }
|
scale.color.vertical:dir(rtl) > trough > slider:hover, scale.color.vertical:dir(rtl) > trough > slider:backdrop, scale.color.vertical:dir(rtl) > trough > slider:disabled, scale.color.vertical:dir(rtl) > trough > slider:backdrop:disabled, scale.color.vertical:dir(rtl) > trough > slider { margin-right: -15px; margin-left: 6px; }
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr), scale.color.fine-tune.horizontal:dir(rtl) { padding: 0 0 12px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr) > trough, scale.color.fine-tune.horizontal:dir(rtl) > trough { padding-bottom: 7px; background-position: 0 -6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.horizontal:dir(ltr) > trough > slider, scale.color.fine-tune.horizontal:dir(rtl) > trough > slider { margin-bottom: -15px; margin-top: 6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) { padding: 0 0 0 12px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) > trough { padding-left: 7px; background-position: 6px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(ltr) > trough > slider { margin-left: -15px; margin-right: 6px; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) { padding: 0 12px 0 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) > trough { padding-right: 7px; background-position: -6px 0; }
|
|
||||||
|
|
||||||
scale.color.fine-tune.vertical:dir(rtl) > trough > slider { margin-right: -15px; margin-left: 6px; }
|
|
||||||
|
|
||||||
/***************** Progress bars * */
|
/***************** Progress bars * */
|
||||||
progressbar { font-size: smaller; color: rgba(36, 31, 49, 0.4); font-feature-settings: "tnum"; }
|
progressbar { font-size: smaller; color: rgba(36, 31, 49, 0.4); font-feature-settings: "tnum"; }
|
||||||
|
|
||||||
|
|
@ -1483,9 +1445,9 @@ video { background: black; }
|
||||||
video image.osd { min-width: 64px; min-height: 64px; border-radius: 32px; }
|
video image.osd { min-width: 64px; min-height: 64px; border-radius: 32px; }
|
||||||
|
|
||||||
/************ Tooltips * */
|
/************ Tooltips * */
|
||||||
tooltip { padding: 6px 10px; border-radius: 8px; box-shadow: none; }
|
tooltip { padding: 6px 10px; border-radius: 8px; }
|
||||||
|
|
||||||
tooltip.background { background-color: rgba(103, 137, 180, 0.8); background-clip: padding-box; border: 1px solid #002269; color: #002269; }
|
tooltip.background { background-color: rgba(103, 137, 180, 0.9); background-clip: padding-box; border: 1px solid #002269; color: #002269; }
|
||||||
|
|
||||||
tooltip > box { border-spacing: 6px; }
|
tooltip > box { border-spacing: 6px; }
|
||||||
|
|
||||||
|
|
@ -1584,13 +1546,13 @@ window.csd.popup { border-radius: 5px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2),
|
||||||
|
|
||||||
window.csd.dialog.message { border-radius: 8px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
window.csd.dialog.message { border-radius: 8px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.13); }
|
||||||
|
|
||||||
window.solid-csd { margin: 0; padding: 4px; border: solid 1px #797979; border-radius: 0; box-shadow: inset 0 0 0 4px #797979, inset 0 0 0 3px #b4b4b4, inset 0 1px rgba(255, 255, 255, 0.8), 0 1px 5px rgba(0, 0, 0, 0.2); }
|
window.solid-csd { margin: 0; padding: 4px; border: solid 1px #797979; border-radius: 0; box-shadow: inset 0 0 0 4px #797979, inset 0 0 0 3px #b4b4b4, inset 0 1px rgba(255, 255, 255, 0.8), 0 3px 5px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
window.solid-csd:backdrop { box-shadow: inset 0 0 0 4px #797979, inset 0 0 0 3px #a7a7a7, inset 0 1px rgba(255, 255, 255, 0.8), 0 1px 5px rgba(0, 0, 0, 0.2); }
|
window.solid-csd:backdrop { box-shadow: inset 0 0 0 4px #797979, inset 0 0 0 3px #a7a7a7, inset 0 1px rgba(255, 255, 255, 0.8), 0 3px 5px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
window.maximized, window.fullscreen { border-radius: 0; box-shadow: none; }
|
window.maximized, window.fullscreen { border-radius: 0; box-shadow: none; }
|
||||||
|
|
||||||
window.tiled, window.tiled-top, window.tiled-left, window.tiled-right, window.tiled-bottom { border-radius: 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.23), 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 20px transparent; }
|
window.tiled, window.tiled-top, window.tiled-left, window.tiled-right, window.tiled-bottom { border-radius: 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.23), 0 2px 6px 2px rgba(0, 0, 0, 0.7), 0 0 0 20px transparent; }
|
||||||
|
|
||||||
window.tiled:backdrop, window.tiled-top:backdrop, window.tiled-left:backdrop, window.tiled-right:backdrop, window.tiled-bottom:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.4), 0 0 0 20px transparent; }
|
window.tiled:backdrop, window.tiled-top:backdrop, window.tiled-left:backdrop, window.tiled-right:backdrop, window.tiled-bottom:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18), 0 2px 6px 2px rgba(0, 0, 0, 0.4), 0 0 0 20px transparent; }
|
||||||
|
|
||||||
|
|
@ -1598,30 +1560,23 @@ window.popup { box-shadow: none; }
|
||||||
|
|
||||||
window.ssd { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.23); }
|
window.ssd { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.23); }
|
||||||
|
|
||||||
tooltip.csd { border-radius: 5px; box-shadow: none; }
|
tooltip.csd { border-radius: 5px; box-shadow: 0 3px 4px rgba(0, 0, 0, 0.7); }
|
||||||
|
|
||||||
.monospace { font-family: monospace; }
|
.monospace { font-family: monospace; }
|
||||||
|
|
||||||
/********************** Touch Copy & Paste * */
|
/********************** Touch Copy & Paste * */
|
||||||
cursor-handle { background-color: transparent; background-image: none; box-shadow: none; border-style: none; min-width: 20px; min-height: 24px; padding-left: 20px; padding-right: 20px; padding-top: 24px; padding-bottom: 24px; }
|
/********************** Touch Copy & Paste * */
|
||||||
|
cursor-handle { color: #241f31; background-color: #bcbeb9; border-color: #241f31; outline-color: rgba(176, 221, 126, 0.5); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.15)); text-shadow: 0 1px rgba(255, 255, 255, 0.3); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.3); box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 1px 2px rgba(0, 0, 0, 0.4); border: 1px solid #626262; border-radius: 100%; transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-property: background, border, box-shadow; min-height: 18px; min-width: 10px; }
|
||||||
|
|
||||||
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start.png"), url("assets/text-select-start@2.png")); }
|
cursor-handle:hover { background-color: shade(#bcbeb9, 1.1); }
|
||||||
|
|
||||||
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end.png"), url("assets/text-select-end@2.png")); }
|
cursor-handle:active { border-color: #8bcd41; }
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:dir(ltr), cursor-handle.insertion-cursor:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above.png"), url("assets/slider-horz-scale-has-marks-above@2.png")); }
|
cursor-handle:disabled { color: #552222; background-color: #938989; background-image: none; }
|
||||||
|
|
||||||
cursor-handle.top:hover:dir(ltr), cursor-handle.bottom:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start-hover.png"), url("assets/text-select-start-hover@2.png")); }
|
cursor-handle.top:dir(ltr), cursor-handle.bottom:dir(rtl) { border-radius: 100% 5px 5px 5px; }
|
||||||
|
|
||||||
cursor-handle.bottom:hover:dir(ltr), cursor-handle.top:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end-hover.png"), url("assets/text-select-end-hover@2.png")); }
|
cursor-handle.bottom:dir(ltr), cursor-handle.top:dir(rtl) { border-radius: 5px 100% 5px 5px; }
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:hover:dir(ltr), cursor-handle.insertion-cursor:hover:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-hover.png"), url("assets/slider-horz-scale-has-marks-above-hover@2.png")); }
|
|
||||||
|
|
||||||
cursor-handle.top:active:dir(ltr), cursor-handle.bottom:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-start-active.png"), url("assets/text-select-start-active@2.png")); }
|
|
||||||
|
|
||||||
cursor-handle.bottom:active:dir(ltr), cursor-handle.top:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/text-select-end-active.png"), url("assets/text-select-end-active@2.png")); }
|
|
||||||
|
|
||||||
cursor-handle.insertion-cursor:active:dir(ltr), cursor-handle.insertion-cursor:active:dir(rtl) { -gtk-icon-source: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-active.png"), url("assets/slider-horz-scale-has-marks-above-active@2.png")); }
|
|
||||||
|
|
||||||
shortcuts-section { margin: 20px; }
|
shortcuts-section { margin: 20px; }
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue