changed all rems to pixels in defaults and template, changed back root font size

This commit is contained in:
ijin08 2019-03-08 13:02:55 +01:00
parent c5f4239703
commit 00ce556bd0
5 changed files with 58 additions and 52 deletions

View File

@ -53,7 +53,7 @@
}
.panel-options-group__title {
font-size: 1.1rem;
font-size: 16px;
position: relative;
top: 1px;
}

View File

@ -17,7 +17,7 @@ $enable-hover-media-query: false !default;
// Control the default styling of most Bootstrap elements by modifying these
// variables. Mostly focused on spacing.
$spacer: .875rem !default;
$spacer: ${theme.spacing.m} !default;
$spacer-x: $spacer !default;
$spacer-y: $spacer !default;
$spacers: (
@ -46,7 +46,7 @@ $spacers: (
),
),
) !default;
$border-width: 1px !default;
$border-width: ${theme.border.width.s} !default;
// Grid breakpoints
//
@ -54,11 +54,11 @@ $border-width: 1px !default;
// adapting to different screen sizes, for use in media queries.
$grid-breakpoints: (
xs: 0,
sm: 544px,
md: 768px,
lg: 992px,
xl: 1200px,
xs: ${theme.breakpoints.xs},
sm: ${theme.breakpoints.s},
md: ${theme.breakpoints.m},
lg: ${theme.breakpoints.l},
xl: ${theme.breakpoints.xl},
) !default;
// Grid containers
@ -127,8 +127,8 @@ $border-radius-sm: 2px !default;
// Page
$page-sidebar-width: 9.625rem;
$page-sidebar-margin: 3.5rem;
$page-sidebar-width: 154px;
$page-sidebar-margin: 56px;
// Links
// -------------------------
@ -160,7 +160,7 @@ $input-padding-y-lg: 10px !default;
$input-height: 35px !default;
$gf-form-margin: 0.175rem;
$gf-form-margin: 3px;
$gf-form-input-height: 35px;
$cursor-disabled: not-allowed !default;
@ -185,13 +185,13 @@ $zindex-typeahead: 1060;
// Buttons
//
$btn-padding-x: .875rem !default;
$btn-padding-y: 0.6125rem !default;
$btn-padding-x: 14px !default;
$btn-padding-y: 10px !default;
$btn-line-height: 1 !default;
$btn-font-weight: ${theme.typography.weight.semibold} !default;
$btn-padding-x-sm: 0.4375rem !default;
$btn-padding-y-sm: 0.25rem !default;
$btn-padding-x-sm: 7px !default;
$btn-padding-y-sm: 4px !default;
$btn-padding-x-lg: 21px !default;
$btn-padding-y-lg: 11px !default;

View File

@ -8,20 +8,20 @@ const theme: GrafanaThemeCommons = {
monospace: "Menlo, Monaco, Consolas, 'Courier New', monospace",
},
size: {
root: '100%',
base: '.8125rem',
xs: '.625rem',
s: '.75rem',
m: '.875rem',
l: '1.125rem',
root: '14px',
base: '13px',
xs: '10px',
s: '12px',
m: '14px',
l: '18px',
},
heading: {
h1: '1.75rem',
h2: '1.5rem',
h3: '1.3125rem',
h4: '1.125rem',
h5: '1rem',
h6: '.875rem',
h1: '28px',
h2: '24px',
h3: '21px',
h4: '18px',
h5: '16px',
h6: '14px',
},
weight: {
light: 300,
@ -35,7 +35,7 @@ const theme: GrafanaThemeCommons = {
l: 1.5,
},
},
brakpoints: {
breakpoints: {
xs: '0',
s: '544px',
m: '768px',
@ -44,9 +44,9 @@ const theme: GrafanaThemeCommons = {
},
spacing: {
xs: '0',
s: '0.2rem',
m: '1rem',
l: '1.5rem',
s: '3px',
m: '14px',
l: '21px',
gutter: '30px',
},
border: {
@ -55,6 +55,9 @@ const theme: GrafanaThemeCommons = {
s: '3px',
m: '5px',
},
width: {
s: '1px',
},
},
};

View File

@ -6,7 +6,7 @@ export enum GrafanaThemeType {
export interface GrafanaThemeCommons {
name: string;
// TODO: not sure if should be a part of theme
brakpoints: {
breakpoints: {
xs: string;
s: string;
m: string;
@ -60,6 +60,9 @@ export interface GrafanaThemeCommons {
s: string;
m: string;
};
width: {
s: string;
};
};
}

View File

@ -20,7 +20,7 @@ $enable-hover-media-query: false !default;
// Control the default styling of most Bootstrap elements by modifying these
// variables. Mostly focused on spacing.
$spacer: 0.875rem !default;
$spacer: 14px !default;
$spacer-x: $spacer !default;
$spacer-y: $spacer !default;
$spacers: (
@ -91,23 +91,23 @@ $font-family-sans-serif: 'Roboto', Helvetica, Arial, sans-serif;
$font-family-monospace: Menlo, Monaco, Consolas, 'Courier New', monospace;
$font-family-base: $font-family-sans-serif !default;
$font-size-root: 100% !default;
$font-size-base: 0.8125rem !default;
$font-size-root: 14px !default;
$font-size-base: 13px !default;
$font-size-lg: 1.125rem !default;
$font-size-md: 0.875rem !default;
$font-size-sm: 0.75rem !default;
$font-size-xs: 0.625rem !default;
$font-size-lg: 18px !default;
$font-size-md: 14px !default;
$font-size-sm: 12px !default;
$font-size-xs: 10px !default;
$line-height-base: 1.5 !default;
$font-weight-semi-bold: 500;
$font-size-h1: 1.75rem !default;
$font-size-h2: 1.5rem !default;
$font-size-h3: 1.3125rem !default;
$font-size-h4: 1.125rem !default;
$font-size-h5: 1rem !default;
$font-size-h6: 0.875rem !default;
$font-size-h1: 28px !default;
$font-size-h2: 24px !default;
$font-size-h3: 21px !default;
$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;
@ -130,8 +130,8 @@ $border-radius-sm: 2px !default;
// Page
$page-sidebar-width: 9.625rem;
$page-sidebar-margin: 3.5rem;
$page-sidebar-width: 154px;
$page-sidebar-margin: 56px;
// Links
// -------------------------
@ -163,7 +163,7 @@ $input-padding-y-lg: 10px !default;
$input-height: 35px !default;
$gf-form-margin: 0.175rem;
$gf-form-margin: 3px;
$gf-form-input-height: 35px;
$cursor-disabled: not-allowed !default;
@ -188,13 +188,13 @@ $zindex-typeahead: 1060;
// Buttons
//
$btn-padding-x: 0.875rem !default;
$btn-padding-y: 0.6125rem !default;
$btn-padding-x: 14px !default;
$btn-padding-y: 10px !default;
$btn-line-height: 1 !default;
$btn-font-weight: 500 !default;
$btn-padding-x-sm: 0.4375rem !default;
$btn-padding-y-sm: 0.25rem !default;
$btn-padding-x-sm: 7px !default;
$btn-padding-y-sm: 4px !default;
$btn-padding-x-lg: 21px !default;
$btn-padding-y-lg: 11px !default;