ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2025-01-03 10:25:08 +01:00
Code Issues Releases Wiki Activity

Fix PieceListToolbar styling

Browse Source
This commit is contained in:
Brett Sun 2016-06-08 18:06:16 +02:00
parent 4fd0e0d99c
commit 1cc047d060
4 changed files with 38 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,6 +1,7 @@
'use strict'; 'use strict';
import React from 'react'; import React from 'react';
import classNames from 'classnames';
import PieceListToolbarFilterWidget from './piece_list_toolbar_filter_widget'; import PieceListToolbarFilterWidget from './piece_list_toolbar_filter_widget';
import PieceListToolbarOrderWidget from './piece_list_toolbar_order_widget'; import PieceListToolbarOrderWidget from './piece_list_toolbar_order_widget';
@ -43,10 +44,8 @@ let PieceListToolbar = React.createClass({
const { className, children, searchFor, searchQuery } = this.props; const { className, children, searchFor, searchQuery } = this.props;
return ( return (
<div className={className}> <div className={classNames('row', className)}>
<div className="row"> <div className="col-xs-12 col-sm-10 col-md-8 col-lg-8 col-sm-offset-1 col-md-offset-2 col-lg-offset-2 ascribe-piece-list-toolbar">
<div className="col-xs-12 col-sm-10 col-md-8 col-lg-8 col-sm-offset-1 col-md-offset-2 col-lg-offset-2">
<div className="row">
<span className="pull-left"> <span className="pull-left">
{children} {children}
</span> </span>
@ -67,8 +66,6 @@ let PieceListToolbar = React.createClass({
threshold={AppConstants.searchThreshold}/> threshold={AppConstants.searchThreshold}/>
</div> </div>
</div> </div>
</div>
</div>
); );
} }
}); });

1
js/components/piece_list.js
View File

@ -290,7 +290,6 @@ const PieceList = React.createClass({
return ( return (
<div> <div>
<PieceListToolbar <PieceListToolbar
className="ascribe-piece-list-toolbar"
searchFor={this.searchFor} searchFor={this.searchFor}
searchQuery={this.state.search} searchQuery={this.state.search}
filterParams={filterParams} filterParams={filterParams}

8
sass/ascribe_custom_style.scss
View File

@ -241,14 +241,6 @@ fieldset[disabled] .btn-secondary.active {
} }
} }
.open > .btn-default.dropdown-toggle:hover,
.open > .btn-default.dropdown-toggle:focus,
.open > .btn-default.dropdown-toggle.focus,
.open > .btn-default.dropdown-toggle.dropdown-toggle {
background-color: darken($ascribe--button-secondary-fg-color, 20%);
border-color: darken($ascribe--button-secondary-fg-color, 20%);
}
.pager li > a, .pager li > a,
.pager li > span { .pager li > span {
background-color: $ascribe--button-default-color; background-color: $ascribe--button-default-color;

24
sass/ascribe_piece_list_toolbar.scss
View File

@ -1,8 +1,3 @@
.ascribe-piece-list-toolbar {
padding-left: 15px;
padding-right: 15px;
}
.search-bar { .search-bar {
max-width: 200px; max-width: 200px;
@ -29,13 +24,14 @@
} }
} }
.ascribe-piece-list-toolbar-widget { .ascribe-piece-list-toolbar-widget.dropdown-toggle.btn {
button {
background-color: transparent; background-color: transparent;
border: 1px solid transparent; border: 1px solid transparent;
box-shadow: none;
color: $ascribe--button-default-color; color: $ascribe--button-default-color;
padding: 6px 4px 6px 8px; padding: 6px 4px 6px 8px;
.open &,
&:hover, &:hover,
&:active { &:active {
background-color: $ascribe--button-default-color !important; background-color: $ascribe--button-default-color !important;
@ -48,23 +44,11 @@
} }
.ascribe-piece-list-toolbar-widget-item { .ascribe-piece-list-toolbar-widget-item {
a {
padding-left: 0;
padding-right: 0;
}
}
.checkbox-line { .checkbox-line {
height: 25px; height: 25px;
position: relative; position: relative;
color: #333333; color: #333333;
/* Fuck you react-bootstrap */
&:hover {
background-color: $dropdown-link-hover-bg;
cursor: pointer;
}
span { span {
cursor: pointer; cursor: pointer;
left: 9px; left: 9px;
@ -81,7 +65,7 @@
} }
} }
.dropdown-menu { .dropdown-menu & {
min-width: 170px; min-width: 170px;
} }
} }