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

6
public/app/features/explore/ExploreToolbar.tsx
View File

@@ -38,9 +38,9 @@ const createResponsiveButton = (options: {
return (
<button className={`btn navbar-button ${buttonClassName ? buttonClassName : ''}`} onClick={onClick}>
{iconClassName && iconSide === IconSide.left ? <i className={`${iconClassName} icon-margin-right`} /> : null}
{iconClassName && iconSide === IconSide.left ? <i className={`${iconClassName}`} /> : null}
<span className="btn-title">{!splitted ? title : ''}</span>
{iconClassName && iconSide === IconSide.right ? <i className={`${iconClassName} icon-margin-left`} /> : null}
{iconClassName && iconSide === IconSide.right ? <i className={`${iconClassName}`} /> : null}
</button>
);
};
@@ -172,7 +172,7 @@ export class UnConnectedExploreToolbar extends PureComponent<Props, {}> {
</div>
<div className="explore-toolbar-content-item">
<button className="btn navbar-button navbar-button--no-icon" onClick={this.onClearAll}>
<button className="btn navbar-button" onClick={this.onClearAll}>
Clear All
</button>
</div>