Refactor: Theme input padding variables (#16048)

* removed input padding variables and replaced with new inset variables, also removed unused class in _gf-form

* removed last input padding variable

* removed table-cell-padding variable

* added input padding variable to template file

* fixed input-padding variable

* removed regualt inset variable(for now), added input-padding to a class

* removed empty line
This commit is contained in:
Patrick O'Carroll
2019-03-28 11:13:53 +01:00
committed by Torkel Ödegaard
parent 0112bdeb6a
commit 52851a38b8
14 changed files with 36 additions and 54 deletions

View File

@@ -69,7 +69,7 @@
.thresholds-row-input-inner-value > input {
height: $input-height;
padding: $input-padding-y $input-padding-x;
padding: $input-padding;
width: 150px;
border-top: 1px solid $input-label-border-color;
border-bottom: 1px solid $input-label-border-color;
@@ -96,7 +96,7 @@
align-items: center;
justify-content: center;
height: $input-height;
padding: $input-padding-y $input-padding-x;
padding: $input-padding;
width: 42px;
background-color: $input-label-bg;
border: 1px solid $input-label-border-color;

View File

@@ -17,12 +17,15 @@ $enable-hover-media-query: false !default;
// Control the default styling of most Bootstrap elements by modifying these
// variables. Mostly focused on spacing.
$space-inset-squish-md: ${theme.spacing.insetSquishMd} !default;
$space-xxs: ${theme.spacing.xxs} !default;
$space-xs: ${theme.spacing.xs} !default;
$space-sm: ${theme.spacing.sm} !default;
$space-md: ${theme.spacing.md} !default;
$space-lg: ${theme.spacing.lg} !default;
$space-xl: ${theme.spacing.xl} !default;
$spacer: ${theme.spacing.d} !default;
$spacer-x: $spacer !default;
$spacer-y: $spacer !default;
@@ -132,15 +135,7 @@ $page-sidebar-margin: 56px;
$link-decoration: ${theme.typography.link.decoration} !default;
$link-hover-decoration: ${theme.typography.link.hoverDecoration} !default;
// Tables
//
// Customizes the \`.table\` component with basic values, each used across all table variations.
$table-cell-padding: 4px 10px !default;
// Forms
$input-padding-x: 10px !default;
$input-padding-y: 8px !default;
$input-line-height: 18px !default;
$input-border-radius: 0 $border-radius $border-radius 0 !default;
@@ -149,9 +144,7 @@ $input-border-radius-sm: 0 $border-radius-sm $border-radius-sm 0 !default;
$label-border-radius: $border-radius 0 0 $border-radius !default;
$label-border-radius-sm: $border-radius-sm 0 0 $border-radius-sm !default;
$input-padding-x-lg: 20px !default;
$input-padding-y-lg: 10px !default;
$input-padding: ${theme.spacing.sm};
$input-height: 35px !default;
$cursor-disabled: not-allowed !default;

View File

@@ -47,6 +47,7 @@ const theme: GrafanaThemeCommons = {
xl: '1200px',
},
spacing: {
insetSquishMd: '4px 8px',
d: '14px',
xxs: '2px',
xs: '4px',

View File

@@ -52,6 +52,7 @@ export interface GrafanaThemeCommons {
};
};
spacing: {
insetSquishMd: string;
d: string;
xxs: string;
xs: string;