scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-23 15:47:53 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

remove inactive class on tabs

Browse source
This commit is contained in:
Technoboy10 2016-08-22 11:30:44 -06:00
parent f27e99f1a4
commit 55f95bb2a8
3 changed files with 11 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/components/tabs/tabs.scss
View file

@ -1,6 +1,12 @@
@import "../../colors"; @import "../../colors";
@import "../../frameless"; @import "../../frameless";
.tab-background {
box-shadow: 0 0 1px $box-shadow-gray;
background-color: $ui-white;
width: 100%;
}
.tabs { .tabs {
background-color: $ui-white; background-color: $ui-white;
padding: 0; padding: 0;
@ -20,6 +26,7 @@
border-bottom: 3px solid $ui-aqua; border-bottom: 3px solid $ui-aqua;
&:hover { &:hover {
border-bottom: 3px solid $ui-aqua;
color: $header-gray; color: $header-gray;
} }
} }
@ -29,11 +36,9 @@
padding: .75em 1.5em; padding: .75em 1.5em;
} }
&.inactive {
&:hover { &:hover {
border-bottom: 3px solid $active-dark-gray; border-bottom: 3px solid $active-dark-gray;
} }
}
.tab-icon { .tab-icon {
display: block; display: block;

3
src/views/explore/explore.jsx
View file

@ -115,8 +115,7 @@ var Explore = injectIntl(React.createClass({
}, },
getTab: function (type) { getTab: function (type) {
var classes = classNames({ var classes = classNames({
active: (this.props.itemType === type), active: (this.props.itemType === type)
inactive: (this.props.itemType !== type)
}); });
return ( return (
<a href={'/explore/' + type + '/' + this.props.category + '/' + this.props.mode}> <a href={'/explore/' + type + '/' + this.props.category + '/' + this.props.mode}>

2
src/views/search/search.jsx
View file

@ -80,7 +80,7 @@ var Search = injectIntl(React.createClass({
getTab: function (type) { getTab: function (type) {
var term = this.props.searchTerm.split(' ').join('+'); var term = this.props.searchTerm.split(' ').join('+');
var allTab = <a href={'/search/' + type + '?q=' + term + '/'}> var allTab = <a href={'/search/' + type + '?q=' + term + '/'}>
<li className='inactive'> <li>
<img src={'/svgs/tabs/' + type + '-inactive.svg'} className={'tab-icon ' + type} /> <img src={'/svgs/tabs/' + type + '-inactive.svg'} className={'tab-icon ' + type} />
<FormattedMessage id={'general.' + type} /> <FormattedMessage id={'general.' + type} />
</li> </li>