zeppelin-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From cornead...@apache.org
Subject incubator-zeppelin git commit: Paragraph CSS to its own file
Date Fri, 25 Sep 2015 05:09:48 GMT
Repository: incubator-zeppelin
Updated Branches:
  refs/heads/master aa1363343 -> 6bc13e2de


Paragraph CSS to its own file

So far, the Paragraph's CSS is mixed in the notebook.css file.
This PR is made to move Paragraph's CSS to its own file.

Author: Damien Corneau <corneadoug@gmail.com>

Closes #311 from corneadoug/improve/SeparateParagraphCss and squashes the following commits:

59c1676 [Damien Corneau] Improve Report CSS
7f6c877 [Damien Corneau] Final split of Paragraph CSS
c2fa5bc [Damien Corneau] Fix CSS files spacing
ac626ef [Damien Corneau] More CSS moved to paragraph CSS
db178ce [Damien Corneau] Clean up looknfeel css
af317cc [Damien Corneau] Moving css to paragraph.css file


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

Branch: refs/heads/master
Commit: 6bc13e2de485fcdb07b96a748bb861581d8e135b
Parents: aa13633
Author: Damien Corneau <corneadoug@gmail.com>
Authored: Fri Sep 25 13:32:09 2015 +0900
Committer: Damien Corneau <corneadoug@gmail.com>
Committed: Fri Sep 25 14:08:56 2015 +0900

----------------------------------------------------------------------
 zeppelin-web/src/app/home/home.css              |  61 ++-
 .../src/app/interpreter/interpreter.css         |  14 +-
 zeppelin-web/src/app/notebook/notebook.css      | 398 +------------------
 zeppelin-web/src/app/notebook/notebook.html     |   3 +-
 .../src/app/notebook/paragraph/paragraph.css    | 384 ++++++++++++++++++
 .../src/app/notebook/paragraph/paragraph.html   |  10 +-
 .../src/assets/styles/looknfeel/default.css     |  39 +-
 .../src/assets/styles/looknfeel/home.css        |  71 +---
 .../src/assets/styles/looknfeel/report.css      |  47 ++-
 .../src/assets/styles/looknfeel/simple.css      |  35 +-
 zeppelin-web/src/assets/styles/printMode.css    |   1 -
 zeppelin-web/src/index.html                     |   1 +
 12 files changed, 485 insertions(+), 579 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/zeppelin-web/src/app/home/home.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/home/home.css b/zeppelin-web/src/app/home/home.css
index 41b098e..42c3170 100644
--- a/zeppelin-web/src/app/home/home.css
+++ b/zeppelin-web/src/app/home/home.css
@@ -17,7 +17,10 @@ body {
   color: #212121;
 }
 
-html,body { height: 100%;}
+html,
+body {
+  height: 100%;
+}
 
 .bodyAsIframe {
   background: white;
@@ -27,10 +30,10 @@ html,body { height: 100%;}
   display: inline !important;
 }
 
-
 body.asIframe {
   padding-top: 0px;
 }
+
 body .navbar {
   margin-bottom: 0px;
 }
@@ -50,16 +53,20 @@ body .navbar {
   font-size: 18px;
 }
 
-.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open >
a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
+.navbar-inverse .navbar-nav > .open > a,
+.navbar-inverse .navbar-nav > .open > a:hover,
+.navbar-inverse .navbar-nav > .open > a:focus {
   color: #fff;
   background-color: #3071a9;
 }
 
-.navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
+.navbar-inverse .navbar-toggle:hover,
+.navbar-inverse .navbar-toggle:focus {
   background-color: #3071a9;
 }
 
