ux: minor fixes

pull/9559/head
Torkel Ödegaard 8 years ago
parent 0c31d23086
commit 825cac38b4
  1. 2
      public/app/features/dashboard/dashgrid/DashboardPanel.tsx
  2. 42
      public/app/features/dashboard/dashgrid/DashboardRow.tsx
  3. 2
      public/app/features/dashboard/dashnav/dashnav.ts
  4. 34
      public/sass/components/_navbar.scss

@ -31,6 +31,8 @@ export class DashboardPanel extends React.Component<DashboardPanelProps, any> {
}
}
render() {
return (
<div ref={element => this.element = element} />

@ -0,0 +1,42 @@
import React from 'react';
import {PanelModel} from '../panel_model';
export interface DashboardRowProps {
panel: PanelModel;
}
export class DashboardPanel extends React.Component<DashboardRowProps, any> {
constructor(props) {
super(props);
this.toggle = this.toggle.bind(this);
this.openSettings = this.openSettings.bind(this);
}
toggle() {}
openSettings() {}
render() {
return (
<div>
<div className="dashboard-row__center">
<div className="dashboard-row__actions-left">
<i className="fa fa-chevron-down" />
<i className="fa fa-chevron-right" />
</div>
<a className="dashboard-row__title pointer" onClick={this.toggle}>
<span className="dashboard-row__title-text">{this.props.panel.title}</span>
</a>
<div className="dashboard-row__actions-right">
<a className="pointer" onClick={this.openSettings}>
<i className="fa fa-cog" />
</a>
</div>
</div>
<div className="dashboard-row__panel_count">(0 hidden panels)</div>
<div className="dashboard-row__drag grid-drag-handle" />
</div>
);
}
}

@ -148,7 +148,7 @@ export class DashNavCtrl {
addPanel() {
this.dashboard.addPanel({
type: 'graph',
gridPos: {x: 0, y: 0, w: 12, h: 7},
gridPos: {x: 0, y: 0, w: 12, h: 9},
title: 'New Graph',
});
}

@ -62,40 +62,6 @@
background-color: $navbarLinkBackgroundActive;
}
.navbar-page-btn {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
display: block;
margin: 0;
color: darken($link-color, 5%);
font-size: $font-size-lg;
padding: 1rem 1rem 0.75rem 1rem;
min-height:: $navbarHeight;
.fa-caret-down {
font-size: 60%;
padding-left: 0.2rem;
}
.icon-gf {
position: relative;
top: 2px;
font-size: 20px;
line-height: 8px;
margin-right: 0.5rem;
}
> img {
max-width: 27px;
max-height: 27px;
}
&--search {
padding: 1rem 1.5rem 0.75rem 1.5rem;
}
}
.navbar-page-btn {
text-overflow: ellipsis;
overflow: hidden;

Loading…
Cancel
Save