Fixes Data UI resizing. Adds navbar shadow.
authordsc <dsc@wikimedia.org>
Fri, 13 Apr 2012 19:02:21 +0000 (12:02 -0700)
committerdsc <dsc@wikimedia.org>
Fri, 13 Apr 2012 19:02:21 +0000 (12:02 -0700)
lib/dataset/data-view.co
lib/graph/graph-edit-view.co
lib/template/graph-edit.jade
www/css/data.styl
www/css/graph.styl

index cc6c781..298b6d2 100644 (file)
@@ -100,8 +100,13 @@ DataView = exports.DataView = BaseView.extend do # {{{
         @onMetricsChanged()
     
     onMetricsChanged: ->
-        # console.log 'onMetricsChanged!'
-        @$el.css 'min-height', Math.max @dataset_view.$el.height(), @metric_edit_view.$el.height()
+        oldMinHeight = parseInt @$el.css 'min-height'
+        newMinHeight = Math.max do
+            oldMinHeight
+            @dataset_view.$el.height()
+            @metric_edit_view.$el.height()
+        # console.log 'onMetricsChanged!', oldMinHeight, '-->', newMinHeight
+        @$el.css 'min-height', newMinHeight
     
     onUpdateMetric: ->
         @renderSubviews()
index 526598a..37808ae 100644 (file)
@@ -470,9 +470,7 @@ GraphEditView = exports.GraphEditView = BaseView.extend do # {{{
     
     onFirstClickRenderDataTab: ->
         # @$el.off 'click', '.graph-data-tab', @onFirstClickRenderDataTab
-        _.delay do
-            ~> @data.onMetricsChanged()
-            100
+        _.defer ~> @data.onMetricsChanged()
     
     onKeypress: (evt) ->
         $(evt.target).submit() if evt.keyCode is 13
index 04dd3cc..0926fea 100644 (file)
@@ -37,7 +37,9 @@ section.graph.graph-edit(id=graph_id)
                     li.active:  a.graph-info-tab(href="##{graph_id}-tab-info", data-toggle="tab") Info
                     li:         a.graph-data-tab(href="##{graph_id}-tab-data", data-toggle="tab") Data
                     li:         a.graph-options-tab(href="##{graph_id}-tab-options", data-toggle="tab") Options
-                
+                .nav-shadow-shim
+                .nav-shadow
+            
             
             //--- Tab Panes ---//
             .graph-tab-content.tab-content
index 3016561..a3c4212 100644 (file)
@@ -6,9 +6,12 @@
 
 section.graph section.data-ui
     height 100%
-    min-height 300px
+    min-height 500px
     clearfix()
     
+    // transition-duration 0.5s
+    // transition-property min-height
+    
     h4
         display none
     
@@ -20,7 +23,7 @@ section.graph section.data-ui
         absolute 0 0
         width 40%
         height 100%
-        min-height 300px
+        min-height 500px
         border-right 1px solid #ccc
         
         .inner
@@ -183,12 +186,15 @@ section.graph section.data-ui
                 height 100%
                 display table-cell
                 float none
-                width 200px
+                // width 200px
+                // min-width 200px
+                li a
+                    min-width 150px
             
             .datasource-sources-details
                 display table-cell
                 padding 1em
-                width auto
+                // width auto
             
             
         
index ab49bd1..45ad30f 100644 (file)
@@ -91,16 +91,37 @@ section.graph
         max-width 900px
     
     .graph-settings.tabbable
-        .graph-settings-nav > .nav
-            margin-bottom 0
+        .graph-settings-nav
+            & > .nav
+                z-index 3
+                margin-bottom 0
+                border 0
+                li h3
+                    line-height 14px
+                    margin 2px
+                    padding 8px 12px
+                    border-radius 5px
+                li
+                    margin-right 4px
+            
+            .nav-shadow-shim, .nav-shadow
+                position absolute
+                width 100%
+            .nav-shadow-shim
+                left -7px
+                bottom -1px
+                z-index 2
+                height 30px
+                padding 0 7px
+                background-color white
+                border-bottom 1px solid #ccc
+            .nav-shadow
+                left 0
+                bottom 0
+                z-index 1
+                height 10px
+                box-shadow 0 0 6px 2px rgba(0,0,0,0.20)
             
-            li h3
-                line-height 14px
-                margin 2px
-                padding 8px 12px
-                border-radius 5px
-            li
-                margin-right 4px
         
         .graph-tab-content > .tab-pane
             padding 0.5em