diff --git a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js
index bcc15603..b95a16ff 100644
--- a/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js
+++ b/js/components/ascribe_piece_list_toolbar/piece_list_toolbar.js
@@ -1,6 +1,7 @@
'use strict';
import React from 'react';
+import classNames from 'classnames';
import PieceListToolbarFilterWidget from './piece_list_toolbar_filter_widget';
import PieceListToolbarOrderWidget from './piece_list_toolbar_order_widget';
@@ -43,30 +44,26 @@ let PieceListToolbar = React.createClass({
const { className, children, searchFor, searchQuery } = this.props;
return (
-
-
-
-
-
- {children}
-
-
-
-
-
-
-
-
+
+
+
+ {children}
+
+
+
+
+
+
);
diff --git a/js/components/piece_list.js b/js/components/piece_list.js
index 114585d7..98e3252d 100644
--- a/js/components/piece_list.js
+++ b/js/components/piece_list.js
@@ -290,7 +290,6 @@ const PieceList = React.createClass({
return (
.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 > span {
background-color: $ascribe--button-default-color;
diff --git a/sass/ascribe_piece_list_toolbar.scss b/sass/ascribe_piece_list_toolbar.scss
index a83447fb..099afe07 100644
--- a/sass/ascribe_piece_list_toolbar.scss
+++ b/sass/ascribe_piece_list_toolbar.scss
@@ -1,8 +1,3 @@
-.ascribe-piece-list-toolbar {
- padding-left: 15px;
- padding-right: 15px;
-}
-
.search-bar {
max-width: 200px;
@@ -29,42 +24,31 @@
}
}
-.ascribe-piece-list-toolbar-widget {
- button {
- background-color: transparent;
- border: 1px solid transparent;
- color: $ascribe--button-default-color;
- padding: 6px 4px 6px 8px;
+.ascribe-piece-list-toolbar-widget.dropdown-toggle.btn {
+ background-color: transparent;
+ border: 1px solid transparent;
+ box-shadow: none;
+ color: $ascribe--button-default-color;
+ padding: 6px 4px 6px 8px;
- &:hover,
- &:active {
- background-color: $ascribe--button-default-color !important;
- border-color: $ascribe--button-default-color !important;
- color: white;
- }
- .caret {
- display: none;
- }
+ .open &,
+ &:hover,
+ &:active {
+ background-color: $ascribe--button-default-color !important;
+ border-color: $ascribe--button-default-color !important;
+ color: white;
}
-
- .ascribe-piece-list-toolbar-widget-item {
- a {
- padding-left: 0;
- padding-right: 0;
- }
+ .caret {
+ display: none;
}
+}
+.ascribe-piece-list-toolbar-widget-item {
.checkbox-line {
height: 25px;
position: relative;
color: #333333;
- /* Fuck you react-bootstrap */
- &:hover {
- background-color: $dropdown-link-hover-bg;
- cursor: pointer;
- }
-
span {
cursor: pointer;
left: 9px;
@@ -81,7 +65,7 @@
}
}
- .dropdown-menu {
+ .dropdown-menu & {
min-width: 170px;
}
}