You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@zeppelin.apache.org by mo...@apache.org on 2017/09/29 05:24:39 UTC
zeppelin git commit: ZEPPELIN-2562 Make Add paragraph button more
prominent
Repository: zeppelin
Updated Branches:
refs/heads/master 2437c8029 -> 17fb97bf3
ZEPPELIN-2562 Make Add paragraph button more prominent
### What is this PR for?
- Earlier add paragraph button was tiny plus between two paragraphs.
- With this change, we have added `Add Paragraph` text along with `+` and increased the height without any flicker so that user will get to know about adding a paragraph easily
### What type of PR is it?
[Improvement]
### What is the Jira issue?
* https://issues.apache.org/jira/browse/ZEPPELIN-2562
### How should this be tested?
1. Build: mvn clean package -Denforcer.skip -DskipTests -Drat.skip
2. Mouse hover over the empty space between the paragraph to create a paragraph
### Screenshots (if appropriate)
Before:
![add-para-before](https://user-images.githubusercontent.com/1881135/30083847-ab93ef16-92ad-11e7-837d-833a287161ed.gif)
After:
![add-paragraph-after](https://user-images.githubusercontent.com/1881135/30083850-ae1cb600-92ad-11e7-9ad1-bf89b8979a49.gif)
### Questions:
* Does the licenses files need update? - No
* Is there breaking changes for older versions? - No
* Does this needs documentation? - No
Author: Malay Majithia <ma...@gmail.com>
Closes #2569 from malayhm/ZEPPELIN-2562 and squashes the following commits:
1b6f55b [Malay Majithia] Fixed typo
3f15079 [Malay Majithia] Merge branch 'master' into ZEPPELIN-2562
7704b1b [Malay Majithia] ZEPPELIN-2562 Make Add paragraph button more prominent
Project: http://git-wip-us.apache.org/repos/asf/zeppelin/repo
Commit: http://git-wip-us.apache.org/repos/asf/zeppelin/commit/17fb97bf
Tree: http://git-wip-us.apache.org/repos/asf/zeppelin/tree/17fb97bf
Diff: http://git-wip-us.apache.org/repos/asf/zeppelin/diff/17fb97bf
Branch: refs/heads/master
Commit: 17fb97bf3c051d47f08e2dd488fbf88ef83c6c7f
Parents: 2437c80
Author: Malay Majithia <ma...@gmail.com>
Authored: Thu Sep 7 13:01:29 2017 +0530
Committer: Lee moon soo <mo...@apache.org>
Committed: Thu Sep 28 22:24:31 2017 -0700
----------------------------------------------------------------------
zeppelin-web/src/app/notebook/notebook.css | 24 ++++++++++++++++++++++++
zeppelin-web/src/app/notebook/notebook.html | 11 +++++++----
2 files changed, 31 insertions(+), 4 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/zeppelin/blob/17fb97bf/zeppelin-web/src/app/notebook/notebook.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/notebook.css b/zeppelin-web/src/app/notebook/notebook.css
index 3a09647..a7508bc 100644
--- a/zeppelin-web/src/app/notebook/notebook.css
+++ b/zeppelin-web/src/app/notebook/notebook.css
@@ -398,3 +398,27 @@
.search-group:nth-child(even) {
border-top-width: 0;
}
+
+.new-paragraph:hover .plus-sign {
+ display: block;
+ background: #ECF7FD;
+ height: 30px;
+ text-align: center;
+ position: absolute;
+ width: calc(100% - 4px);
+ line-height: 30px;
+ top: -23px;
+ border: 1px solid #DDDDDD;
+ border-radius: 3px;
+ box-shadow: rgba(0, 0, 0, 0.19) 0px 2px 4px;
+}
+
+.first-paragraph:hover .plus-sign {
+ top: -14px;
+ z-index: 100000;
+}
+
+.last-paragraph:hover .plus-sign {
+ position: relative;
+ top: -16px;
+}
http://git-wip-us.apache.org/repos/asf/zeppelin/blob/17fb97bf/zeppelin-web/src/app/notebook/notebook.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/notebook.html b/zeppelin-web/src/app/notebook/notebook.html
index 98b66fe..4b1c0b9 100644
--- a/zeppelin-web/src/app/notebook/notebook.html
+++ b/zeppelin-web/src/app/notebook/notebook.html
@@ -123,8 +123,11 @@ limitations under the License.
<!-- see ZEPPELIN-2806
viewport-watch>
-->
- <div class="new-paragraph" ng-click="insertNew('above')" ng-hide="viewOnly || asIframe || revisionView">
- <h4 class="plus-sign">+</h4>
+ <div class="new-paragraph"
+ ng-click="insertNew('above')"
+ ng-hide="viewOnly || asIframe || revisionView"
+ ng-class="{'first-paragraph': $first}">
+ <h4 class="plus-sign">+ Add Paragraph</h4>
</div>
<div id="{{currentParagraph.id}}_paragraphColumn"
ng-include src="'app/notebook/paragraph/paragraph.html'"
@@ -133,8 +136,8 @@ limitations under the License.
ng-hide="currentParagraph.config.tableHide && viewOnly"
ng-dblclick="paragraphOnDoubleClick(currentParagraph.id);">
</div>
- <div class="new-paragraph" ng-click="insertNew('below');" ng-hide="!$last || viewOnly || asIframe || revisionView">
- <h4 class="plus-sign">+</h4>
+ <div class="new-paragraph last-paragraph" ng-click="insertNew('below');" ng-hide="!$last || viewOnly || asIframe || revisionView">
+ <h4 class="plus-sign">+ Add Paragraph</h4>
</div>
</div>
<div style="clear:both;height:10px"></div>