From a418697453ae33c655d684db4eab3df063d7c986 Mon Sep 17 00:00:00 2001 From: ijin08 Date: Tue, 12 Mar 2019 08:10:31 +0100 Subject: [PATCH 1/2] s -> sm, m -> md, l -> lg --- .../src/themes/_variables.scss.tmpl.ts | 6 ++--- .../AddPanelWidget/_AddPanelWidget.scss | 8 +++---- public/sass/_variables.generated.scss | 6 ++--- public/sass/components/_add_data_source.scss | 4 ++-- public/sass/components/_cards.scss | 22 +++++++++---------- .../sass/components/_dashboard_settings.scss | 6 ++--- public/sass/components/_sidemenu.scss | 4 ++-- 7 files changed, 28 insertions(+), 28 deletions(-) diff --git a/packages/grafana-ui/src/themes/_variables.scss.tmpl.ts b/packages/grafana-ui/src/themes/_variables.scss.tmpl.ts index 531f06e1153..bf6a5fb9c79 100644 --- a/packages/grafana-ui/src/themes/_variables.scss.tmpl.ts +++ b/packages/grafana-ui/src/themes/_variables.scss.tmpl.ts @@ -18,9 +18,9 @@ $enable-hover-media-query: false !default; // variables. Mostly focused on spacing. $space-xs: ${theme.spacing.xs} !default; -$space-s: ${theme.spacing.s} !default; -$space-m: ${theme.spacing.m} !default; -$space-l: ${theme.spacing.l} !default; +$space-sm: ${theme.spacing.s} !default; +$space-md: ${theme.spacing.m} !default; +$space-lg: ${theme.spacing.l} !default; $space-xl: ${theme.spacing.xl} !default; $spacer: ${theme.spacing.d} !default; $spacer-x: $spacer !default; diff --git a/public/app/features/dashboard/components/AddPanelWidget/_AddPanelWidget.scss b/public/app/features/dashboard/components/AddPanelWidget/_AddPanelWidget.scss index 6d6bba7e1eb..941e36c5e33 100644 --- a/public/app/features/dashboard/components/AddPanelWidget/_AddPanelWidget.scss +++ b/public/app/features/dashboard/components/AddPanelWidget/_AddPanelWidget.scss @@ -20,7 +20,7 @@ .gicon { font-size: 30px; - margin-right: $space-m; + margin-right: $space-md; } &:hover { @@ -36,12 +36,12 @@ } .add-panel-widget__link { - margin: 0 $space-s; + margin: 0 $space-sm; width: 154px; } .add-panel-widget__icon { - margin-bottom: $space-s; + margin-bottom: $space-sm; .gicon { color: white; @@ -62,7 +62,7 @@ .add-panel-widget__create { display: inherit; - margin-bottom: $space-l; + margin-bottom: $space-lg; // this is to have the big button appear centered margin-top: 55px; } diff --git a/public/sass/_variables.generated.scss b/public/sass/_variables.generated.scss index ca563e6dd97..b43345127e6 100644 --- a/public/sass/_variables.generated.scss +++ b/public/sass/_variables.generated.scss @@ -21,9 +21,9 @@ $enable-hover-media-query: false !default; // variables. Mostly focused on spacing. $space-xs: 4px !default; -$space-s: 8px !default; -$space-m: 16px !default; -$space-l: 24px !default; +$space-sm: 8px !default; +$space-md: 16px !default; +$space-lg: 24px !default; $space-xl: 32px !default; $spacer: 14px !default; $spacer-x: $spacer !default; diff --git a/public/sass/components/_add_data_source.scss b/public/sass/components/_add_data_source.scss index 2df78b0ed9e..4046be2a723 100644 --- a/public/sass/components/_add_data_source.scss +++ b/public/sass/components/_add_data_source.scss @@ -7,7 +7,7 @@ .add-data-source-search { display: flex; justify-content: center; - margin-bottom: $space-l; + margin-bottom: $space-lg; } .add-data-source-grid { @@ -41,6 +41,6 @@ } .add-data-source-grid-item-logo { - margin: 0 $space-m; + margin: 0 $space-md; width: 55px; } diff --git a/public/sass/components/_cards.scss b/public/sass/components/_cards.scss index ff694d607c8..58d4b1ab5d2 100644 --- a/public/sass/components/_cards.scss +++ b/public/sass/components/_cards.scss @@ -1,7 +1,7 @@ .layout-selector { @include clearfix(); - margin-left: $space-m; + margin-left: $space-md; text-align: right; button { @@ -9,7 +9,7 @@ color: $text-color-weak; box-shadow: $card-shadow; border: none; - padding: $space-s; + padding: $space-sm; line-height: 1; font-size: 130%; float: right; @@ -50,7 +50,7 @@ height: 100%; background: $card-background; box-shadow: $card-shadow; - padding: $space-m; + padding: $space-md; border-radius: 4px; &:hover { @@ -58,7 +58,7 @@ } .label-tag { - margin-left: $space-s; + margin-left: $space-sm; font-size: 11px; padding: 2px 6px; } @@ -81,7 +81,7 @@ } .card-item-header { - margin-bottom: $space-m; + margin-bottom: $space-md; } .card-item-type { @@ -103,7 +103,7 @@ } .card-item-label { - margin-left: $space-s; + margin-left: $space-sm; } .card-item-sub-name { @@ -116,7 +116,7 @@ .card-item-sub-name--header { color: $text-color-weak; text-transform: uppercase; - margin-bottom: $space-m; + margin-bottom: $space-md; font-size: $font-size-sm; font-weight: bold; } @@ -129,7 +129,7 @@ .card-item-notice { font-size: $font-size-sm; display: inline-block; - margin-left: $space-m; + margin-left: $space-md; } .card-item-header-action { @@ -138,7 +138,7 @@ .card-item-wrapper { width: 100%; - padding: 0 $space-m $space-m 0; + padding: 0 $space-md $space-md 0; } .card-item-wrapper--clickable { @@ -146,7 +146,7 @@ } .card-item-figure { - margin: 0 $space-m $space-m 0; + margin: 0 $space-md $space-md 0; height: 6rem; img { @@ -205,7 +205,7 @@ } .card-item-figure { - margin: 0 $space-m 0 0; + margin: 0 $space-md 0 0; img { width: 48px; } diff --git a/public/sass/components/_dashboard_settings.scss b/public/sass/components/_dashboard_settings.scss index 19c2f49d814..173ab1a3935 100644 --- a/public/sass/components/_dashboard_settings.scss +++ b/public/sass/components/_dashboard_settings.scss @@ -41,7 +41,7 @@ font-size: $font-size-h3; padding-right: 60px; white-space: nowrap; - margin-bottom: $space-m; + margin-bottom: $space-md; i { font-size: 25px; @@ -92,10 +92,10 @@ margin: 40px $space-xl 0 0; button { - margin-bottom: $space-s; + margin-bottom: $space-sm; } } .dashboard-settings__json-save-button { - margin-top: $space-m; + margin-top: $space-md; } diff --git a/public/sass/components/_sidemenu.scss b/public/sass/components/_sidemenu.scss index c5bcf0ee8dd..c48a34651c0 100644 --- a/public/sass/components/_sidemenu.scss +++ b/public/sass/components/_sidemenu.scss @@ -285,8 +285,8 @@ li.sidemenu-org-switcher { position: unset; width: 100%; float: none; - margin-top: $space-s; - margin-bottom: $space-s; + margin-top: $space-sm; + margin-bottom: $space-sm; > li > a { padding-left: 15px; From d47f6e5bb335dce664659fa4837c92a6daf63d34 Mon Sep 17 00:00:00 2001 From: ijin08 Date: Tue, 12 Mar 2019 08:34:55 +0100 Subject: [PATCH 2/2] s -> sm, m -> md, l -> lg --- public/sass/components/_page_loader.scss | 2 +- public/sass/components/_panel_editor.scss | 4 ++-- public/sass/components/_panel_logs.scss | 2 +- public/sass/components/_submenu.scss | 2 +- public/sass/pages/_explore.scss | 12 ++++++------ 5 files changed, 11 insertions(+), 11 deletions(-) diff --git a/public/sass/components/_page_loader.scss b/public/sass/components/_page_loader.scss index 6fb5ea8ffb2..0a3eac40a0c 100644 --- a/public/sass/components/_page_loader.scss +++ b/public/sass/components/_page_loader.scss @@ -7,7 +7,7 @@ &__spinner { font-size: 32px; - margin-bottom: $space-s; + margin-bottom: $space-sm; } &__text { diff --git a/public/sass/components/_panel_editor.scss b/public/sass/components/_panel_editor.scss index 81d6e4e9e17..8acf98be1b2 100644 --- a/public/sass/components/_panel_editor.scss +++ b/public/sass/components/_panel_editor.scss @@ -21,7 +21,7 @@ } .panel-editor-container__editor { - margin-top: $space-l; + margin-top: $space-lg; display: flex; flex-direction: row; flex: 1 1 0; @@ -80,7 +80,7 @@ } .submenu-controls { - padding: 0 $dashboard-padding $space-s $dashboard-padding; + padding: 0 $dashboard-padding $space-sm $dashboard-padding; } .panel-editor-container__panel { diff --git a/public/sass/components/_panel_logs.scss b/public/sass/components/_panel_logs.scss index edb72b829e2..7c36a751572 100644 --- a/public/sass/components/_panel_logs.scss +++ b/public/sass/components/_panel_logs.scss @@ -6,7 +6,7 @@ $column-horizontal-spacing: 10px; padding: $panel-padding; padding-top: 10px; border-radius: $border-radius; - margin: $space-m 0 $space-s; + margin: $space-md 0 $space-sm; border: $panel-border; flex-direction: column; } diff --git a/public/sass/components/_submenu.scss b/public/sass/components/_submenu.scss index a70b1e46676..514aa44525e 100644 --- a/public/sass/components/_submenu.scss +++ b/public/sass/components/_submenu.scss @@ -4,7 +4,7 @@ flex-wrap: wrap; align-content: flex-start; align-items: flex-start; - padding: 0 0 $space-s 0; + padding: 0 0 $space-sm 0; } .annotation-disabled, diff --git a/public/sass/pages/_explore.scss b/public/sass/pages/_explore.scss index a68d7f1dcb6..d3b1c291547 100644 --- a/public/sass/pages/_explore.scss +++ b/public/sass/pages/_explore.scss @@ -197,7 +197,7 @@ } .explore-panel { - margin-top: $space-s; + margin-top: $space-sm; } .explore-panel__body { @@ -216,20 +216,20 @@ .explore-panel__header-label { font-weight: 500; - margin-right: $space-s; + margin-right: $space-sm; font-size: $font-size-h6; box-shadow: $text-shadow-faint; } .explore-panel__header-buttons { - margin-right: $space-s; + margin-right: $space-sm; font-size: $font-size-lg; line-height: $font-size-h6; } .time-series-disclaimer { width: 300px; - margin: $space-s auto; + margin: $space-sm auto; padding: 10px 0; border-radius: $border-radius; text-align: center; @@ -407,7 +407,7 @@ .ReactTable .-pagination { border-top: none; box-shadow: none; - margin-top: $space-s; + margin-top: $space-sm; } .ReactTable .-pagination .-btn { color: $blue; @@ -448,7 +448,7 @@ // TODO Experimental .cheat-sheet-item { - margin: $space-l 0; + margin: $space-lg 0; width: 50%; }