Repository: zeppelin
Updated Branches:
  refs/heads/master 5556f8152 -> 1ccbd602a


[ZEPPELIN-1085] Make dropdown menu scrollbar always visible

### What is this PR for?
In Zeppelin docs website, there are 4 dropdown menus(Quick Start, Interpreters, 
Display System and More) in the navbar. Especially **Interpreters** and 
**More** menu have lots of lists so I made this dropdown menu scrollable in 
#1004.
Originally the scroll bar is shown up when  a user is trying to scroll down. 
That's why it's hard to notice there are more menus in the dropdown menu.  See 
[this issue](https://issues.apache.org/jira/browse/ZEPPELIN-1085).

So I made this scroll bar always visible. But only for chrome & safari. 
Unfortunately, Firefox doesn't support custom scroll bar. See 
[here](http://stackoverflow.com/questions/18317634/force-visible-scrollbar-in-firefox-on-mac-os-x).
In short, it says
>There is no way to actually "force" Firefox render the old-style scrollbar 
>since the default scrollbar used in the system is predefined by the OS itself 
>(note that you can modify which scrollbar you want in System Preferences).

### What type of PR is it?
Improvement

### TODO
- [x] : test this in major browsers

### What is the Jira issue?
[ZEPPELIN-1085](https://issues.apache.org/jira/browse/ZEPPELIN-1085)

### How should this be tested?
[Build the Zeppelin docs 
website](https://github.com/apache/zeppelin/tree/master/docs#build-documentation)
 in your local and check the dropdown menu in navbar. The scrollbae has to be 
shown right after you click **Interpreters** or **More** menu.

### Screenshots (if appropriate)
 - Before : scrollbar is only shown up when you are trying to scroll up & down
![before](https://cloud.githubusercontent.com/assets/10060731/16647507/8c6fbc60-446a-11e6-9a57-b00a76e6b59c.gif)

 - After : always visible
![after](https://cloud.githubusercontent.com/assets/10060731/16647513/901e4e3a-446a-11e6-840b-599b6121fe46.gif)

 - In case of IE, you can always see the scrollbar. So it's not a problem 
originally.
![screen shot 2016-07-07 at 5 41 27 
pm](https://cloud.githubusercontent.com/assets/10060731/16647584/e3708ff8-446a-11e6-8aee-c03eaba70cc9.png)

### Questions:
* Does the licenses files need update? no
* Is there breaking changes for older versions? no
* Does this needs documentation? no

Author: AhyoungRyu <fbdkdu...@hanmail.net>

Closes #1143 from AhyoungRyu/ZEPPELIN-1085 and squashes the following commits:

4d10883 [AhyoungRyu] Make dropdown menu scrollbar always visible


Project: http://git-wip-us.apache.org/repos/asf/zeppelin/repo
Commit: http://git-wip-us.apache.org/repos/asf/zeppelin/commit/1ccbd602
Tree: http://git-wip-us.apache.org/repos/asf/zeppelin/tree/1ccbd602
Diff: http://git-wip-us.apache.org/repos/asf/zeppelin/diff/1ccbd602

Branch: refs/heads/master
Commit: 1ccbd602a8c486014a1b412d0200d2628c2bc411
Parents: 5556f81
Author: AhyoungRyu <fbdkdu...@hanmail.net>
Authored: Thu Jul 7 15:32:28 2016 +0900
Committer: Lee moon soo <m...@apache.org>
Committed: Fri Jul 8 22:22:16 2016 -0700

----------------------------------------------------------------------
 docs/assets/themes/zeppelin/css/style.css | 10 ++++++++++
 1 file changed, 10 insertions(+)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/zeppelin/blob/1ccbd602/docs/assets/themes/zeppelin/css/style.css
----------------------------------------------------------------------
diff --git a/docs/assets/themes/zeppelin/css/style.css 
b/docs/assets/themes/zeppelin/css/style.css
index 8ab197c..1a6f3da 100644
--- a/docs/assets/themes/zeppelin/css/style.css
+++ b/docs/assets/themes/zeppelin/css/style.css
@@ -141,6 +141,16 @@ body {
   overflow: auto;
 }
 
+.scrollable-menu::-webkit-scrollbar {
+  -webkit-appearance: none;
+  width: 7px;        
+}  
+
+.scrollable-menu::-webkit-scrollbar-thumb {
+  border-radius: 3px;
+  background-color: gray; 
+}
+
 .index-header {
   font-size: 16px;
   font-style: italic;

Reply via email to