ensl/ensl_gathers
0
0
Fork 0
mirror of https://github.com/ENSL/ensl_gathers.git synced 2024-11-23 04:52:00 +00:00
Code Issues Projects Releases Packages Wiki Activity

Colorise team picks

Browse source
This commit is contained in:
Chris Blanchard 2015-09-27 14:18:32 +01:00
parent c6f2313900
commit 0b7b4af467
2 changed files with 47 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
lib/react/gather.jsx
View file

@ -734,11 +734,11 @@ var Gatherers = React.createClass({
);
} else {
if (gatherer.leader) {
action = (<span className="label label-primary team-label">Leader</span>);
action = (<span className={`label label-padding label-${gatherer.team} team-label`}>Leader</span>);
} else if (gatherer.team !== "lobby") {
action = (<span className="label label-primary team-label">{_.capitalize(gatherer.team)}</span>);
action = (<span className={`label label-padding label-${gatherer.team} team-label`}>{_.capitalize(gatherer.team)}</span>);
} else {
action = (<span className="label label-default team-label">Lobby</span>);
action = (<span className="label label-padding label-default team-label">Lobby</span>);
}
}
}
@ -761,8 +761,9 @@ var Gatherers = React.createClass({
]
}
let tabColor = gatherer.team !== "lobby" ? `panel-${gatherer.team}` : "panel-info";
return (
<div className="panel panel-info gatherer-panel" key={gatherer.user.id} data-userid={gatherer.user.id}>
<div className={`panel ${tabColor} gatherer-panel`} key={gatherer.user.id} data-userid={gatherer.user.id}>
<div className="panel-heading">
<h4 className="panel-title">
{country} {gatherer.user.username}

42
public/css/app.css
View file

@ -66,6 +66,10 @@ html, body {
display: inline-block;
}
.label-padding {
padding: 5px 0;
}
.lifeform-icon {
width: 20px;
margin: 0 3px;
@ -100,6 +104,44 @@ html, body {
box-shadow: none;
}
.panel-alien {
border-color: #186845;
}
.panel-alien>.panel-heading {
color: #B7DCCC;
background-color: #569F80;
border-color: #186845;
}
.panel-alien>.panel-heading+.panel-collapse .panel-body {
border-top-color: #186845;
}
.panel-alien>.panel-footer+.panel-collapse .panel-body {
border-bottom-color: #186845;
}
.label-alien {
color: #B7DCCC;
background-color: #186845;
}
.panel-marine {
border-color: #1B4362;
}
.panel-marine>.panel-heading {
color: #B6C9D7;
background-color: #557995;
border-color: #1B4362;
}
.panel-marine>.panel-heading+.panel-collapse .panel-body {
border-top-color: #1B4362;
}
.panel-marine>.panel-footer+.panel-collapse .panel-body {
border-bottom-color: #1B4362;
}
.label-marine {
color: #B7C6D8;
background-color: #1B4362;
}
/*Utility Styles*/
.add-left {