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

UX: Improve Grafana usage for smaller screens (#16783)

Browse Source 
* Mobile: Switch to mobile view already at md or lower breakpoint

* UX: Tweaked breakpoint so that media-breakpoint-up(md) will only apply to screens larger than normal ipad

* Updated snapshots
This commit is contained in:
Torkel Ödegaard
2019-04-26 19:16:03 +02:00
committed by GitHub
parent e694fd8fb6
commit e38762665b
9 changed files with 37 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/grafana-ui/src/components/RefreshPicker/_RefreshPicker.scss
View File

@@ -30,7 +30,7 @@
}
}
@include media-breakpoint-up(md) {
@include media-breakpoint-up(sm) {
display: block;
}
}

4
packages/grafana-ui/src/components/ThresholdsEditor/__snapshots__/ThresholdsEditor.test.tsx.snap
View File

@@ -109,7 +109,7 @@ exports[`Render should render with base threshold 1`] = `
},
"breakpoints": Object {
"lg": "992px",
"md": "768px",
"md": "769px",
"sm": "544px",
"xl": "1200px",
"xs": "0",
@@ -272,7 +272,7 @@ exports[`Render should render with base threshold 1`] = `
},
"breakpoints": Object {
"lg": "992px",
"md": "768px",
"md": "769px",
"sm": "544px",
"xl": "1200px",
"xs": "0",

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

@@ -42,7 +42,7 @@ const theme: GrafanaThemeCommons = {
breakpoints: {
xs: '0',
sm: '544px',
md: '768px',
md: '769px', // 1 more than regular ipad in portrait
lg: '992px',
xl: '1200px',
},