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

add unfinished filtering widget

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -9,7 +9,7 @@
<link rel="stylesheet" href="//brick.a.ssl.fastly.net/Source+Sans+Pro:400,600,700,900">
</head>
<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>
<script src="build/app.js"></script>
</body>

15
js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js
View File

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

31
js/components/ascribe_piece_list_toolbar/piece_list_toolbar_filter_widget.js Normal file
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;

4
sass/ascribe_piece_list_toolbar.scss
View File

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

2
sass/main.scss
View File

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