diff --git a/ionic/components.core.scss b/ionic/components.core.scss index bfa6adbfbc..9d1f1e497a 100644 --- a/ionic/components.core.scss +++ b/ionic/components.core.scss @@ -3,6 +3,7 @@ @import "components/app/normalize", "components/app/structure", + "components/app/scrollbars", "components/app/typography", "util/util"; diff --git a/ionic/components/app/scrollbars.scss b/ionic/components/app/scrollbars.scss new file mode 100644 index 0000000000..40a9669e93 --- /dev/null +++ b/ionic/components/app/scrollbars.scss @@ -0,0 +1,27 @@ + +// Scrollbars +// -------------------------------------------------- +// Styling for dekstop webkit browsers +// These do not apply for mobile browsers + +::-webkit-scrollbar { + width: 9px; +} + +::-webkit-scrollbar-thumb:vertical, +::-webkit-scrollbar-thumb:horizontal { + background: rgba(0, 0, 0, 0.4); + border: 2px solid transparent; + border-radius: 20px; + background-clip: padding-box; + min-height: 10px; +} + +::-webkit-scrollbar-thumb:vertical:active, +::-webkit-scrollbar-thumb:horizontal:active { + background: rgba(0, 0, 0, 0.6); + border: 2px solid transparent; + border-radius: 20px; + background-clip: padding-box; + min-height: 10px; +}