From cd5b17b0022b2856d04740cbd33571b4048a6903 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel.odegaard@gmail.com>
Date: Wed, 15 Jan 2014 17:21:00 +0100
Subject: [PATCH] fix: segment dropdown is now scrollable

---
 src/app/panels/graphite/editor.html    |  2 +-
 src/vendor/bootstrap/less/grafana.less | 48 ++++++++++++++++++++++++++
 2 files changed, 49 insertions(+), 1 deletion(-)

diff --git a/src/app/panels/graphite/editor.html b/src/app/panels/graphite/editor.html
index 87bbc27b9b9..13194a91b94 100644
--- a/src/app/panels/graphite/editor.html
+++ b/src/app/panels/graphite/editor.html
@@ -72,7 +72,7 @@
                 focus-me="segment.focus"
                 ng-bind-html-unsafe="segment.html">
             </a>
-            <ul class="dropdown-menu" role="menu">
+            <ul class="dropdown-menu scrollable" role="menu">
               <li ng-repeat="altSegment in altSegments" role="menuitem">
                 <a href="javascript:void(0)" tabindex="1" ng-click="setSegment($index, $parent.$index)" ng-bind-html-unsafe="altSegment.html"></a>
               </li>
diff --git a/src/vendor/bootstrap/less/grafana.less b/src/vendor/bootstrap/less/grafana.less
index be13d87d5ce..df93f83d375 100644
--- a/src/vendor/bootstrap/less/grafana.less
+++ b/src/vendor/bootstrap/less/grafana.less
@@ -345,4 +345,52 @@ input[type=text].func-param {
   .editor-row {
     padding: 5px;
   }
+}
+
+.scrollable {
+  max-height: 300px;
+  overflow: auto;
+}
+
+
+//
+// Srollbars
+//
+
+::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+::-webkit-scrollbar:hover {
+  height: 8px;
+}
+
+::-webkit-scrollbar-button:start:decrement,
+::-webkit-scrollbar-button:end:increment { display: none;  }
+::-webkit-scrollbar-button:horizontal:decrement {  display: none; }
+::-webkit-scrollbar-button:horizontal:increment {  display: none; }
+::-webkit-scrollbar-button:vertical:decrement { display: none; }
+::-webkit-scrollbar-button:vertical:increment { display: none; }
+::-webkit-scrollbar-button:horizontal:decrement:active { background-image: none; }
+::-webkit-scrollbar-button:horizontal:increment:active { background-image: none; }
+::-webkit-scrollbar-button:vertical:decrement:active { background-image: none; }
+::-webkit-scrollbar-button:vertical:increment:active {background-image: none; }
+
+::-webkit-scrollbar-track-piece { background-color: grayDark; }
+
+::-webkit-scrollbar-thumb:vertical {
+  height: 50px;
+  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #3a3a3a), color-stop(100%, #222222));
+  border: 1px solid #0d0d0d;
+  border-top: 1px solid #666666;
+  border-left: 1px solid #666666;
+}
+
+::-webkit-scrollbar-thumb:horizontal {
+  width: 50px;
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3a3a3a), color-stop(100%, #222222));
+  border: 1px solid #1f1f1f;
+  border-top: 1px solid #666666;
+  border-left: 1px solid #666666;
 }
\ No newline at end of file