diff --git a/browser/main/Components/PlanetNavigator.jsx b/browser/main/Components/PlanetNavigator.jsx
index 278959f2..f699767f 100644
--- a/browser/main/Components/PlanetNavigator.jsx
+++ b/browser/main/Components/PlanetNavigator.jsx
@@ -13,9 +13,8 @@ var PlanetNavigator = React.createClass({
search: React.PropTypes.string,
openLaunchModal: React.PropTypes.func,
openAddUserModal: React.PropTypes.func,
- showAll: React.PropTypes.func,
- showOnlySnippets: React.PropTypes.func,
- showOnlyBlueprints: React.PropTypes.func
+ toggleSnippetFilter: React.PropTypes.func,
+ toggleBlueprintFilter: React.PropTypes.func
},
getInitialState: function () {
return {
@@ -53,13 +52,10 @@ var PlanetNavigator = React.createClass({
Launch
diff --git a/browser/main/Containers/PlanetContainer.jsx b/browser/main/Containers/PlanetContainer.jsx
index 504b1d9a..f3998134 100644
--- a/browser/main/Containers/PlanetContainer.jsx
+++ b/browser/main/Containers/PlanetContainer.jsx
@@ -339,11 +339,57 @@ module.exports = React.createClass({
showAll: function () {
this.setState({search: ''})
},
- showOnlySnippets: function () {
- this.setState({search: '$s'})
+ toggleSnippetFilter: function () {
+ var keywords = typeof this.state.search === 'string' ? this.state.search.split(' ') : []
+
+ var usingSnippetFilter = false
+ var usingBlueprintFilter = false
+ keywords = keywords.filter(function (keyword) {
+ if (keyword === '$b') {
+ usingBlueprintFilter = true
+ return false
+ }
+ if (keyword === '$s') usingSnippetFilter = true
+ return true
+ })
+
+ if (usingSnippetFilter && !usingBlueprintFilter) {
+ keywords = keywords.filter(function (keyword) {
+ return keyword !== '$s'
+ })
+ }
+
+ if (!usingSnippetFilter) {
+ keywords.unshift('$s')
+ }
+
+ this.setState({search: keywords.join(' ')})
},
- showOnlyBlueprints: function () {
- this.setState({search: '$b'})
+ toggleBlueprintFilter: function () {
+ var keywords = typeof this.state.search === 'string' ? this.state.search.split(' ') : []
+
+ var usingSnippetFilter = false
+ var usingBlueprintFilter = false
+ keywords = keywords.filter(function (keyword) {
+ if (keyword === '$s') {
+ usingSnippetFilter = true
+ return false
+ }
+ if (keyword === '$b') usingBlueprintFilter = true
+ return true
+ })
+
+ if (usingBlueprintFilter && !usingSnippetFilter) {
+ keywords = keywords.filter(function (keyword) {
+ return keyword !== '$b'
+ })
+ }
+
+ if (!usingBlueprintFilter) {
+ keywords.unshift('$b')
+ }
+
+ this.setState({search: keywords.join(' ')})
},
showOnlyWithTag: function (tag) {
return function () {
@@ -560,7 +606,7 @@ module.exports = React.createClass({
+ toggleSnippetFilter={this.toggleSnippetFilter} toggleBlueprintFilter={this.toggleBlueprintFilter} currentPlanet={this.state.currentPlanet}/>
diff --git a/browser/styles/main/containers/PlanetContainer.styl b/browser/styles/main/containers/PlanetContainer.styl
index 1331e2ce..bbbd8a9b 100644
--- a/browser/styles/main/containers/PlanetContainer.styl
+++ b/browser/styles/main/containers/PlanetContainer.styl
@@ -111,10 +111,8 @@
color textColor
cursor pointer
transition 0.1s
- &:hover, &.hover
- background-color hoverBackgroundColor
- &:active, &.active
- color brandColor
+ btnDefault()
+ border none
.usersLabel
margin-top 35px
margin-bottom 5px
diff --git a/browser/styles/vars.styl b/browser/styles/vars.styl
index 06de6ecb..4edf574d 100644
--- a/browser/styles/vars.styl
+++ b/browser/styles/vars.styl
@@ -7,7 +7,8 @@ buttonBorderColor = #4C4C4C
lightButtonColor = #898989
-hoverBackgroundColor= transparentify(#444, 3%)
+hoverBackgroundColor= transparentify(#444, 10%)
+activeBackgroundColor= transparentify(#888, 10%)
// v0.2.0
inactiveTextColor = #888