From 02afd44dd1bba3824faca01ead10f17ebc2ce4f4 Mon Sep 17 00:00:00 2001 From: charlesh88 Date: Tue, 21 Aug 2018 11:44:05 -0700 Subject: [PATCH] Markup / scss refactor styles WIP - Moved glyph constants into _constants to avoid multiple loads of glyph classes; --- src/styles-new/_constants.scss | 120 ++++++++++++++++++++++++++++++++- src/styles-new/_glyphs.scss | 116 ------------------------------- src/styles-new/core.scss | 1 + src/styles-new/sass-base.scss | 2 +- 4 files changed, 121 insertions(+), 118 deletions(-) diff --git a/src/styles-new/_constants.scss b/src/styles-new/_constants.scss index acba0e3d76..4495058279 100644 --- a/src/styles-new/_constants.scss +++ b/src/styles-new/_constants.scss @@ -17,6 +17,124 @@ $inputTextPLeftRight: 5px; $inputTextP: $inputTextPTopBtm $inputTextPLeftRight; $treeItemIndent: 16px; $treeTypeIconW: 18px; +/*************** Items */ +$ueBrowseGridItemLg: 200px; + /************************** VISUAL */ -$controlDisabledOpacity: 0.3; \ No newline at end of file +$controlDisabledOpacity: 0.3; + +/************************** GLYPH CHAR UNICODES */ +$glyph-icon-alert-rect: '\e900'; +$glyph-icon-alert-triangle: '\e901'; +$glyph-icon-arrow-down: '\e902'; +$glyph-icon-arrow-left: '\e903'; +$glyph-icon-arrow-right: '\e904'; +$glyph-icon-arrow-double-up: '\e905'; +$glyph-icon-arrow-tall-up: '\e906'; +$glyph-icon-arrow-tall-down: '\e907'; +$glyph-icon-arrow-double-down: '\e908'; +$glyph-icon-arrow-up: '\e909'; +$glyph-icon-asterisk: '\e910'; +$glyph-icon-bell: '\e911'; +$glyph-icon-box: '\e912'; +$glyph-icon-box-with-arrow: '\e913'; +$glyph-icon-check: '\e914'; +$glyph-icon-connectivity: '\e915'; +$glyph-icon-database-in-brackets: '\e916'; +$glyph-icon-eye-open: '\e917'; +$glyph-icon-gear: '\e918'; +$glyph-icon-hourglass: '\e919'; +$glyph-icon-info: '\e920'; +$glyph-icon-link: '\e921'; +$glyph-icon-lock: '\e922'; +$glyph-icon-minus: '\e923'; +$glyph-icon-people: '\e924'; +$glyph-icon-person: '\e925'; +$glyph-icon-plus: '\e926'; +$glyph-icon-trash: '\e927'; +$glyph-icon-x: '\e928'; +$glyph-icon-brackets: '\e929'; +$glyph-icon-crosshair: '\e930'; +$glyph-icon-grippy: '\e931'; +$glyph-icon-arrow-right-equilateral: '\e932'; +$glyph-icon-arrows-out: '\e1000'; +$glyph-icon-arrows-right-left: '\e1001'; +$glyph-icon-arrows-up-down: '\e1002'; +$glyph-icon-bullet: '\e1004'; +$glyph-icon-calendar: '\e1005'; +$glyph-icon-chain-links: '\e1006'; +$glyph-icon-collapse-pane-left: '\e1007'; +$glyph-icon-collapse-pane-right: '\e1008'; +$glyph-icon-download: '\e1009'; +$glyph-icon-duplicate: '\e1010'; +$glyph-icon-folder-new: '\e1011'; +$glyph-icon-fullscreen-collapse: '\e1012'; +$glyph-icon-fullscreen-expand: '\e1013'; +$glyph-icon-layers: '\e1014'; +$glyph-icon-line-horz: '\e1015'; +$glyph-icon-magnify: '\e1016'; +$glyph-icon-magnify-in: '\e1017'; +$glyph-icon-magnify-out: '\e1018'; +$glyph-icon-menu-hamburger: '\e1019'; +$glyph-icon-move: '\e1020'; +$glyph-icon-new-window: '\e1021'; +$glyph-icon-paint-bucket: '\e1022'; +$glyph-icon-pause: '\e1023'; +$glyph-icon-pencil: '\e1024'; +$glyph-icon-play: '\e1025'; +$glyph-icon-plot-resource: '\e1026'; +$glyph-icon-pointer-left: '\e1027'; +$glyph-icon-pointer-right: '\e1028'; +$glyph-icon-refresh: '\e1029'; +$glyph-icon-save: '\e1030'; +$glyph-icon-sine: '\e1031'; +$glyph-icon-T: '\e1032'; +$glyph-icon-thumbs-strip: '\e1033'; +$glyph-icon-two-parts-both: '\e1034'; +$glyph-icon-two-parts-one-only: '\e1035'; +$glyph-icon-resync: '\e1036'; +$glyph-icon-reset: '\e1037'; +$glyph-icon-x-in-circle: '\e1038'; +$glyph-icon-brightness: '\e1039'; +$glyph-icon-contrast: '\e1040'; +$glyph-icon-expand: '\e1041'; +$glyph-icon-list-view: '\e1042'; +$glyph-icon-grid-snap-to: '\e1043'; +$glyph-icon-grid-snap-no: '\e1044'; +$glyph-icon-frame-show: '\e1045'; +$glyph-icon-frame-hide: '\e1046'; +$glyph-icon-import: '\e1047'; +$glyph-icon-export: '\e1048'; +$glyph-icon-activity: '\e1100'; +$glyph-icon-activity-mode: '\e1101'; +$glyph-icon-autoflow-tabular: '\e1102'; +$glyph-icon-clock: '\e1103'; +$glyph-icon-database: '\e1104'; +$glyph-icon-database-query: '\e1105'; +$glyph-icon-dataset: '\e1106'; +$glyph-icon-datatable: '\e1107'; +$glyph-icon-dictionary: '\e1108'; +$glyph-icon-folder: '\e1109'; +$glyph-icon-image: '\e1110'; +$glyph-icon-layout: '\e1111'; +$glyph-icon-object: '\e1112'; +$glyph-icon-object-unknown: '\e1113'; +$glyph-icon-packet: '\e1114'; +$glyph-icon-page: '\e1115'; +$glyph-icon-plot-overlay: '\e1116'; +$glyph-icon-plot-stacked: '\e1117'; +$glyph-icon-session: '\e1118'; +$glyph-icon-tabular: '\e1119'; +$glyph-icon-tabular-lad: '\e1120'; +$glyph-icon-tabular-lad-set: '\e1121'; +$glyph-icon-tabular-realtime: '\e1122'; +$glyph-icon-tabular-scrolling: '\e1123'; +$glyph-icon-telemetry: '\e1124'; +$glyph-icon-telemetry-panel: '\e1125'; +$glyph-icon-timeline: '\e1126'; +$glyph-icon-timer: '\e1127'; +$glyph-icon-topic: '\e1128'; +$glyph-icon-box-with-dashed-lines: '\e1129'; +$glyph-icon-summary-widget: '\e1130'; +$glyph-icon-notebook: '\e1131'; \ No newline at end of file diff --git a/src/styles-new/_glyphs.scss b/src/styles-new/_glyphs.scss index bc15f703e9..57c8aec0c5 100644 --- a/src/styles-new/_glyphs.scss +++ b/src/styles-new/_glyphs.scss @@ -41,122 +41,6 @@ } } -/************************** CHAR UNICODES */ - -$glyph-icon-alert-rect: '\e900'; -$glyph-icon-alert-triangle: '\e901'; -$glyph-icon-arrow-down: '\e902'; -$glyph-icon-arrow-left: '\e903'; -$glyph-icon-arrow-right: '\e904'; -$glyph-icon-arrow-double-up: '\e905'; -$glyph-icon-arrow-tall-up: '\e906'; -$glyph-icon-arrow-tall-down: '\e907'; -$glyph-icon-arrow-double-down: '\e908'; -$glyph-icon-arrow-up: '\e909'; -$glyph-icon-asterisk: '\e910'; -$glyph-icon-bell: '\e911'; -$glyph-icon-box: '\e912'; -$glyph-icon-box-with-arrow: '\e913'; -$glyph-icon-check: '\e914'; -$glyph-icon-connectivity: '\e915'; -$glyph-icon-database-in-brackets: '\e916'; -$glyph-icon-eye-open: '\e917'; -$glyph-icon-gear: '\e918'; -$glyph-icon-hourglass: '\e919'; -$glyph-icon-info: '\e920'; -$glyph-icon-link: '\e921'; -$glyph-icon-lock: '\e922'; -$glyph-icon-minus: '\e923'; -$glyph-icon-people: '\e924'; -$glyph-icon-person: '\e925'; -$glyph-icon-plus: '\e926'; -$glyph-icon-trash: '\e927'; -$glyph-icon-x: '\e928'; -$glyph-icon-brackets: '\e929'; -$glyph-icon-crosshair: '\e930'; -$glyph-icon-grippy: '\e931'; -$glyph-icon-arrow-right-equilateral: '\e932'; -$glyph-icon-arrows-out: '\e1000'; -$glyph-icon-arrows-right-left: '\e1001'; -$glyph-icon-arrows-up-down: '\e1002'; -$glyph-icon-bullet: '\e1004'; -$glyph-icon-calendar: '\e1005'; -$glyph-icon-chain-links: '\e1006'; -$glyph-icon-collapse-pane-left: '\e1007'; -$glyph-icon-collapse-pane-right: '\e1008'; -$glyph-icon-download: '\e1009'; -$glyph-icon-duplicate: '\e1010'; -$glyph-icon-folder-new: '\e1011'; -$glyph-icon-fullscreen-collapse: '\e1012'; -$glyph-icon-fullscreen-expand: '\e1013'; -$glyph-icon-layers: '\e1014'; -$glyph-icon-line-horz: '\e1015'; -$glyph-icon-magnify: '\e1016'; -$glyph-icon-magnify-in: '\e1017'; -$glyph-icon-magnify-out: '\e1018'; -$glyph-icon-menu-hamburger: '\e1019'; -$glyph-icon-move: '\e1020'; -$glyph-icon-new-window: '\e1021'; -$glyph-icon-paint-bucket: '\e1022'; -$glyph-icon-pause: '\e1023'; -$glyph-icon-pencil: '\e1024'; -$glyph-icon-play: '\e1025'; -$glyph-icon-plot-resource: '\e1026'; -$glyph-icon-pointer-left: '\e1027'; -$glyph-icon-pointer-right: '\e1028'; -$glyph-icon-refresh: '\e1029'; -$glyph-icon-save: '\e1030'; -$glyph-icon-sine: '\e1031'; -$glyph-icon-T: '\e1032'; -$glyph-icon-thumbs-strip: '\e1033'; -$glyph-icon-two-parts-both: '\e1034'; -$glyph-icon-two-parts-one-only: '\e1035'; -$glyph-icon-resync: '\e1036'; -$glyph-icon-reset: '\e1037'; -$glyph-icon-x-in-circle: '\e1038'; -$glyph-icon-brightness: '\e1039'; -$glyph-icon-contrast: '\e1040'; -$glyph-icon-expand: '\e1041'; -$glyph-icon-list-view: '\e1042'; -$glyph-icon-grid-snap-to: '\e1043'; -$glyph-icon-grid-snap-no: '\e1044'; -$glyph-icon-frame-show: '\e1045'; -$glyph-icon-frame-hide: '\e1046'; -$glyph-icon-import: '\e1047'; -$glyph-icon-export: '\e1048'; -$glyph-icon-activity: '\e1100'; -$glyph-icon-activity-mode: '\e1101'; -$glyph-icon-autoflow-tabular: '\e1102'; -$glyph-icon-clock: '\e1103'; -$glyph-icon-database: '\e1104'; -$glyph-icon-database-query: '\e1105'; -$glyph-icon-dataset: '\e1106'; -$glyph-icon-datatable: '\e1107'; -$glyph-icon-dictionary: '\e1108'; -$glyph-icon-folder: '\e1109'; -$glyph-icon-image: '\e1110'; -$glyph-icon-layout: '\e1111'; -$glyph-icon-object: '\e1112'; -$glyph-icon-object-unknown: '\e1113'; -$glyph-icon-packet: '\e1114'; -$glyph-icon-page: '\e1115'; -$glyph-icon-plot-overlay: '\e1116'; -$glyph-icon-plot-stacked: '\e1117'; -$glyph-icon-session: '\e1118'; -$glyph-icon-tabular: '\e1119'; -$glyph-icon-tabular-lad: '\e1120'; -$glyph-icon-tabular-lad-set: '\e1121'; -$glyph-icon-tabular-realtime: '\e1122'; -$glyph-icon-tabular-scrolling: '\e1123'; -$glyph-icon-telemetry: '\e1124'; -$glyph-icon-telemetry-panel: '\e1125'; -$glyph-icon-timeline: '\e1126'; -$glyph-icon-timer: '\e1127'; -$glyph-icon-topic: '\e1128'; -$glyph-icon-box-with-dashed-lines: '\e1129'; -$glyph-icon-summary-widget: '\e1130'; -$glyph-icon-notebook: '\e1131'; - /************************** 16 PX CLASSES */ .icon-alert-rect { @include glyphBefore($glyph-icon-alert-rect); } diff --git a/src/styles-new/core.scss b/src/styles-new/core.scss index d60be63dce..f7579b07f5 100644 --- a/src/styles-new/core.scss +++ b/src/styles-new/core.scss @@ -2,6 +2,7 @@ @import "sass-base.scss"; /******************** RENDERS CSS */ +@import "glyphs"; @import "global"; @import "controls"; diff --git a/src/styles-new/sass-base.scss b/src/styles-new/sass-base.scss index 75f9f36061..f8c7986349 100644 --- a/src/styles-new/sass-base.scss +++ b/src/styles-new/sass-base.scss @@ -2,6 +2,6 @@ // Meant for use as a single line import in Vue SFC's. // Do not include anything that renders to CSS! @import "constants"; +@import "constants-mobile"; @import "constants-snow"; // TEMP -@import "glyphs"; @import "mixins"; \ No newline at end of file