mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Misc styling fixes to explore: start page, slate code editor colors, text highlight in auto completeter suggestion
This commit is contained in:
@@ -1,59 +1,12 @@
|
||||
import React, { PureComponent } from 'react';
|
||||
import classNames from 'classnames';
|
||||
|
||||
import PromCheatSheet from './PromCheatSheet';
|
||||
|
||||
const TAB_MENU_ITEMS = [
|
||||
{
|
||||
text: 'Start',
|
||||
id: 'start',
|
||||
icon: 'fa fa-rocket',
|
||||
},
|
||||
];
|
||||
|
||||
export default class PromStart extends PureComponent<any, { active: string }> {
|
||||
state = {
|
||||
active: 'start',
|
||||
};
|
||||
|
||||
onClickTab = active => {
|
||||
this.setState({ active });
|
||||
};
|
||||
|
||||
export default class PromStart extends PureComponent<any> {
|
||||
render() {
|
||||
const { active } = this.state;
|
||||
const customCss = '';
|
||||
|
||||
return (
|
||||
<div style={{ margin: '45px 0', border: '1px solid #ddd', borderRadius: 5 }}>
|
||||
<div className="page-header-canvas">
|
||||
<div className="page-container">
|
||||
<div className="page-header">
|
||||
<nav>
|
||||
<ul className={`gf-tabs ${customCss}`}>
|
||||
{TAB_MENU_ITEMS.map((tab, idx) => {
|
||||
const tabClasses = classNames({
|
||||
'gf-tabs-link': true,
|
||||
active: tab.id === active,
|
||||
});
|
||||
|
||||
return (
|
||||
<li className="gf-tabs-item" key={tab.id}>
|
||||
<a className={tabClasses} onClick={() => this.onClickTab(tab.id)}>
|
||||
<i className={tab.icon} />
|
||||
{tab.text}
|
||||
</a>
|
||||
</li>
|
||||
);
|
||||
})}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="page-container page-body">
|
||||
{active === 'start' && <PromCheatSheet onClickExample={this.props.onClickExample} />}
|
||||
</div>
|
||||
<div className="grafana-info-box">
|
||||
<PromCheatSheet onClickExample={this.props.onClickExample} />} etdiv>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user