library/perfect-scrollbar/perfect-scrollbar.css

   1 /* perfect-scrollbar v0.6.10 */
   2 .ps-container {
   3   -ms-touch-action: none;
   4   touch-action: none;
   5   overflow: hidden !important;
   6   -ms-overflow-style: none; }
   7   @supports (-ms-overflow-style: none) {
   8     .ps-container {
   9       overflow: auto !important; } }
  10   @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  11     .ps-container {
  12       overflow: auto !important; } }
  13   .ps-container.ps-active-x > .ps-scrollbar-x-rail,
  14   .ps-container.ps-active-y > .ps-scrollbar-y-rail {
  15     display: block;
  16     background-color: transparent; }
  17   .ps-container.ps-in-scrolling {
  18     pointer-events: none; }
  19     .ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
  20       background-color: #eee;
  21       opacity: 0.9; }
  22       .ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  23         background-color: #999; }
  24     .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
  25       background-color: #eee;
  26       opacity: 0.9; }
  27       .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  28         background-color: #999; }
  29   .ps-container > .ps-scrollbar-x-rail {
  30     display: none;
  31     position: absolute;
  32     /* please don't change 'position' */
  33     -webkit-border-radius: 4px;
  34     -moz-border-radius: 4px;
  35     border-radius: 4px;
  36     opacity: 0;
  37     -webkit-transition: background-color .2s linear, opacity .2s linear;
  38     -moz-transition: background-color .2s linear, opacity .2s linear;
  39     -o-transition: background-color .2s linear, opacity .2s linear;
  40     transition: background-color .2s linear, opacity .2s linear;
  41     bottom: 3px;
  42     /* there must be 'bottom' for ps-scrollbar-x-rail */
  43     height: 8px; }
  44     .ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  45       position: absolute;
  46       /* please don't change 'position' */
  47       background-color: #aaa;
  48       -webkit-border-radius: 4px;
  49       -moz-border-radius: 4px;
  50       border-radius: 4px;
  51       -webkit-transition: background-color .2s linear;
  52       -moz-transition: background-color .2s linear;
  53       -o-transition: background-color .2s linear;
  54       transition: background-color .2s linear;
  55       bottom: 0;
  56       /* there must be 'bottom' for ps-scrollbar-x */
  57       height: 8px; }
  58   .ps-container > .ps-scrollbar-y-rail {
  59     display: none;
  60     position: absolute;
  61     /* please don't change 'position' */
  62     -webkit-border-radius: 4px;
  63     -moz-border-radius: 4px;
  64     border-radius: 4px;
  65     opacity: 0;
  66     -webkit-transition: background-color .2s linear, opacity .2s linear;
  67     -moz-transition: background-color .2s linear, opacity .2s linear;
  68     -o-transition: background-color .2s linear, opacity .2s linear;
  69     transition: background-color .2s linear, opacity .2s linear;
  70     right: 3px;
  71     /* there must be 'right' for ps-scrollbar-y-rail */
  72     width: 8px; }
  73     .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  74       position: absolute;
  75       /* please don't change 'position' */
  76       background-color: #aaa;
  77       -webkit-border-radius: 4px;
  78       -moz-border-radius: 4px;
  79       border-radius: 4px;
  80       -webkit-transition: background-color .2s linear;
  81       -moz-transition: background-color .2s linear;
  82       -o-transition: background-color .2s linear;
  83       transition: background-color .2s linear;
  84       right: 0;
  85       /* there must be 'right' for ps-scrollbar-y */
  86       width: 8px; }
  87   .ps-container:hover.ps-in-scrolling {
  88     pointer-events: none; }
  89     .ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
  90       background-color: #eee;
  91       opacity: 0.9; }
  92       .ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  93         background-color: #999; }
  94     .ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
  95       background-color: #eee;
  96       opacity: 0.9; }
  97       .ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  98         background-color: #999; }
  99   .ps-container:hover > .ps-scrollbar-x-rail,
 100   .ps-container:hover > .ps-scrollbar-y-rail {
 101     opacity: 0.6; }
 102   .ps-container:hover > .ps-scrollbar-x-rail:hover {
 103     background-color: #eee;
 104     opacity: 0.9; }
 105     .ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x {
 106       background-color: #999; }
 107   .ps-container:hover > .ps-scrollbar-y-rail:hover {
 108     background-color: #eee;
 109     opacity: 0.9; }
 110     .ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y {
 111       background-color: #999; }