1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 09:23:13 +01:00

add unfinished filtering widget

This commit is contained in:
Tim Daubenschütz 2015-06-02 11:40:55 +02:00
parent eb5d6f6cc3
commit 713dd72b2b
5 changed files with 41 additions and 13 deletions

View File

@ -9,7 +9,7 @@
<link rel="stylesheet" href="//brick.a.ssl.fastly.net/Source+Sans+Pro:400,600,700,900"> <link rel="stylesheet" href="//brick.a.ssl.fastly.net/Source+Sans+Pro:400,600,700,900">
</head> </head>
<body> <body>
<div id="main" class="container clear-margins-and-paddings"></div> <div id="main" class="container clear-paddings"></div>
<div id="modal" class="container"></div> <div id="modal" class="container"></div>
<script src="build/app.js"></script> <script src="build/app.js"></script>
</body> </body>

View File

@ -5,7 +5,8 @@ import PieceListActions from '../../actions/piece_list_actions';
import Input from 'react-bootstrap/lib/Input'; import Input from 'react-bootstrap/lib/Input';
import Glyphicon from 'react-bootstrap/lib/Glyphicon'; import Glyphicon from 'react-bootstrap/lib/Glyphicon';
import Button from 'react-bootstrap/lib/Button';
import PieceListToolbarFilterWidgetFilter from './piece_list_toolbar_filter_widget';
let PieceListToolbar = React.createClass({ let PieceListToolbar = React.createClass({
@ -38,12 +39,12 @@ let PieceListToolbar = React.createClass({
<div className="row"> <div className="row">
<div className="col-xs-12 col-sm-12 col-md-12 col-lg-12"> <div className="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<div className="row"> <div className="row">
<div className="ascribe-piece-list-toolbar-search form-inline col-md-3 col-md-offset-right-2 pull-right"> <div className="col-xs-12 col-md-12 col-md-5 col-lg-4 col-sm-offset-1 col-md-offset-2 col-lg-offset-2 clear-paddings">
<Input type='text' ref="search" placeholder="Search..." onChange={this.searchFor} addonAfter={searchIcon} /> <div className="form-inline">
&nbsp;&nbsp; <Input type='text' ref="search" placeholder="Search..." onChange={this.searchFor} addonAfter={searchIcon} />
<Button> &nbsp;&nbsp;
<Glyphicon glyph='filter' /> <PieceListToolbarFilterWidgetFilter />
</Button> </div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -0,0 +1,31 @@
import React from 'react';
import Glyphicon from 'react-bootstrap/lib/Glyphicon';
import DropdownButton from 'react-bootstrap/lib/DropdownButton';
import MenuItem from 'react-bootstrap/lib/MenuItem';
let PieceListToolbarFilterWidgetFilter = React.createClass({
render() {
let filterIcon = <Glyphicon glyph='filter' />;
return (
<DropdownButton title={filterIcon}>
<li style={{'textAlign': 'center'}}>
<em>Show Pieces that:</em>
</li>
<MenuItem eventKey='1'>
<div className="checkbox">
I can transfer <input type="checkbox" />
</div>
</MenuItem>
<MenuItem eventKey='2'>
<div className="checkbox">
I can consign <input type="checkbox" />
</div>
</MenuItem>
</DropdownButton>
);
}
});
export default PieceListToolbarFilterWidgetFilter;

View File

@ -1,7 +1,3 @@
.ascribe-piece-list-toolbar { .ascribe-piece-list-toolbar {
margin-bottom: 1.5em; margin-bottom: 1.5em;
}
.ascribe-piece-list-toolbar-search {
padding-right:0;
} }

View File

@ -20,7 +20,7 @@
margin-bottom: 1.5em; margin-bottom: 1.5em;
} }
.clear-margins-and-paddings { .clear-paddings {
padding-left:0; padding-left:0;
padding-right:0; padding-right:0;
} }