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

Merge pull request #15940 from grafana/8px-system-margins3

Browse Source 
Removed headings-margin-bottom and gf-form-margin
This commit is contained in:
Torkel Ödegaard 2019-03-12 15:39:52 +01:00 committed by GitHub
commit f477066097
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 19 additions and 20 deletions
Show Stats 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 {
margin-bottom: $gf-form-margin;
margin-bottom: $space-xxs;
display: flex;
flex-direction: row;
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() {
width: 100%;
margin-right: $gf-form-margin;
margin-right: $space-xs;
@include border-radius($input-border-radius-sm);
background-color: $input-bg;
}

3
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
// variables. Mostly focused on spacing.
$space-xxs: ${theme.spacing.xxs} !default;
$space-xs: ${theme.spacing.xs} !default;
$space-sm: ${theme.spacing.s} !default;
$space-md: ${theme.spacing.m} !default;
@ -111,7 +112,6 @@ $font-size-h4: ${theme.typography.heading.h4} !default;
$font-size-h5: ${theme.typography.heading.h5} !default;
$font-size-h6: ${theme.typography.heading.h6} !default;
$headings-margin-bottom: ($spacer / 2) !default;
$headings-font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
$headings-font-weight: ${theme.typography.weight.normal} !default;
$headings-line-height: ${theme.typography.lineHeight.s} !default;
@ -165,7 +165,6 @@ $input-padding-y-lg: 10px !default;
$input-height: 35px !default;
$gf-form-margin: 3px;
$gf-form-input-height: 35px;
$cursor-disabled: not-allowed !default;

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

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

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

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

3
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
// variables. Mostly focused on spacing.
$space-xxs: 2px !default;
$space-xs: 4px !default;
$space-sm: 8px !default;
$space-md: 16px !default;
@ -114,7 +115,6 @@ $font-size-h4: 18px !default;
$font-size-h5: 16px !default;
$font-size-h6: 14px !default;
$headings-margin-bottom: ($spacer / 2) !default;
$headings-font-family: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
$headings-font-weight: 400 !default;
$headings-line-height: 1.1 !default;
@ -168,7 +168,6 @@ $input-padding-y-lg: 10px !default;
$input-height: 35px !default;
$gf-form-margin: 3px;
$gf-form-input-height: 35px;
$cursor-disabled: not-allowed !default;

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

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

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

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

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

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