ux: added scroll to two pages

public/app/features/admin/partials/configuration_home.html

@@ -1,34 +1,35 @@
 <div class="scroll-canvas">
-  <navbar model="ctrl.navModel"></navbar>
-	<div class="page-container">
-		<div class="page-header">
-      <page-h1 model="ctrl.navModel"></page-h1>
-		</div>
+  <div gemini-scrollbar>
+    <navbar model="ctrl.navModel"></navbar>
+    <div class="page-container">
+      <div class="page-header">
+        <page-h1 model="ctrl.navModel"></page-h1>
+      </div>
 
-		<section class="card-section card-list-layout-grid">
-			<ol class="card-list" >
-				<li class="card-item-wrapper" ng-repeat="navItem in ctrl.navModel.node.children">
-					<a class="card-item" ng-href="{{::navItem.url}}">
-						<div class="card-item-header">
-							<div class="card-item-type">
-							</div>
-						</div>
-						<div class="card-item-body">
-							<figure class="card-item-figure">
-								<i class="{{navItem.icon}}"></i>
-							</figure>
-							<div class="card-item-details">
-								<div class="card-item-name">
-									{{navItem.text}}
-								</div>
-								<div class="card-item-sub-name">
-									{{navItem.description}}
-								</div>
-							</div>
-						</div>
-					</a>
-				</li>
-			</ol>
-		</section>
-	</div>
-</div>
+      <section class="card-section card-list-layout-grid">
+        <ol class="card-list" >
+          <li class="card-item-wrapper" ng-repeat="navItem in ctrl.navModel.node.children">
+            <a class="card-item" ng-href="{{::navItem.url}}">
+              <div class="card-item-header">
+                <div class="card-item-type">
+                </div>
+              </div>
+              <div class="card-item-body">
+                <figure class="card-item-figure">
+                  <i class="{{navItem.icon}}"></i>
+                </figure>
+                <div class="card-item-details">
+                  <div class="card-item-name">
+                    {{navItem.text}}
+                  </div>
+                  <div class="card-item-sub-name">
+                    {{navItem.description}}
+                  </div>
+                </div>
+              </div>
+            </a>
+          </li>
+        </ol>
+      </section>
+    </div>
+  </div>

public/app/features/plugins/partials/plugin_list.html

@@ -1,64 +1,68 @@
-<navbar model="ctrl.navModel"></navbar>
+<div class="scroll-canvas">
+  <div gemini-scrollbar>
 
-<div class="page-container">
-  <div class="page-header">
-    <h1>
-			<i class="icon-gf icon-gf-apps"></i>
-			Plugins <span class="muted small">(currently installed)</span>
-		</h1>
+    <navbar model="ctrl.navModel"></navbar>
 
-		<div class="page-header-tabs">
-			<ul class="gf-tabs">
-				<li class="gf-tabs-item">
-					<a class="gf-tabs-link" href="plugins?type=panel" ng-class="{active: ctrl.tabIndex === 0}">
-						Panels
-					</a>
-				</li>
-				<li class="gf-tabs-item">
-					<a class="gf-tabs-link" href="plugins?type=datasource" ng-class="{active: ctrl.tabIndex === 1}">
-						Data sources
-					</a>
-				</li>
-				<li class="gf-tabs-item">
-					<a class="gf-tabs-link" href="plugins?type=app" ng-class="{active: ctrl.tabIndex === 2}">
-						Apps
-					</a>
-				</li>
-			</ul>
+    <div class="page-container">
+      <div class="page-header">
+        <h1>
+          <i class="icon-gf icon-gf-apps"></i>
+          Plugins <span class="muted small">(currently installed)</span>
+        </h1>
 
-      <a class="get-more-plugins-link" href="https://grafana.com/plugins?utm_source=grafana_plugin_list" target="_blank">
-        Find more <img src="public/img/icn-plugins-tiny.svg" />plugins on Grafana.com
-      </a>
-    </div>
-  </div>
+        <div class="page-header-tabs">
+          <ul class="gf-tabs">
+            <li class="gf-tabs-item">
+              <a class="gf-tabs-link" href="plugins?type=panel" ng-class="{active: ctrl.tabIndex === 0}">
+                Panels
+              </a>
+            </li>
+            <li class="gf-tabs-item">
+              <a class="gf-tabs-link" href="plugins?type=datasource" ng-class="{active: ctrl.tabIndex === 1}">
+                Data sources
+              </a>
+            </li>
+            <li class="gf-tabs-item">
+              <a class="gf-tabs-link" href="plugins?type=app" ng-class="{active: ctrl.tabIndex === 2}">
+                Apps
+              </a>
+            </li>
+          </ul>
 
-  <section class="card-section" layout-mode>
-    <layout-selector></layout-selector>
+          <a class="get-more-plugins-link" href="https://grafana.com/plugins?utm_source=grafana_plugin_list" target="_blank">
+            Find more <img src="public/img/icn-plugins-tiny.svg" />plugins on Grafana.com
+          </a>
+        </div>
+      </div>
 
-    <ol class="card-list" >
-      <li class="card-item-wrapper" ng-repeat="plugin in ctrl.plugins">
-        <a class="card-item" href="plugins/{{plugin.id}}/edit">
-          <div class="card-item-header">
-            <div class="card-item-type">
-              <i class="icon-gf icon-gf-{{plugin.type}}"></i>
-              {{plugin.type}}
-            </div>
-            <div class="card-item-notice" ng-show="plugin.hasUpdate">
-              <span bs-tooltip="plugin.latestVersion">Update available!</span>
-            </div>
-          </div>
-          <div class="card-item-body">
-            <figure class="card-item-figure">
-              <img ng-src="{{plugin.info.logos.small}}">
-            </figure>
-            <div class="card-item-details">
-              <div class="card-item-name">{{plugin.name}}</div>
-              <div class="card-item-sub-name">By {{plugin.info.author.name}}</div>
-            </div>
-          </div>
-        </a>
-      </li>
-    </ol>
-  </section>
+      <section class="card-section" layout-mode>
+        <layout-selector></layout-selector>
 
+        <ol class="card-list" >
+          <li class="card-item-wrapper" ng-repeat="plugin in ctrl.plugins">
+            <a class="card-item" href="plugins/{{plugin.id}}/edit">
+              <div class="card-item-header">
+                <div class="card-item-type">
+                  <i class="icon-gf icon-gf-{{plugin.type}}"></i>
+                  {{plugin.type}}
+                </div>
+                <div class="card-item-notice" ng-show="plugin.hasUpdate">
+                  <span bs-tooltip="plugin.latestVersion">Update available!</span>
+                </div>
+              </div>
+              <div class="card-item-body">
+                <figure class="card-item-figure">
+                  <img ng-src="{{plugin.info.logos.small}}">
+                </figure>
+                <div class="card-item-details">
+                  <div class="card-item-name">{{plugin.name}}</div>
+                  <div class="card-item-sub-name">By {{plugin.info.author.name}}</div>
+                </div>
+              </div>
+            </a>
+          </li>
+        </ol>
+      </section>
+    </div>
+  </div>
 </div>