From bdbb045005612233758abdb7d9068932bfd195d7 Mon Sep 17 00:00:00 2001 From: Charles Hacskaylo Date: Thu, 10 Mar 2016 10:31:05 -0800 Subject: [PATCH] [Frontend] Cleanups to Inspector config elements open #729 In-progress! Markup and CSS mods continued; Config params added to PlotOptionsForm.js to allow control-first layout per form row; Changed titles of Inspector parts; --- .../commonUI/general/res/sass/_inspector.scss | 6 +- .../general/res/sass/forms/_elems.scss | 63 +++++++++---------- .../general/res/sass/overlay/_overlay.scss | 2 +- .../res/templates/plot-options-browse.html | 4 +- platform/features/plot/src/PlotOptionsForm.js | 47 ++++++++------ .../res/templates/table-options-edit.html | 2 +- platform/forms/res/templates/form.html | 4 +- 7 files changed, 69 insertions(+), 59 deletions(-) diff --git a/platform/commonUI/general/res/sass/_inspector.scss b/platform/commonUI/general/res/sass/_inspector.scss index b371dd65d1..03be9fe875 100644 --- a/platform/commonUI/general/res/sass/_inspector.scss +++ b/platform/commonUI/general/res/sass/_inspector.scss @@ -86,7 +86,11 @@ .form-row { @include align-items(center); border: none; - padding: 0; + padding: $interiorMarginSm 0; + input[type='text'], + input[type='search'] { + width: 100%; + } } } } diff --git a/platform/commonUI/general/res/sass/forms/_elems.scss b/platform/commonUI/general/res/sass/forms/_elems.scss index a48a8cfda4..b63fdad3d8 100644 --- a/platform/commonUI/general/res/sass/forms/_elems.scss +++ b/platform/commonUI/general/res/sass/forms/_elems.scss @@ -42,7 +42,7 @@ box-sizing: border-box; @include clearfix; border-top: 1px solid $colorFormLines; - margin-top: $m; + //margin-top: $m; padding: $formTBPad 0; position: relative; &.first { @@ -83,19 +83,6 @@ margin-right: 5px; } } - - .l-med input[type="text"] { - width: 200px; - } - - .l-small input[type="text"] { - width: 50px; - } - - .l-numeric input[type="text"] { - text-align: right; - } - .select { margin-right: $interiorMargin; } @@ -124,25 +111,23 @@ } } -.l-controls-first { - .form .form-row { - margin-top: $interiorMarginSm; - >.label, - >.controls { - line-height: inherit; - min-height: inherit;; - } - >.label { - @include flex(1 1 auto); - min-width: 0; - width: auto; - order: 2; - } - >.controls { - @include flex(0 0 auto); - margin-right: $interiorMargin; - order: 1; - } +.l-controls-first .form .form-row, +.form .form-row.l-controls-first { + >.label, + >.controls { + line-height: inherit; + min-height: inherit;; + } + >.label { + @include flex(1 1 auto); + min-width: 0; + width: auto; + order: 2; + } + >.controls { + @include flex(0 0 auto); + margin-right: $interiorMargin; + order: 1; } } @@ -191,6 +176,18 @@ input[type="search"] { } } +.l-input-med input[type="text"] { + width: 200px !important; +} + +.l-input-sm input[type="text"] { + width: 50px !important; +} + +.l-numeric input[type="text"] { + text-align: right; +} + textarea { @include nice-textarea($colorInputBg, $colorInputFg); position: absolute; diff --git a/platform/commonUI/general/res/sass/overlay/_overlay.scss b/platform/commonUI/general/res/sass/overlay/_overlay.scss index c4700795e5..d49a2ee97c 100644 --- a/platform/commonUI/general/res/sass/overlay/_overlay.scss +++ b/platform/commonUI/general/res/sass/overlay/_overlay.scss @@ -88,7 +88,7 @@ left: 0; right: 0; overflow: auto; - .field.l-med { + .field.l-input-med { input[type='text'] { width: 100%; } diff --git a/platform/features/plot/res/templates/plot-options-browse.html b/platform/features/plot/res/templates/plot-options-browse.html index 123ed43194..10067d506f 100644 --- a/platform/features/plot/res/templates/plot-options-browse.html +++ b/platform/features/plot/res/templates/plot-options-browse.html @@ -28,7 +28,7 @@ }
- Display + Plot Options + class="flex-elem l-flex-row no-validate"> diff --git a/platform/features/plot/src/PlotOptionsForm.js b/platform/features/plot/src/PlotOptionsForm.js index 4e7739e7d9..ccc3de79cc 100644 --- a/platform/features/plot/src/PlotOptionsForm.js +++ b/platform/features/plot/src/PlotOptionsForm.js @@ -48,9 +48,9 @@ define( 'control': 'select', 'key': 'key', 'options': [ - {'name':'scet', 'value': 'scet'}, - {'name':'sclk', 'value': 'sclk'}, - {'name':'lst', 'value': 'lst'} + {'name':'SCET', 'value': 'scet'}, + {'name':'SCLK', 'value': 'sclk'}, + {'name':'LST', 'value': 'lst'} ] } ] @@ -64,32 +64,35 @@ define( // itself. 'name': 'y-axis', 'rows': [ + { + 'name': 'Range', + 'control': 'select', + 'key': 'key', + 'options': [ + {'name':'EU', 'value': 'eu'}, + {'name':'DN', 'value': 'dn'}, + {'name':'Status', 'value': 'status'} + ] + }, { 'name': 'Autoscale', 'control': 'checkbox', - 'key': 'autoscale' + 'key': 'autoscale', + 'layout': 'control-first' }, { 'name': 'Min', 'control': 'textfield', 'key': 'min', - 'pattern': '[0-9]' + 'pattern': '[0-9]', + 'inputsize' : 'sm' }, { 'name': 'Max', 'control': 'textfield', 'key': 'max', - 'pattern': '[0-9]' - }, - { - 'name': 'Range', - 'control': 'select', - 'key': 'key', - 'options': [ - {'name':'eu', 'value': 'eu'}, - {'name':'dn', 'value': 'dn'}, - {'name':'status', 'value': 'status'} - ] + 'pattern': '[0-9]', + 'inputsize' : 'sm' } ] }] @@ -110,7 +113,8 @@ define( { 'name': 'Markers', 'control': 'checkbox', - 'key': 'markers' + 'key': 'markers', + 'layout': 'control-first' } ] }, @@ -120,19 +124,22 @@ define( 'name': 'No Line', 'control': 'radio', 'key': 'lineType', - 'value': 'noLine' + 'value': 'noLine', + 'layout': 'control-first' }, { 'name': 'Step Line', 'control': 'radio', 'key': 'lineType', - 'value': 'stepLine' + 'value': 'stepLine', + 'layout': 'control-first' }, { 'name': 'Linear Line', 'control': 'radio', 'key': 'lineType', - 'value': 'linearLine' + 'value': 'linearLine', + 'layout': 'control-first' } ] } diff --git a/platform/features/table/res/templates/table-options-edit.html b/platform/features/table/res/templates/table-options-edit.html index 54a8480be8..a696c9ccb9 100644 --- a/platform/features/table/res/templates/table-options-edit.html +++ b/platform/features/table/res/templates/table-options-edit.html @@ -20,7 +20,7 @@ at runtime from the About dialog for additional information. -->
- Display + Table Options
{{row.name}}