Rejigged views and sizings for mobile

This commit is contained in:
Chris Blanchard 2016-02-18 14:59:42 +00:00
parent 5ac33a9293
commit 9fe59932a5
4 changed files with 26 additions and 12 deletions

View file

@ -465,7 +465,7 @@ const ServerVoting = React.createClass({
}).map(server => { }).map(server => {
let votes = self.votesForServer(server); let votes = self.votesForServer(server);
let style = thisGatherer.serverVote.some(voteId => voteId === server.id) ? let style = thisGatherer.serverVote.some(voteId => voteId === server.id) ?
"list-group-item list-group-item-success" : "list-group-item"; "list-group-item list-group-item-default" : "list-group-item";
return ( return (
<a href="#" <a href="#"
className={style} className={style}
@ -702,6 +702,14 @@ const GathererListItem = React.createClass({
this.setState({ collapse: !this.state.collapse }); this.setState({ collapse: !this.state.collapse });
}, },
caret() {
if (this.state.collapse) {
return <i className="fa fa-caret-down"></i>;
} else {
return <i className="fa fa-caret-up"></i>;
}
},
collapseState() { collapseState() {
return `panel-collapse out collapse ${this.state.collapse ? "" : "in"}`; return `panel-collapse out collapse ${this.state.collapse ? "" : "in"}`;
}, },
@ -807,7 +815,7 @@ const GathererListItem = React.createClass({
<span className="pull-right"> <span className="pull-right">
<a href="#" className="btn btn-xs btn-primary add-right" <a href="#" className="btn btn-xs btn-primary add-right"
onClick={this.toggleCollapse}> onClick={this.toggleCollapse}>
Info <span className="caret"></span></a> Info {this.caret()}</a>
<LifeformIcons gatherer={gatherer} /> <LifeformIcons gatherer={gatherer} />
{action} {action}
</span> </span>
@ -816,7 +824,7 @@ const GathererListItem = React.createClass({
<div id={gatherer.user.id.toString() + "-collapse"} <div id={gatherer.user.id.toString() + "-collapse"}
className={this.collapseState()} > className={this.collapseState()} >
<div className="panel-body"> <div className="panel-body">
<dl className="dl-horizontal"> <dl>
<dt>Skill Level</dt> <dt>Skill Level</dt>
<dd>{skill}</dd> <dd>{skill}</dd>
<dt>Team</dt> <dt>Team</dt>
@ -873,10 +881,7 @@ const Gatherers = React.createClass({
if (gather.gatherers.length) { if (gather.gatherers.length) {
return ( return (
<div class="panel-group" <div id="gatherers-panel">
role="tablist"
aria-multiselectable="true"
id="gatherers-panel">
{gatherers} {gatherers}
</div> </div>
); );
@ -978,7 +983,7 @@ const GatherVotingResults = React.createClass({
Server Server
</div> </div>
<div className="panel-body"> <div className="panel-body">
<dl className="dl-horizontal"> <dl>
<dt>Maps</dt> <dt>Maps</dt>
<dd>{maps.map(map => map.name).join(" & ")}</dd> <dd>{maps.map(map => map.name).join(" & ")}</dd>
<dt>Server</dt> <dt>Server</dt>

View file

@ -453,7 +453,7 @@ const App = React.createClass({
</section> </section>
<section className="content"> <section className="content">
<div className="row"> <div className="row">
<div className="col-md-8"> <div className="col-lg-8">
<Gather <Gather
socket={socket} socket={socket}
maps={this.state.maps} maps={this.state.maps}
@ -464,8 +464,13 @@ const App = React.createClass({
previousGather={this.state.previousGather} previousGather={this.state.previousGather}
soundController={this.state.soundController} /> soundController={this.state.soundController} />
</div> </div>
<div className="col-md-4"> <div className="col-lg-4 col-md-12 col-sm-12">
{eventsPanel} {eventsPanel}
</div>
</div>
<hr />
<div className="row">
<div className="col-lg-8 col-md-12 col-sm-12">
<ArchivedGathers archive={this.state.archive} <ArchivedGathers archive={this.state.archive}
maps={this.state.maps} maps={this.state.maps}
servers={this.state.servers} /> servers={this.state.servers} />

View file

@ -276,3 +276,4 @@ html, body {
.news-menu .unread { .news-menu .unread {
font-weight: bold; font-weight: bold;
} }

View file

@ -98,9 +98,12 @@ module.exports = function (namespace) {
let removeGatherer = user => { let removeGatherer = user => {
let gather = Gather.current; let gather = Gather.current;
if (gather.can("removeGatherer")) gather.removeGatherer(user); let gatherLeaver = gather.getGatherer(user);
if (gather.can("removeGatherer")) {
gather.removeGatherer(user);
}
if (user.cooldown) gather.applyCooldown(user); if (user.cooldown) gather.applyCooldown(user);
Event.leaver(socket._user); Event.leaver(gatherLeaver.user);
refreshGather(); refreshGather();
} }