-.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li >
a:focus {
+.navbar-inverse .navbar-nav > li > a:hover,
+.navbar-inverse .navbar-nav > li > a:focus {
   color: #fff;
   background-color: rgba(0, 0, 0, 0.2);
 
@@ -69,7 +76,9 @@ body .navbar {
   border-color: #FFFFFF;
 }
 
-.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active
> a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
+.navbar-inverse .navbar-nav > .active > a,
+.navbar-inverse .navbar-nav > .active > a:hover,
+.navbar-inverse .navbar-nav > .active > a:focus {
   color: #fff;
   background-color: #080808;
 }
@@ -99,6 +108,7 @@ a.navbar-brand:hover {
   color: #333;
   white-space: nowrap;
 }
+
 .dropdown-menu > .scrollbar-container > li > a:hover,
 .dropdown-menu > .scrollbar-container > li > a:focus {
   color: #262626;
@@ -148,7 +158,6 @@ a.navbar-brand:hover {
   }
 }
 
-
 #main {
   padding: 10px;
   height: 100%;
@@ -166,7 +175,7 @@ a.navbar-brand:hover {
 }
 
 .server-status {
-  font-size:12px;
+  font-size: 12px;
   margin-top: 6px;
 }
 
@@ -180,14 +189,10 @@ a.navbar-brand:hover {
   font-weight: bold !important;
 }
 
-
-/**
- * Box and well
- */
-.box{
+.box {
   border-style: solid;
   min-height: 20px;
-  padding: 10px;
+  padding: 19px;
   margin-bottom: 20px;
 }
 
@@ -201,39 +206,27 @@ a.navbar-brand:hover {
   box-shadow: none;
 }
 
-.box-heading{
-  position:relative;
+.box-heading {
+  position: relative;
   max-width: 100%;
-  /*font-size: 20px;*/
   font-weight:300;
   white-space: nowrap;
-  /*overflow:hidden;*/
   text-overflow: ellipsis;
   vertical-align: middle;
   margin: 0 0 15px;
   padding-bottom: 2px;
 }
-/**
-h1.box-heading,
-h2.box-heading,
-h3.box-heading,
-h4.box-heading,
-h5.box-heading,
-h6.box-heading{
-  font-size: 20px;
-}*/
+
 .box-heading > .btn-group,
-.box-heading > .btn{
+.box-heading > .btn {
   margin-top: -3px;
 }
 
-
-.icheck-label{
+.icheck-label {
   position: relative;
   top: 0;
 }
 
-
 .zeppelin {
   background-image: url('/assets/images/zepLogo.png');
   background-repeat: no-repeat;
@@ -283,7 +276,9 @@ kbd {
   min-height: 400px;
 }
 
-/* ngToast style */
+/*
+  ngToast Style
+*/
 
 .ng-toast .alert {
   color: white !important;
@@ -312,5 +307,5 @@ This part should be removed when new version of bootstrap handles this
issue.
 */
 .btn-group > .tooltip + .btn,
 .btn-group > .popover + .btn {
-  margin-left:-1px;
+  margin-left: -1px;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/zeppelin-web/src/app/interpreter/interpreter.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/interpreter/interpreter.css b/zeppelin-web/src/app/interpreter/interpreter.css
index 1dcc52b..d06bf0c 100644
--- a/zeppelin-web/src/app/interpreter/interpreter.css
+++ b/zeppelin-web/src/app/interpreter/interpreter.css
@@ -27,7 +27,8 @@
   font-family: 'Roboto', sans-serif;
 }
 
-.interpreterHead textarea, .interpreter textarea {
+.interpreterHead textarea,
+.interpreter textarea {
   width: 100%;
   display: block;
   height: 20px;
@@ -37,11 +38,11 @@
 }
 
 .interpreter .interpreter-title {
-  font-size:20px;
-  font-weight:bold;
-  color:#3071a9;
-  float:left;
-  margin-top:0px;
+  font-size: 20px;
+  font-weight: bold;
+  color: #3071a9;
+  float: left;
+  margin-top: 0px;
 }
 
 .interpreter ul {
@@ -53,7 +54,6 @@
   list-style-type: none;
 }
 
-
 .interpreter table tr .interpreterPropertyKey {
   padding : 5px 5px 5px 5px;
 }

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/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 40d9702..699a296 100644
--- a/zeppelin-web/src/app/notebook/notebook.css
+++ b/zeppelin-web/src/app/notebook/notebook.css
@@ -22,75 +22,6 @@
   min-height: 32px;
 }
 
-.paragraphForm.form-horizontal .form-group {
-  margin-right: 0px;
-  margin-left:  0px;
-}
-
-.paragraphForm.form-horizontal .form-group label {
-  padding-left: 0;
-}
-
-.paragraph .tableDisplay .hljs {
-  background: none;
-}
-
-.paragraph .ace_print-margin {
-  background: none !important;
-}
-
-.paragraphAsIframe{
-  padding: 0px 0px 0px 0px;
-  margin-top: -79px;
-  margin-left: -10px;
-  margin-right: -10px;
-}
-
-.paragraphAsIframe .control {
-  background-color: rgba(255,255,255,0.9);
-  border-top: 1px solid #EFEFEF;
-  display: none;
-  float: right;
-  color: #999;
-  margin-top: -9px;
-  margin-right:0px;
-  position:absolute;
-  clear:both;
-  right:25px;
-  /*z-index:10;*/
-}
-
-.paragraphAsIframe table {
-  margin-bottom: 0px;
-}
-
-.paragraphAsIframe .editor {
-  width: 100%;
-  border-left: 4px solid #EEEEEE;
-  background: rgba(255, 255, 255, 0.9);
-}
-
-.paragraphAsIframe .text {
-  white-space: pre;
-  display: block;
-  unicode-bidi: embed;
-  display: block !important;
-  margin: 0 0 10px!important;
-  font-size: 12px!important;
-  line-height: 1.42857143!important;
-  word-break: break-all!important;
-  word-wrap: break-word!important;
-  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
-}
-
-.ace_marker-layer .ace_selection {
-    z-index: 0 !important;
-}
-
-.ace_marker-layer .ace_selected-word {
-    z-index: 0 !important;
-}
-
 .labelBtn {
   padding: .2em .6em .3em;
   font-size: 75%;
@@ -110,176 +41,8 @@
     margin-left: 3px;
 }
 
-.control span {
-    margin-left: 4px;
-}
-
-.control {
-    padding: 4px;
-}
-
-.paragraph-space {
-  margin-bottom: 5px;
-  padding: 10px !important;
-}
-
-.paragraph .control {
-  background-color: rgba(255,255,255,0.85);
-  /*display: none;*/
-  float: right;
-  color: #999;
-  margin-top: 1px;
-  margin-right: 5px;
-  position:absolute;
-  clear:both;
-  right:15px;
-  top: 16px;
-  text-align:right;
-  font-size:12px;
-}
-
-.paragraph .control li{
-  font-size:12px;
-  margin-bottom:4px;
-  color: #333333;
-}
-
-.paragraph table {
-  margin-bottom: 0px;
-}
-
-.paragraph .title {
-  margin: 3px 0px 0px 0px;
-  height: 20px;
-  font-size: 12px;
-}
-
-.paragraph .title div {
-  width: 80%;
-  font-weight: bold;
-  font-family: 'Roboto', sans-serif;
-  font-size: 17px !important;
-  text-transform: capitalize;
-}
-
-.paragraph .title input {
-  width: 80%;
-  line-height: 1.42857143;
-  color: #555;
-  background-color: #fff;
-  background-image: none;
-  border: 1px solid #ccc;
-  border-radius: 0px;
-  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
-  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
-  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
-  text-transform: capitalize;
-  font-family: 'Roboto', sans-serif;
-  font-size: 14px!important;
-}
-
-.paragraph .editor {
-  width: 100%;
-  border-left: 4px solid #DDDDDD;  
-  background: rgba(255, 255, 255, 0.0);
-  margin: 7px 0 2px 0px;
-}
-
-.dirty{  
-  border-left: 4px solid #E67E22 !important;   
-}
-
-.paragraph .text {
-  white-space: pre;
-  display: block;
-  unicode-bidi: embed;
-  display: block !important;
-  margin: 0 0 0px !important;
-  line-height: 1.42857143 !important;
-  word-break: break-all !important;
-  word-wrap: break-word !important;
-  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
-  font-size: 12px !important;
-  margin-bottom: 5px !important;
-}
-
-.paragraph p {
-  margin : 0 0 0 0px;
-}
-
-.paragraph div svg {
-  width : 100%;
-}
-
-.ace-tm {
-  background-color: #FFFFFF;
-  color: black;
-}
-.ace_editor {
-  position: relative;
-  overflow: hidden;
-  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
-  font-size: 12px;
-  line-height: normal;
-  direction: ltr;
-}
-
-.ace_hidden-cursors {opacity:0}
-
-/** Remove z-index to ace */
-.ace_text-input, .ace_gutter, .ace_layer,
-.emacs-mode, .ace_text-layer, .ace_cursor-layer,
-.ace_cursor, .ace_scrollbar {
-  z-index:auto !important;
-}
-
-/** Force opacity:0 to textarea in writing texts **/
-.ace_text-input.ace_composition {
- opacity: 0 !important;
-}
-
-#main .emacs-mode .ace_cursor {
-  background-color:#C0C0C0!important;
-  border: none !important;
-}
-
-.paragraph .status {
-  font-size: 10px;
-  color: #AAAAAA;
-  text-align: right;
-  visibility: hidden;
-}
-
-.paragraph .runControl {
-  font-size: 1px;
-  color: #AAAAAA;
-  height:4px;
-  margin: 1px 0px 0px 0px;
-}
-
-.paragraph .runControl .progress {
-  position: relative;
-  width:100%;
-  height:4px;
-  z-index:100;
-  border-radius: 0px;
-}
-
-.paragraph .runControl .progress .progress-bar {
-  z-index:100;
-}
-
-.paragraph .executionTime {
-  color: #999;
-  font-size: 10px;
-  font-family: 'Roboto', sans-serif;
-}
-
-
 .disable {
-  opacity:0.6!important;
+  opacity: 0.6!important;
   pointer-events: none;
 }
 
@@ -302,9 +65,9 @@
   padding-bottom: 4px;
 }
 
-.noteAction li{
-  font-size:12px;
-  margin-bottom:4px;
+.noteAction li {
+  font-size: 12px;
+  margin-bottom: 4px;
   color: #333333;
 }
 
@@ -339,161 +102,14 @@
   display: inline-block;
 }
 
-/* panel default */
-.panel-default {
-  /* border: none; */
-  border-color: #DDDDDD;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
-}
-
-.panel-group .panel-default {
-  /*border: solid #e5e5e5;
-  border-width: 1px 1px 2px;*/
-}
-
-.panel-default > .panel-heading {
-  color: #34495e;
-  background-color: #ffffff;
-  border-color: #e5e5e5;
-}
-
-.panel-default > .panel-heading + .panel-collapse .panel-body {
-  border-top-color: #e5e5e5;
-}
-
-.panel-default > .panel-heading > .dropdown .caret {
-  border-color: #ecf0f1 transparent;
-}
-
-.panel-default > .panel-footer + .panel-collapse .panel-body {
-  border-bottom-color: #e5e5e5;
-}
-
-.panel-body-heading {
-  position: relative;
-  display: block;
-  padding-left: 10px;
-  padding-top: 15px;
-  padding-bottom: 15px;
-}
-
-.paragraph-margin {
-  margin-right: 2px;
-  margin-left: 2px;
-}
-
-.tableDisplay img {
-  display: block;
-  max-width: 100%;
-  height: auto;
-}
-
-.tableDisplay .btn-group span {
-  margin: 10px 0px 0px 10px;
-  font-size:12px;
-}
-.tableDisplay .btn-group span a {
-  cursor:pointer;
-}
-
-.tableDisplay .option {
-  padding: 5px 5px 5px 5px;
-  font-size:12px;
-  height:auto;
-  overflow : auto;
-  /*min-height: 200px;*/
-  border-top: 1px solid #ecf0f1;
-
-}
-
-.tableDisplay .option .columns {
-  height: 100%;
-}
-
-.tableDisplay .option .columns ul {
-
-  background-color: white;
-  /*min-width: 100px;*/
-  width:auto;
-  padding: 3px 3px 3px 3px;
-  height : 150px;
-  border: 1px solid #CCC;
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
-  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
-  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
-
-}
-
-.tableDisplay .option .columns ul li {
-  margin: 3px 3px 3px 3px;
-}
-
-.tableDisplay .option .columns ul li span {
-  cursor: pointer;
-  margin-left: 3px;
-  margin-top: 3px;
-}
-
-.tableDisplay .option .columns ul li div ul { /* aggregation menu */
-  width:auto;
-  height:auto;
-}
-
-.tableDisplay .option .columns ul li div ul li a {
-  padding: 0px;
-  margin: 0px;
-  cursor: pointer;
-}
-
-.tableDisplay .option .columns a:focus,
-.tableDisplay .option .columns a:hover {
-  text-decoration: none;
-  outline: 0;
-  outline-offset: 0px;
-}
-
-.graphContainer {
-  position:relative;
-  margin-bottom: 5px;
-  overflow: visible;
-}
-
 .noOverflow {
     overflow: hidden !important;
 }
 
-.graphContainer .table {
-  overflow: hidden;
-  margin-bottom: 5px !important;
-}
-
-.allFields {
-  margin-bottom: 10px;
-}
-.noDot {
-  list-style-type: none;
-  padding-left:5px;
-}
-
-.liVertical {
-  display:block;
-  float:left;
-  padding: 5px;
-}
-.row {
-  margin-right: 0px !important
-}
-
-.lightBold {
-  font-weight: 500;
-}
-
-.resizable-helper {
-  border: 3px solid #DDDDDD;
-}
+/*
+  Note Setting Panel
+*/
 
-/* note setting panel */
 .setting {
   background-color: white;
   padding: 10px 15px 15px 15px;

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/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 b7257fe..edab9b0 100644
--- a/zeppelin-web/src/app/notebook/notebook.html
+++ b/zeppelin-web/src/app/notebook/notebook.html
@@ -164,7 +164,8 @@ limitations under the License.
        class="paragraph-col">
     <div id="{{currentParagraph.id}}_paragraphColumn"
          ng-include src="'app/notebook/paragraph/paragraph.html'"
-         ng-class="{'paragraph-space box paragraph-margin': !asIframe, 'focused': paragraphFocused}"
+         ng-class="{'paragraph-space box paragraph-margin': !asIframe, 'focused': paragraphFocused,
+                    'lastEmptyParagraph': !paragraph.text && !paragraph.result}"
          ng-hide="currentParagraph.config.tableHide && viewOnly">
     </div>
   </div>

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/zeppelin-web/src/app/notebook/paragraph/paragraph.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.css b/zeppelin-web/src/app/notebook/paragraph/paragraph.css
new file mode 100644
index 0000000..4cb38de
--- /dev/null
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.css
@@ -0,0 +1,384 @@
+/*
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/*
+  Paragraph Style
+*/
+
+.paragraph-space {
+  margin-bottom: 5px !important;
+  padding: 10px !important;
+}
+
+.paragraph-margin {
+  margin-right: 2px;
+  margin-left: 2px;
+}
+
+/*
+  Paragraph Results
+*/
+
+.paragraph .text {
+  white-space: pre;
+  display: block;
+  unicode-bidi: embed;
+  display: block !important;
+  margin: 0 0 0px !important;
+  line-height: 1.42857143 !important;
+  word-break: break-all !important;
+  word-wrap: break-word !important;
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
+  font-size: 12px !important;
+  margin-bottom: 5px !important;
+}
+
+.paragraph table {
+  margin-bottom: 0px;
+}
+
+.paragraph p {
+  margin : 0 0 0 0px;
+}
+
+.paragraph div svg {
+  width : 100%;
+}
+
+.graphContainer {
+  position: relative;
+  margin-bottom: 5px;
+  overflow: visible;
+}
+
+.graphContainer .table {
+  overflow: hidden;
+  margin-bottom: 5px !important;
+}
+
+.resizable-helper {
+  border: 3px solid #DDDDDD;
+}
+
+.paragraph .executionTime {
+  color: #999;
+  font-size: 10px;
+  font-family: 'Roboto', sans-serif;
+}
+
+/*
+  Paragraph as Iframe CSS
+*/
+
+.paragraphAsIframe {
+  padding: 0px 0px 0px 0px;
+  margin-top: -79px;
+  margin-left: -10px;
+  margin-right: -10px;
+}
+
+.paragraphAsIframe .control {
+  background-color: rgba(255,255,255,0.9);
+  border-top: 1px solid #EFEFEF;
+  display: none;
+  float: right;
+  color: #999;
+  margin-top: -9px;
+  margin-right: 0px;
+  position: absolute;
+  clear: both;
+  right: 25px;
+}
+
+.paragraphAsIframe table {
+  margin-bottom: 0px;
+}
+
+.paragraphAsIframe .editor {
+  width: 100%;
+  border-left: 4px solid #EEEEEE;
+  background: rgba(255, 255, 255, 0.9);
+}
+
+.paragraphAsIframe .text {
+  white-space: pre;
+  display: block;
+  unicode-bidi: embed;
+  display: block !important;
+  margin: 0 0 10px!important;
+  font-size: 12px!important;
+  line-height: 1.42857143!important;
+  word-break: break-all!important;
+  word-wrap: break-word!important;
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
+}
+
+/*
+  Paragraph Controls CSS
+*/
+
+.paragraph .runControl {
+  font-size: 1px;
+  color: #AAAAAA;
+  height:4px;
+  margin: 1px 0px 0px 0px;
+}
+
+.paragraph .runControl .progress {
+  position: relative;
+  width: 100%;
+  height: 4px;
+  z-index: 100;
+  border-radius: 0px;
+}
+
+.paragraph .runControl .progress .progress-bar {
+  z-index: 100;
+}
+
+.paragraph .control span {
+    margin-left: 4px;
+}
+
+.paragraph .control {
+  background-color: rgba(255,255,255,0.85);
+  float: right;
+  color: #999;
+  margin-top: 1px;
+  margin-right: 5px;
+  position: absolute;
+  clear: both;
+  right: 15px;
+  top: 16px;
+  text-align: right;
+  font-size: 12px;
+  padding: 4px;
+}
+
+.paragraph .control li {
+  font-size: 12px;
+  margin-bottom: 4px;
+  color: #333333;
+}
+
+/*
+  Paragraph Title
+*/
+
+.paragraph .title {
+  margin: 3px 0px 0px 0px;
+  height: 20px;
+  font-size: 12px;
+}
+
+.paragraph .title div {
+  width: 80%;
+  font-weight: bold;
+  font-family: 'Roboto', sans-serif;
+  font-size: 17px !important;
+  text-transform: capitalize;
+}
+
+.paragraph .title input {
+  width: 80%;
+  line-height: 1.42857143;
+  color: #555;
+  background-color: #fff;
+  background-image: none;
+  border: 1px solid #ccc;
+  border-radius: 0px;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
+  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
+  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+  text-transform: capitalize;
+  font-family: 'Roboto', sans-serif;
+  font-size: 14px!important;
+}
+
+/*
+  Paragraph Forms CSS
+*/
+
+.paragraphForm.form-horizontal .form-group {
+  margin-right: 0px;
+  margin-left:  0px;
+}
+
+.paragraphForm.form-horizontal .form-group label {
+  padding-left: 0;
+}
+
+/*
+  Ace Text Editor CSS
+*/
+
+.paragraph .editor {
+  width: 100%;
+  border-left: 4px solid #DDDDDD;
+  background: rgba(255, 255, 255, 0.0);
+  margin: 7px 0 2px 0px;
+}
+
+.paragraph-text--dirty {
+  border-left: 4px solid #E67E22 !important;
+}
+
+.paragraph .ace_print-margin {
+  background: none !important;
+}
+
+.ace_marker-layer .ace_selection {
+    z-index: 0 !important;
+}
+
+.ace_marker-layer .ace_selected-word {
+    z-index: 0 !important;
+}
+
+.ace-tm {
+  background-color: #FFFFFF;
+  color: black;
+}
+
+.ace_editor {
+  position: relative;
+  overflow: hidden;
+  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
+  font-size: 12px;
+  line-height: normal;
+  direction: ltr;
+}
+
+.ace_hidden-cursors {
+  opacity: 0;
+}
+
+.ace_text-input, .ace_gutter, .ace_layer,
+.emacs-mode, .ace_text-layer, .ace_cursor-layer,
+.ace_cursor, .ace_scrollbar {
+  z-index: auto !important;
+}
+
+.ace_text-input.ace_composition {
+ opacity: 0 !important;
+}
+
+#main .emacs-mode .ace_cursor {
+  background-color: #C0C0C0!important;
+  border: none !important;
+}
+
+/*
+  Table Display CSS
+*/
+
+.tableDisplay img {
+  display: block;
+  max-width: 100%;
+  height: auto;
+}
+
+.tableDisplay .btn-group span {
+  margin: 10px 0px 0px 10px;
+  font-size: 12px;
+}
+.tableDisplay .btn-group span a {
+  cursor: pointer;
+}
+
+.tableDisplay .option {
+  padding: 5px 5px 5px 5px;
+  font-size: 12px;
+  height: auto;
+  overflow : auto;
+  border-top: 1px solid #ecf0f1;
+
+}
+
+.tableDisplay .option .columns {
+  height: 100%;
+}
+
+.tableDisplay .option .columns ul {
+  background-color: white;
+  width: auto;
+  padding: 3px 3px 3px 3px;
+  height : 150px;
+  border: 1px solid #CCC;
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
+  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
+  -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+}
+
+.tableDisplay .option .columns ul li {
+  margin: 3px 3px 3px 3px;
+}
+
+.tableDisplay .option .columns ul li span {
+  cursor: pointer;
+  margin-left: 3px;
+  margin-top: 3px;
+}
+
+.tableDisplay .option .columns ul li div ul {
+  width: auto;
+  height: auto;
+}
+
+.tableDisplay .option .columns ul li div ul li a {
+  padding: 0px;
+  margin: 0px;
+  cursor: pointer;
+}
+
+.tableDisplay .option .columns a:focus,
+.tableDisplay .option .columns a:hover {
+  text-decoration: none;
+  outline: 0;
+  outline-offset: 0px;
+}
+
+.paragraph .tableDisplay .hljs {
+  background: none;
+}
+
+/*
+  Pivot CSS
+*/
+
+.allFields {
+  margin-bottom: 10px;
+}
+
+.noDot {
+  list-style-type: none;
+  padding-left: 5px;
+}
+
+.liVertical {
+  display: block;
+  float: left;
+  padding: 5px;
+}
+
+/*
+  Paragaph Font CSS
+*/
+
+.lightBold {
+  font-weight: 500;
+}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/zeppelin-web/src/app/notebook/paragraph/paragraph.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/app/notebook/paragraph/paragraph.html b/zeppelin-web/src/app/notebook/paragraph/paragraph.html
index 94ecb8b..0ad03a6 100644
--- a/zeppelin-web/src/app/notebook/paragraph/paragraph.html
+++ b/zeppelin-web/src/app/notebook/paragraph/paragraph.html
@@ -13,7 +13,7 @@ limitations under the License.
 -->
 
 <div id="{{paragraph.id}}_container"
-     ng-class="{'paragraph outlineOnFocus': !asIframe, 'paragraphAsIframe': asIframe}">
+     ng-class="{'paragraph': !asIframe, 'paragraphAsIframe': asIframe}">
 
   <div ng-show="paragraph.config.title"
        id="{{paragraph.id}}_title"
@@ -41,7 +41,7 @@ limitations under the License.
                      require : ['ace/ext/language_tools']
                    }"
            ng-model="paragraph.text"
-           ng-class="{'disable': paragraph.status == 'RUNNING' || paragraph.status == 'PENDING',
dirty : dirtyText}">
+           ng-class="{'disable': paragraph.status == 'RUNNING' || paragraph.status == 'PENDING',
'paragraph-text--dirty' : dirtyText}">
       </div>
     </div>
 
@@ -69,7 +69,7 @@ limitations under the License.
            ng-repeat="formulaire in paragraph.settings.forms"
            ng-Init="loadForm(formulaire, paragraph.settings.params)">
         <label class="control-label input-sm" ng-class="{'disable': paragraph.status ==
'RUNNING' || paragraph.status == 'PENDING' }">{{formulaire.name}}</label>
-        <div class="">
+        <div>
 
           <input class="form-control input-sm"
                  ng-if="!paragraph.settings.forms[formulaire.name].options"
@@ -132,11 +132,11 @@ limitations under the License.
       </div>
       <span ng-if="getResultType()=='TABLE' && getGraphMode()!='table' &&
!asIframe && !viewOnly"
             style="margin-left:10px; cursor:pointer; display: inline-block; vertical-align:top;
position: relative; line-height:30px;">
-        <a class="btnText" ng-if="paragraph.config.graph.optionOpen"
+        <a ng-if="paragraph.config.graph.optionOpen"
            ng-click="toggleGraphOption()">
           settings <span class="fa fa-caret-up"></span>
         </a>
-        <a class="btnText" ng-if="!paragraph.config.graph.optionOpen"
+        <a ng-if="!paragraph.config.graph.optionOpen"
            ng-click="toggleGraphOption()" >
           settings <span class="fa fa-caret-down"></span>
         </a>

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/zeppelin-web/src/assets/styles/looknfeel/default.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/assets/styles/looknfeel/default.css b/zeppelin-web/src/assets/styles/looknfeel/default.css
index 2d128e9..93d302a 100644
--- a/zeppelin-web/src/assets/styles/looknfeel/default.css
+++ b/zeppelin-web/src/assets/styles/looknfeel/default.css
@@ -16,51 +16,14 @@ body {
   background: #ecf0f1;
 }
 
-/**
- * Box and well
- */
-.box{
-  border-style: solid;
-  min-height: 20px;
-  padding: 19px;
-  margin-bottom: 20px;
-}
-
-.box, 
-.well {
-  background-color: #ffffff;
-  border-color: #e5e5e5;
-  border-width: 1px 1px 2px;
-  border-radius: 3px;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-}
-
-.paragraph {
-  min-height: 32px;
-}
-
 .noteAction {
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
   color: #2c3e50;
   border-bottom: 1px solid #E5E5E5;
 }
 
-.control span {
-    margin-left: 4px;
-}
-
-.control {
-    padding: 4px;
-}
-
-.paragraph-space {
-  margin-bottom: 5px;
-  padding: 10px !important;
-}
-
 .editor,
 .executionTime,
 .nv-controlsWrap {
-  display:block;
+  display: block;
 }

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/zeppelin-web/src/assets/styles/looknfeel/home.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/assets/styles/looknfeel/home.css b/zeppelin-web/src/assets/styles/looknfeel/home.css
index b25d37a..8461e22 100644
--- a/zeppelin-web/src/assets/styles/looknfeel/home.css
+++ b/zeppelin-web/src/assets/styles/looknfeel/home.css
@@ -12,86 +12,31 @@
  * limitations under the License.
  */
 
-
 /**
  * Theme for homescreen
  */
 
-
 body {
   background: #ecf0f1;
 }
 
-/**
- * Box and well
- */
-.box{
-  border-style: solid;
-  min-height: 20px;
-  padding: 19px;
-  margin-bottom: 20px;
-}
-
-.box, 
-.well {
-  background-color: #ffffff;
-  border-color: #e5e5e5;
-  border-width: 1px 1px 2px;
-  border-radius: 3px;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-}
-
-.paragraph {
-  min-height: 32px;
-}
-
-.noteAction {
-  background-color: white;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
-  color: #2c3e50;
-  border-bottom: 1px solid #E5E5E5;
-}
-
-.control span {
-    margin-left: 4px;
-}
-
-.control {
-    padding: 4px;
-}
-
-.paragraph-space {
-  margin-bottom: 5px;
-  padding: 10px !important;
-}
-
 .editor,
 .executionTime,
 .nv-controlsWrap {
-  display:block;
+  display: block;
 }
 
-
 .paragraph .control {
-  visibility : hidden;
-  right:15px;
-  top: 6px;
-}
-
-.paragraph:hover .control {
-  visibility : hidden;
+  visibility: hidden;
 }
 
-.noteAction span, .noteAction button, .noteAction form {
-  visibility : hidden;
-}
-
-.noteAction:hover span, .noteAction:hover button, .noteAction:hover form {
-  visibility : visible;
+.noteAction span,
+.noteAction button,
+.noteAction form {
+  visibility: hidden;
 }
 
 .executionTime,
 .nv-controlsWrap {
-  display:none;
-}
\ No newline at end of file
+  display: none;
+}

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/zeppelin-web/src/assets/styles/looknfeel/report.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/assets/styles/looknfeel/report.css b/zeppelin-web/src/assets/styles/looknfeel/report.css
index 065b92c..df717e1 100644
--- a/zeppelin-web/src/assets/styles/looknfeel/report.css
+++ b/zeppelin-web/src/assets/styles/looknfeel/report.css
@@ -16,53 +16,56 @@ body {
   background: white;
 }
 
-
-/**
- * Box and well
- */
-.box{
+.box {
   border: 0px;
   min-height: 0px;
 }
 
-.box:hover, 
+.box:hover,
 .well:hover {
   background-color: white;
   border: 0px;
 }
 
-.paragraph-col{
+.paragraph-col {
   border: 0px solid white;
 }
 
-.paragraph {
-  min-height: 32px;
+.paragraph-space {
+  padding-top: 0 !important;
+  padding-bottom: 0 !important;
 }
 
-.paragraph-space {
-  margin-bottom: 5px;
-  padding: 10px !important;
+.graphContainer {
+  margin-bottom: 0 !important;
+}
+
+.paragraph {
+  min-height: 32px;
 }
 
 .paragraph .control {
-  visibility : hidden;
-  right:15px;
-  top: 6px;
+  visibility: hidden;
 }
 
 .paragraph:hover .control {
-  visibility : hidden;
+  visibility: hidden;
 }
 
-.noteAction span, .noteAction button, .noteAction form {
-  visibility : hidden;
+.noteAction span,
+.noteAction button,
+.noteAction form {
+  visibility: hidden;
 }
 
-.noteAction:hover span, .noteAction:hover button, .noteAction:hover form {
-  visibility : visible;
+.noteAction:hover span,
+.noteAction:hover button,
+.noteAction:hover form {
+  visibility: visible;
 }
 
 .executionTime,
-.nv-controlsWrap {
-  display:none;
+.nv-controlsWrap,
+.lastEmptyParagraph {
+  display: none;
 }

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/zeppelin-web/src/assets/styles/looknfeel/simple.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/assets/styles/looknfeel/simple.css b/zeppelin-web/src/assets/styles/looknfeel/simple.css
index 9edb95e..aaf7d18 100644
--- a/zeppelin-web/src/assets/styles/looknfeel/simple.css
+++ b/zeppelin-web/src/assets/styles/looknfeel/simple.css
@@ -16,11 +16,7 @@ body {
   background: white;
 }
 
-
-/**
- * Box and well
- */
-.box{
+.box {
   border: 1px solid white;
   min-height: 20px;
 }
@@ -31,11 +27,11 @@ body {
   border: 1px solid #DDDDDD;
 }
 
-.paragraph-col .focused{
+.paragraph-col .focused {
   box-shadow: 1px 2px 7px rgba(0, 0, 0, 0.3);
 }
 
-.paragraph-col{
+.paragraph-col {
   border: 2px solid white;
 }
 
@@ -47,27 +43,30 @@ body {
   padding: 0px 2px 0px 2px !important;
 }
 
-
 .paragraph .control {
-  visibility : hidden;
-  right:15px;
-  top: 6px;
+  visibility: hidden;
+  top: 7px !important;
+  right: 10px !important;
 }
 
 .paragraph:hover .control {
-  visibility : visible;
+  visibility: visible;
 }
 
-.noteAction span, .noteAction button, .noteAction form {
-  visibility : hidden;
+.noteAction span,
+.noteAction button,
+.noteAction form {
+  visibility: hidden;
 }
 
-.noteAction:hover span, .noteAction:hover button, .noteAction:hover form {
-  visibility : visible;
+.noteAction:hover span,
+.noteAction:hover button,
+.noteAction:hover form {
+  visibility: visible;
 }
 
 .editor,
 .executionTime,
 .nv-controlsWrap {
-  display:block;
-}
\ No newline at end of file
+  display: block;
+}

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/zeppelin-web/src/assets/styles/printMode.css
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/assets/styles/printMode.css b/zeppelin-web/src/assets/styles/printMode.css
index 953b3a6..d512083 100644
--- a/zeppelin-web/src/assets/styles/printMode.css
+++ b/zeppelin-web/src/assets/styles/printMode.css
@@ -12,7 +12,6 @@
  * limitations under the License.
  */
 
-
 body {
   background: white;
 }

http://git-wip-us.apache.org/repos/asf/incubator-zeppelin/blob/6bc13e2d/zeppelin-web/src/index.html
----------------------------------------------------------------------
diff --git a/zeppelin-web/src/index.html b/zeppelin-web/src/index.html
index ac16ea7..ea485e1 100644
--- a/zeppelin-web/src/index.html
+++ b/zeppelin-web/src/index.html
@@ -49,6 +49,7 @@ limitations under the License.
     <!-- build:css(.tmp) styles/main.css -->
     <link rel="stylesheet" href="app/home/home.css">
     <link rel="stylesheet" href="app/notebook/notebook.css">
+    <link rel="stylesheet" href="app/notebook/paragraph/paragraph.css">
     <link rel="stylesheet" href="app/interpreter/interpreter.css">
     <link rel="stylesheet" href="fonts/font-awesome.min.css">
     <link rel="stylesheet" href="fonts/simple-line-icons.css">


Mime
View raw message