apitech
/
grafana
mirror of https://github.com/grafana/grafana
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

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

Browse Source
pull/15940/head
ijin08 6 years ago
parent 1432fdd102
commit 7a15528223
10 changed files with 19 additions and 18 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 2
      packages/grafana-ui/src/components/FormField/_FormField.scss
  2. 2
      packages/grafana-ui/src/components/Select/_Select.scss
  3. 2
      packages/grafana-ui/src/themes/_variables.scss.tmpl.ts
  4. 1
      packages/grafana-ui/src/themes/default.ts
  5. 1
      packages/grafana-ui/src/types/theme.ts
  6. 2
      public/sass/_variables.generated.scss
  7. 2
      public/sass/base/_type.scss
  8. 17
      public/sass/components/_gf-form.scss
  9. 2
      public/sass/components/_infobox.scss
  10. 6
      public/sass/utils/_widths.scss

2
packages/grafana-ui/src/components/FormField/_FormField.scss
Unescape 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
Unescape 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
Unescape 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
Unescape 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
Unescape 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
Unescape 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
Unescape 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
Unescape 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
Unescape 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
Unescape 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;
} }
} }

Write Preview
Loading…
Cancel
Save