Repository: zeppelin Updated Branches: refs/heads/master a716308ce -> df1c654e0
[ZEPPELIN-2242] Toggle helium type buttons ### What is this PR for? Toggle helium type buttons so that user can distinguish which button is clicked easily. Previously, - it's hard to get noticed that `VISUALIZATION` button is clicked by default. - and buttons lose their focus when user clicks other things. I attached screenshots. ### What type of PR is it? [Improvement] ### Todos NONE ### What is the Jira issue? [ZEPPELIN-2242](https://issues.apache.org/jira/browse/ZEPPELIN-2242) ### How should this be tested? 1. Open `/#helium` page 2. Click buttons. (refer the screenshots below) ### Screenshots (if appropriate) #### Before  #### After  ### Questions: * Does the licenses files need update? - NO * Is there breaking changes for older versions? - NO * Does this needs documentation? - NO Author: 1ambda <1am...@gmail.com> Closes #2118 from 1ambda/ZEPPELIN-2242/toggle-helium-type-buttons and squashes the following commits: e4e59bc [1ambda] feat: Toggle helium type buttons Project: http://git-wip-us.apache.org/repos/asf/zeppelin/repo Commit: http://git-wip-us.apache.org/repos/asf/zeppelin/commit/df1c654e Tree: http://git-wip-us.apache.org/repos/asf/zeppelin/tree/df1c654e Diff: http://git-wip-us.apache.org/repos/asf/zeppelin/diff/df1c654e Branch: refs/heads/master Commit: df1c654e005fdc45b871c6bf9ab5c36e30670b50 Parents: a716308 Author: 1ambda <1am...@gmail.com> Authored: Fri Mar 10 15:59:07 2017 +0900 Committer: ahyoungryu <ahyoung...@apache.org> Committed: Sat Mar 11 21:53:32 2017 +0900 ---------------------------------------------------------------------- zeppelin-web/src/app/helium/helium.css | 6 ++++++ zeppelin-web/src/app/helium/helium.html | 5 +++-- 2 files changed, 9 insertions(+), 2 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/zeppelin/blob/df1c654e/zeppelin-web/src/app/helium/helium.css ---------------------------------------------------------------------- diff --git a/zeppelin-web/src/app/helium/helium.css b/zeppelin-web/src/app/helium/helium.css index 63a81ff..0b6c768 100644 --- a/zeppelin-web/src/app/helium/helium.css +++ b/zeppelin-web/src/app/helium/helium.css @@ -155,6 +155,12 @@ outline: 0; } +.heliumRepoBtnToggled { + color: #333; + background-color: #e6e6e6; + border-color:#adadad; +} + .localPkgInfo { margin: 10px 12px 0 0; font-size: 11px; http://git-wip-us.apache.org/repos/asf/zeppelin/blob/df1c654e/zeppelin-web/src/app/helium/helium.html ---------------------------------------------------------------------- diff --git a/zeppelin-web/src/app/helium/helium.html b/zeppelin-web/src/app/helium/helium.html index b64f71c..923a6e4 100644 --- a/zeppelin-web/src/app/helium/helium.html +++ b/zeppelin-web/src/app/helium/helium.html @@ -26,9 +26,10 @@ limitations under the License. tooltip="Learn more"> <i class="icon-question" ng-style="{color: 'black'}"></i> </a> - <button tabindex="0" class="btn btn-default btn-sm heliumRepoBtn helium-popover" - role="button" + <button tabindex="0" role="button" ng-repeat="pkgTypes in allPackageTypes" + class="btn btn-default btn-sm heliumRepoBtn helium-popover" + ng-class="($parent.pkgListByType === pkgTypes) ? 'heliumRepoBtnToggled' : ''" ng-click="$parent.pkgListByType = pkgTypes"> <i class="fa fa-cube"></i> {{pkgTypes}}
