Browse Source

Add inverted scrollbar styles

pull/4574/merge
Jack 7 years ago
parent
commit
9ef8f0e855
2 changed files with 23 additions and 0 deletions
  1. 17
      src/definitions/modules/dimmer.less
  2. 6
      src/themes/default/globals/site.variables

17
src/definitions/modules/dimmer.less

@ -69,6 +69,23 @@
border-radius: inherit !important;
}
/* Scrollbars */
.addScrollbars() when (@useCustomScrollbars) {
.ui.dimmer:not(.inverted)::-webkit-scrollbar-track {
background: @trackInvertedBackground;
}
.ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb {
background: @thumbInvertedBackground;
}
.ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb:window-inactive {
background: @thumbInvertedInactiveBackground;
}
.ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb:hover {
background: @thumbInvertedHoverBackground;
}
}
.addScrollbars();
/*******************************
States
*******************************/

6
src/themes/default/globals/site.variables

@ -157,6 +157,12 @@
@thumbInactiveBackground: rgba(0, 0, 0, 0.15);
@thumbHoverBackground: rgba(128, 135, 139, 0.8);
/* Inverted */
@trackInvertedBackground: rgba(255, 255, 255, 0.1);
@thumbInvertedBackground: rgba(255, 255, 255, 0.25);
@thumbInvertedInactiveBackground: rgba(255, 255, 255, 0.15);
@thumbInvertedHoverBackground: rgba(255, 255, 255, 0.35);
/*-------------------
Highlighted Text
--------------------*/

Loading…
Cancel
Save