Merge pull request #1493 from rhamilto/catalog-scrollbar

Merged by openshift-bot

Author: OpenShift Bot

app/styles/_scrollbars.less

@@ -31,7 +31,9 @@
   // box-shadow: inset 1px 0 0 rgba(0,0,0,.1);
 }
 
-.log-view.log-fixed-height, .navbar-project-menu {
+landing-page,
+.log-view.log-fixed-height,
+.navbar-project-menu {
   ::-webkit-scrollbar-thumb {
     background-color: @scrollbar-thumb-inverse;
     -webkit-box-shadow: inset 1px 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(255,255,255,.07);
@@ -46,6 +48,14 @@
   }
 }
 
+.landing::-webkit-scrollbar-track {
+  background-color: @scrollbar-track-landing;
+}
+
+.landing-side-bar::-webkit-scrollbar-track {
+  background-color: @scrollbar-track-landing-side-bar;
+}
+
 .log-view.log-fixed-height {
   ::-webkit-scrollbar {
     width: @scrollbar-width-log-viewer;

app/styles/_variables.less

@@ -113,6 +113,8 @@
 @scrollbar-track: rgba(0,0,0,.03);
 @scrollbar-track-inverse: @sidebar-os-border-color;
 @scrollbar-track-inverse-alt: rgba(255,255,255,.1);
+@scrollbar-track-landing: #042e43;
+@scrollbar-track-landing-side-bar: darken(#2C343D, 5%); // #2C343D is @landing-side-bar-bg in catalog
 @scrollbar-width: 15px;
 @scrollbar-width-log-viewer: 17px;
 @status-bg-color: #E6ECF1;

dist/styles/main.css

@@ -5045,9 +5045,11 @@ td.visible-print,th.visible-print{display:table-cell!important}
 ::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.08);background-clip:padding-box;border:solid transparent;border-width:1px;min-height:28px;max-height:60px;padding:100px 0 0;-webkit-box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07);box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07)}
 ::-webkit-scrollbar-thumb:active,::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.18)}
 ::-webkit-scrollbar-track{background-clip:padding-box;background-color:rgba(0,0,0,.03)}
-.log-view.log-fixed-height ::-webkit-scrollbar-thumb,.navbar-project-menu ::-webkit-scrollbar-thumb{background-color:rgba(255,255,255,.25);-webkit-box-shadow:inset 1px 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(255,255,255,.07);box-shadow:inset 1px 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(255,255,255,.07)}
-.log-view.log-fixed-height ::-webkit-scrollbar-thumb:active,.log-view.log-fixed-height ::-webkit-scrollbar-thumb:hover,.navbar-project-menu ::-webkit-scrollbar-thumb:active,.navbar-project-menu ::-webkit-scrollbar-thumb:hover{background-color:rgba(255,255,255,.35)}
-.log-view.log-fixed-height ::-webkit-scrollbar-track,.navbar-project-menu ::-webkit-scrollbar-track{background-color:#050505}
+.log-view.log-fixed-height ::-webkit-scrollbar-thumb,.navbar-project-menu ::-webkit-scrollbar-thumb,landing-page ::-webkit-scrollbar-thumb{background-color:rgba(255,255,255,.25);-webkit-box-shadow:inset 1px 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(255,255,255,.07);box-shadow:inset 1px 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(255,255,255,.07)}
+.log-view.log-fixed-height ::-webkit-scrollbar-thumb:active,.log-view.log-fixed-height ::-webkit-scrollbar-thumb:hover,.navbar-project-menu ::-webkit-scrollbar-thumb:active,.navbar-project-menu ::-webkit-scrollbar-thumb:hover,landing-page ::-webkit-scrollbar-thumb:active,landing-page ::-webkit-scrollbar-thumb:hover{background-color:rgba(255,255,255,.35)}
+.log-view.log-fixed-height ::-webkit-scrollbar-track,.navbar-project-menu ::-webkit-scrollbar-track,landing-page ::-webkit-scrollbar-track{background-color:#050505}
+.landing::-webkit-scrollbar-track{background-color:#042e43}
+.landing-side-bar::-webkit-scrollbar-track{background-color:#21272e}
 .log-view.log-fixed-height ::-webkit-scrollbar{width:17px}
 .log-view.log-fixed-height ::-webkit-scrollbar-track{background-color:rgba(255,255,255,.1)}
 .osc-secrets-form .advanced-secrets .help-blocks,.osc-secrets-form .advanced-secrets .input-labels,.osc-secrets-form .basic-secrets .help-blocks,.osc-secrets-form .basic-secrets .input-labels{display:table;padding-right:30px;position:relative;width:100%}