From 521db3c3fe6e91f8711c051691697d367ea5eb40 Mon Sep 17 00:00:00 2001 From: Charles Hacskaylo Date: Tue, 28 Jun 2016 16:10:54 -0700 Subject: [PATCH] [Frontend] Refactoring glyphs to classes Fixes #1047 In-progress; plot options, imagery buttons, cleanups in buttons.scss, edit-action buttons, .s-btn .no-label class added. --- platform/commonUI/edit/bundle.js | 5 ++- .../res/templates/edit-action-buttons.html | 2 +- .../general/res/sass/controls/_buttons.scss | 43 +++++-------------- .../general/res/sass/controls/_menus.scss | 2 +- platform/features/imagery/bundle.js | 1 + .../imagery/res/templates/imagery.html | 18 ++++---- .../features/plot/res/templates/plot.html | 18 +++----- .../plot/src/modes/PlotModeOptions.js | 2 + .../table/res/templates/mct-table.html | 2 +- 9 files changed, 35 insertions(+), 58 deletions(-) diff --git a/platform/commonUI/edit/bundle.js b/platform/commonUI/edit/bundle.js index 994c80d206..fbaf0d5c9f 100644 --- a/platform/commonUI/edit/bundle.js +++ b/platform/commonUI/edit/bundle.js @@ -208,6 +208,7 @@ define([ "category": "conclude-editing", "implementation": SaveAction, "name": "Save", + "cssclass": "icon-save", "description": "Save changes made to these objects.", "depends": [ "dialogService" @@ -218,7 +219,8 @@ define([ "key": "save", "category": "conclude-editing", "implementation": SaveAsAction, - "name": "Save", + "name": "Save As...", + "cssclass": "icon-save", "description": "Save changes made to these objects.", "depends": [ "$injector", @@ -234,6 +236,7 @@ define([ "category": "conclude-editing", "implementation": CancelAction, "name": "Cancel", + "cssclass": "icon-x no-label", "description": "Discard changes made to these objects.", "depends": [] } diff --git a/platform/commonUI/edit/res/templates/edit-action-buttons.html b/platform/commonUI/edit/res/templates/edit-action-buttons.html index 1d12fb7913..a32f011fc0 100644 --- a/platform/commonUI/edit/res/templates/edit-action-buttons.html +++ b/platform/commonUI/edit/res/templates/edit-action-buttons.html @@ -21,7 +21,7 @@ --> - diff --git a/platform/commonUI/general/res/sass/controls/_buttons.scss b/platform/commonUI/general/res/sass/controls/_buttons.scss index afa09aada6..9182ab7421 100644 --- a/platform/commonUI/general/res/sass/controls/_buttons.scss +++ b/platform/commonUI/general/res/sass/controls/_buttons.scss @@ -38,6 +38,11 @@ $pad: $interiorMargin * $baseRatio; vertical-align: top; @include btnSubtle($colorBtnBg, $colorBtnBgHov, $colorBtnFg, $colorBtnIcon); + &:before { + // Icon when it's included + margin-right: $interiorMarginSm; + } + &.lg { font-size: 1rem; } @@ -56,45 +61,19 @@ $pad: $interiorMargin * $baseRatio; @include btnSubtle($bg, $hc, $colorBtnMajorFg, $colorBtnMajorFg); } - &.t-save { - @extend .icon-save; - } - &.t-save-as:before { - content:'\e612'; - font-family: symbolsfont; - margin-right: $interiorMarginSm; - } - &.t-cancel { - @extend .icon-x; - .title-label { display: none; } + &.no-label { + .label, .title-label { display: none; } } &.pause-play { - // TO-DO: glyph refactoring - .icon:before { - content: "\0000F1"; - } + @extend .icon-pause; &.paused { @include btnSubtle($colorPausedBg, pushBack($colorPausedBg, 10%), $colorPausedFg, $colorPausedFg); - .icon { - @include pulse($dur: 1000ms); - :before { - content: "\0000EF"; - } - } + @extend .icon-play; + &:before { @include pulse($dur: 1000ms); } } } - &.show-thumbs { - .icon:before { - content: "\000039"; - } - } - - &.t-export { - @extend .icon-download; - } - .icon { font-size: 0.8rem; } @@ -105,7 +84,7 @@ $pad: $interiorMargin * $baseRatio; } .s-icon-btn { - // TO-DO: glyph refactoring + // TODO: glyph refactoring $c: $colorKey; @extend .s-btn; &:before { diff --git a/platform/commonUI/general/res/sass/controls/_menus.scss b/platform/commonUI/general/res/sass/controls/_menus.scss index 735ae67bae..1e1cd44093 100644 --- a/platform/commonUI/general/res/sass/controls/_menus.scss +++ b/platform/commonUI/general/res/sass/controls/_menus.scss @@ -73,7 +73,7 @@ } .menu { - // TO-DO: reduce size of icons + // TODO: reduce size of icons @extend .s-menu; display: block; position: absolute; diff --git a/platform/features/imagery/bundle.js b/platform/features/imagery/bundle.js index 50408a47f5..0f0326fb1a 100644 --- a/platform/features/imagery/bundle.js +++ b/platform/features/imagery/bundle.js @@ -42,6 +42,7 @@ define([ "name": "Imagery", "key": "imagery", "glyph": "ã", + "cssclass": "icon-image", "template": imageryTemplate, "priority": "preferred", "needs": [ diff --git a/platform/features/imagery/res/templates/imagery.html b/platform/features/imagery/res/templates/imagery.html index 5242c1b189..7ab739456f 100644 --- a/platform/features/imagery/res/templates/imagery.html +++ b/platform/features/imagery/res/templates/imagery.html @@ -5,18 +5,16 @@ @@ -27,8 +25,8 @@
- + {{imagery.getZone()}} {{imagery.getTime()}} {{imagery.getDate()}} @@ -36,15 +34,15 @@
+ ng-class="{ paused: imagery.paused() }"> - y + class="s-btn icon-new-window"> + diff --git a/platform/features/plot/res/templates/plot.html b/platform/features/plot/res/templates/plot.html index 12680c2b27..b4b24efd5d 100644 --- a/platform/features/plot/res/templates/plot.html +++ b/platform/features/plot/res/templates/plot.html @@ -87,33 +87,27 @@
- - < - - I -