pt/superset
1
0
Fork 0
mirror of https://github.com/apache/superset.git synced 2024-09-12 08:39:45 -04:00
Code Issues Packages Projects Releases Wiki Activity

[explore v2] add scrollbar to control panel container (#1284)

Browse Source 
* add scroll bars to control panel container

* make query and save-btns block elements

* don't use react component, use custom styles

* move style to stylesheet
This commit is contained in:
Alanna Scott 2016-10-07 11:57:05 -07:00 committed by GitHub
parent 0a3121c243
commit 382b8e85da
5 changed files with 31 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
caravel/assets/javascripts/explorev2/components/ControlPanelsContainer.jsx
View File

@ -14,8 +14,12 @@ const defaultProps = {
function ControlPanelsContainer(props) { function ControlPanelsContainer(props) {
return ( return (
<Panel> <Panel>
{DefaultControls} <div className="scrollbar-container">
{VIZ_CONTROL_MAPPING[props.vizType]} <div className="scrollbar-content">
{DefaultControls}
{VIZ_CONTROL_MAPPING[props.vizType]}
</div>
</div>
</Panel> </Panel>
); );
} }

8
caravel/assets/javascripts/explorev2/components/ExploreViewContainer.jsx
View File

@ -31,16 +31,16 @@ export default class ExploreViewContainer extends React.Component {
overflow: 'hidden', overflow: 'hidden',
}} }}
> >
<div className="row table-body"> <div className="row">
<div className="table-cell col-sm-4"> <div className="col-sm-4">
<QueryAndSaveButtons <QueryAndSaveButtons
canAdd="True" canAdd="True"
onQuery={() => {}} onQuery={() => {}}
/> />
<br /><br /> <br />
<ControlPanelsContainer /> <ControlPanelsContainer />
</div> </div>
<div className="table-cell col-sm-8"> <div className="col-sm-8">
<ChartContainer <ChartContainer
viz={this.props.data.viz} viz={this.props.data.viz}
height={this.state.height} height={this.state.height}

13
caravel/assets/javascripts/explorev2/components/QueryAndSaveButtons.jsx
View File

@ -7,23 +7,22 @@ const propTypes = {
}; };
export default function QueryAndSaveBtns({ canAdd, onQuery }) { export default function QueryAndSaveBtns({ canAdd, onQuery }) {
const saveClasses = classnames('btn btn-default btn-sm', { const saveClasses = classnames('btn btn-default btn-block btn-sm', {
'disabled disabledButton': canAdd !== 'True', 'disabled disabledButton': canAdd !== 'True',
}); });
return ( return (
<div className="btn-group query-and-save"> <div className="btn-group btn-group-justified query-and-save">
<button type="button" className="btn btn-primary btn-sm" onClick={onQuery}> <a className="btn btn-primary btn-block btn-sm" onClick={onQuery}>
<i className="fa fa-bolt"></i> Query <i className="fa fa-bolt"></i> Query
</button> </a>
<button <a
type="button"
className={saveClasses} className={saveClasses}
data-target="#save_modal" data-target="#save_modal"
data-toggle="modal" data-toggle="modal"
> >
<i className="fa fa-plus-circle"></i> Save as <i className="fa fa-plus-circle"></i> Save as
</button> </a>
</div> </div>
); );
} }

19
caravel/assets/stylesheets/exploreV2/exploreV2.css
View File

@ -1,8 +1,17 @@
.table-body { .scrollbar-container {
display: table; position: relative;
overflow: hidden;
width: 100%;
height: 100%;
} }
.table-cell { .scrollbar-content {
float: none; position: absolute;
display: table-cell; top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
overflow: scroll;
margin-right: 0px;
margin-bottom: 100px;
} }

2
caravel/templates/caravel/explorev2.html
View File

@ -1,7 +1,7 @@
{% extends "caravel/basic.html" %} {% extends "caravel/basic.html" %}
<link rel="stylesheet" type="text/css" href="/static/assets/stylesheets/exploreV2/exploreV2.css" />
{% block body %} {% block body %}
<link rel="stylesheet" type="text/css" href="/static/assets/stylesheets/explorev2/explorev2.css">
<div <div
id="js-explore-view-container" id="js-explore-view-container"
data-bootstrap="{{ bootstrap_data }}" data-bootstrap="{{ bootstrap_data }}"