98 lines
3.1 KiB
CSS
98 lines
3.1 KiB
CSS
.mCustomScrollBox { /* contains plugin's markup */
|
|
position: relative;
|
|
overflow: hidden;
|
|
height: 100%;
|
|
max-width: 100%;
|
|
outline: none;
|
|
direction: ltr;
|
|
}
|
|
.mCSB_container { /* contains the original content */
|
|
overflow: hidden;
|
|
width: auto;
|
|
height: auto;
|
|
}
|
|
/*
|
|
------------------------------------------------------------------------------------------------------------------------
|
|
2. VERTICAL SCROLLBAR
|
|
y-axis
|
|
------------------------------------------------------------------------------------------------------------------------
|
|
*/
|
|
|
|
.mCSB_inside > .mCSB_container {
|
|
margin-right: 30px;
|
|
}
|
|
.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
|
|
margin-right: 0;
|
|
} /* non-visible scrollbar */
|
|
.mCS-dir-rtl > .mCSB_inside > .mCSB_container { /* RTL direction/left-side scrollbar */
|
|
margin-right: 0;
|
|
margin-left: 30px;
|
|
}
|
|
.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden {
|
|
margin-left: 0;
|
|
} /* RTL direction/left-side scrollbar */
|
|
.mCSB_scrollTools { /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */
|
|
position: absolute;
|
|
width: 16px;
|
|
height: auto;
|
|
left: auto;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
}
|
|
.mCSB_scrollTools .mCSB_draggerContainer { /* contains the draggable element and dragger rail markup */
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
height: auto;
|
|
}
|
|
.mCSB_scrollTools .mCSB_dragger { /* the draggable element */
|
|
cursor: pointer;
|
|
width: 100%;
|
|
height: 30px; /* minimum dragger height */
|
|
z-index: 1;
|
|
}
|
|
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { /* the dragger element */
|
|
position: relative;
|
|
width: 4px;
|
|
height: 100%;
|
|
margin: 0 auto;
|
|
-webkit-border-radius: 16px;
|
|
-moz-border-radius: 16px;
|
|
border-radius: 16px;
|
|
text-align: center;
|
|
}
|
|
/*
|
|
------------------------------------------------------------------------------------------------------------------------
|
|
6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
|
|
------------------------------------------------------------------------------------------------------------------------
|
|
*/
|
|
|
|
.mCSB_scrollTools {
|
|
opacity: 0.75;
|
|
filter: "alpha(opacity=75)";
|
|
-ms-filter: "alpha(opacity=75)";
|
|
}
|
|
.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools {
|
|
opacity: 0;
|
|
filter: "alpha(opacity=0)";
|
|
-ms-filter: "alpha(opacity=0)";
|
|
}
|
|
.mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollBox:hover > .mCSB_scrollTools, .mCustomScrollBox:hover ~ .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools {
|
|
opacity: 1;
|
|
filter: "alpha(opacity=100)";
|
|
-ms-filter: "alpha(opacity=100)";
|
|
}
|
|
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
|
|
background-color: #fff;
|
|
background-color: rgba(255, 255, 255, 0.75);
|
|
filter: "alpha(opacity=75)";
|
|
-ms-filter: "alpha(opacity=75)";
|
|
}
|
|
.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical {
|
|
right: 0;
|
|
margin: 12px 0;
|
|
}
|