Highlights currently selected tags.

This commit is contained in:
Sean Li 2015-02-25 10:53:16 -08:00
parent 2107afb82a
commit c820b5b629
2 changed files with 11 additions and 3 deletions

View File

@ -91,9 +91,13 @@ var ImageCard = React.createClass({
imgsrc = 'http://kitematic.com/recommended/kitematic_html.png';
}
var tags;
if (this.state.tags.length > 0) {
var tagDisplay = this.state.tags.map(function (t) {
return <div className="tag" key={t.name} onClick={self.handleTagClick.bind(self, t.name)}>{t.name}</div>;
if (self.state.tags.length > 0) {
var tagDisplay = self.state.tags.map(function (t) {
if (t.name === self.state.chosenTag) {
return <div className="tag active" key={t.name} onClick={self.handleTagClick.bind(self, t.name)}>{t.name}</div>;
} else {
return <div className="tag" key={t.name} onClick={self.handleTagClick.bind(self, t.name)}>{t.name}</div>;
}
});
tags = (
<div className="tag-list">

View File

@ -124,6 +124,10 @@
flex: 0 auto;
margin-right: 2px;
padding: 3px 5px;
&.active {
background-color: rgba(255,255,255,0.2);
border-radius: 20px;
}
&:hover {
background-color: rgba(255,255,255,0.2);
border-radius: 20px;