IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

removed gf-form-margin variable and replaced with space- variables where it was used

Browse Source
This commit is contained in:
ijin08
2019-03-12 12:30:34 +01:00
parent 1432fdd102
commit 7a15528223
10 changed files with 19 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/grafana-ui/src/components/FormField/_FormField.scss
View File

@@ -1,5 +1,5 @@
.form-field { .form-field {
margin-bottom: $gf-form-margin; margin-bottom: $space-xxs;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;

2
packages/grafana-ui/src/components/Select/_Select.scss
View File

@@ -3,7 +3,7 @@ $select-input-bg-disabled: $input-bg-disabled;
@mixin select-control() { @mixin select-control() {
width: 100%; width: 100%;
margin-right: $gf-form-margin; margin-right: $space-xs;
@include border-radius($input-border-radius-sm); @include border-radius($input-border-radius-sm);
background-color: $input-bg; background-color: $input-bg;
} }

2
packages/grafana-ui/src/themes/_variables.scss.tmpl.ts
View File

@@ -17,6 +17,7 @@ $enable-hover-media-query: false !default;
// Control the default styling of most Bootstrap elements by modifying these // Control the default styling of most Bootstrap elements by modifying these
// variables. Mostly focused on spacing. // variables. Mostly focused on spacing.
$space-xxs: ${theme.spacing.xxs} !default;
$space-xs: ${theme.spacing.xs} !default; $space-xs: ${theme.spacing.xs} !default;
$space-sm: ${theme.spacing.s} !default; $space-sm: ${theme.spacing.s} !default;
$space-md: ${theme.spacing.m} !default; $space-md: ${theme.spacing.m} !default;
@@ -164,7 +165,6 @@ $input-padding-y-lg: 10px !default;
$input-height: 35px !default; $input-height: 35px !default;
$gf-form-margin: 3px;
$gf-form-input-height: 35px; $gf-form-input-height: 35px;
$cursor-disabled: not-allowed !default; $cursor-disabled: not-allowed !default;

1
packages/grafana-ui/src/themes/default.ts
View File

@@ -44,6 +44,7 @@ const theme: GrafanaThemeCommons = {
}, },
spacing: { spacing: {
d: '14px', d: '14px',
xxs: '2px',
xs: '4px', xs: '4px',
s: '8px', s: '8px',
m: '16px', m: '16px',

1
packages/grafana-ui/src/types/theme.ts
View File

@@ -49,6 +49,7 @@ export interface GrafanaThemeCommons {
}; };
spacing: { spacing: {
d: string; d: string;
xxs: string;
xs: string; xs: string;
s: string; s: string;
m: string; m: string;

2
public/sass/_variables.generated.scss
View File

@@ -20,6 +20,7 @@ $enable-hover-media-query: false !default;
// Control the default styling of most Bootstrap elements by modifying these // Control the default styling of most Bootstrap elements by modifying these
// variables. Mostly focused on spacing. // variables. Mostly focused on spacing.
$space-xxs: 2px !default;
$space-xs: 4px !default; $space-xs: 4px !default;
$space-sm: 8px !default; $space-sm: 8px !default;
$space-md: 16px !default; $space-md: 16px !default;
@@ -167,7 +168,6 @@ $input-padding-y-lg: 10px !default;
$input-height: 35px !default; $input-height: 35px !default;
$gf-form-margin: 3px;
$gf-form-input-height: 35px; $gf-form-input-height: 35px;
$cursor-disabled: not-allowed !default; $cursor-disabled: not-allowed !default;

2
public/sass/base/_type.scss
View File

@@ -109,7 +109,7 @@ h6,
.h4, .h4,
.h5, .h5,
.h6 { .h6 {
margin-bottom: $space-s; margin-bottom: $space-sm;
font-family: $headings-font-family; font-family: $headings-font-family;
font-weight: $headings-font-weight; font-weight: $headings-font-weight;
line-height: $headings-line-height; line-height: $headings-line-height;

17
public/sass/components/_gf-form.scss
View File

@@ -1,8 +1,7 @@
$gf-form-margin: 3px;
$input-border: 1px solid $input-border-color; $input-border: 1px solid $input-border-color;
.gf-form { .gf-form {
margin-bottom: $gf-form-margin; margin-bottom: $space-xxs;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: flex-start; align-items: flex-start;
@@ -33,7 +32,7 @@ $input-border: 1px solid $input-border-color;
.gf-form--has-input-icon { .gf-form--has-input-icon {
position: relative; position: relative;
margin-right: $gf-form-margin; margin-right: $space-xs;
.gf-form-input-icon { .gf-form-input-icon {
position: absolute; position: absolute;
@@ -82,7 +81,7 @@ $input-border: 1px solid $input-border-color;
align-content: flex-start; align-content: flex-start;
.gf-form + .gf-form { .gf-form + .gf-form {
margin-left: $gf-form-margin; margin-left: $space-xs;
} }
&--nowrap { &--nowrap {
@@ -147,14 +146,14 @@ $input-border: 1px solid $input-border-color;
} }
.gf-form-label + .gf-form-label { .gf-form-label + .gf-form-label {
margin-right: $gf-form-margin; margin-right: $space-xs;
} }
.gf-form-pre { .gf-form-pre {
display: block; display: block;
flex-grow: 1; flex-grow: 1;
margin: 0; margin: 0;
margin-right: $gf-form-margin; margin-right: $space-xs;
border: $input-btn-border-width solid transparent; border: $input-btn-border-width solid transparent;
border-left: none; border-left: none;
@include border-radius($label-border-radius-sm); @include border-radius($label-border-radius-sm);
@@ -336,7 +335,7 @@ $input-border: 1px solid $input-border-color;
.gf-form-btn { .gf-form-btn {
padding: $input-padding-y $input-padding-x; padding: $input-padding-y $input-padding-x;
margin-right: $gf-form-margin; margin-right: $space-xs;
line-height: $input-line-height; line-height: $input-line-height;
font-size: $font-size-sm; font-size: $font-size-sm;
@@ -354,7 +353,7 @@ $input-border: 1px solid $input-border-color;
} }
.gf-form-dropdown-typeahead { .gf-form-dropdown-typeahead {
margin-right: $gf-form-margin; //margin-right: $space-xs; ?
position: relative; position: relative;
&::after { &::after {
@@ -391,7 +390,7 @@ $input-border: 1px solid $input-border-color;
} }
&--header { &--header {
margin-bottom: $gf-form-margin; margin-bottom: $space-xxs;
} }
&--no-padding { &--no-padding {

2
public/sass/components/_infobox.scss
View File

@@ -5,7 +5,7 @@
margin-bottom: 2rem; margin-bottom: 2rem;
border-top: 3px solid $info-box-border-color; border-top: 3px solid $info-box-border-color;
margin-bottom: $spacer; margin-bottom: $spacer;
margin-right: $gf-form-margin; margin-right: $space-xs;
box-shadow: $card-shadow; box-shadow: $card-shadow;
flex-grow: 1; flex-grow: 1;

6
public/sass/utils/_widths.scss
View File

@@ -8,20 +8,20 @@
// widths // widths
@for $i from 1 through 30 { @for $i from 1 through 30 {
.width-#{$i} { .width-#{$i} {
width: ($spacer * $i) - $gf-form-margin !important; width: ($spacer * $i) - $space-xs !important;
} }
} }
@for $i from 1 through 30 { @for $i from 1 through 30 {
.max-width-#{$i} { .max-width-#{$i} {
max-width: ($spacer * $i) - $gf-form-margin !important; max-width: ($spacer * $i) - $space-xs !important;
flex-grow: 1; flex-grow: 1;
} }
} }
@for $i from 1 through 30 { @for $i from 1 through 30 {
.min-width-#{$i} { .min-width-#{$i} {
min-width: ($spacer * $i) - $gf-form-margin !important; min-width: ($spacer * $i) - $space-xs !important;
} }
} }