Ratstail91/kingdombattles
Archived
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Improved ladder appearance on mobile

Browse Source
This commit is contained in:
Kayne Ruse
2019-06-05 22:10:15 +10:00
parent bd3b30fffd
commit 73fe349936
5 changed files with 10 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/ladder.jsx
+3 -1
View File
@@ -37,7 +37,9 @@ class Ladder extends React.Component {
<div className='mainPanel'>
<h1 className='centered'>Game Ladder</h1>
<ButtonHeader />
<br />
<div className='half break mobile hide' />
<PagedLadder
start={this.state.start}
length={this.state.length}
src/components/panels/paged_ladder.jsx
+4 -4
View File
@@ -17,7 +17,7 @@ class PagedLadder extends React.Component {
render() {
return (
<div className='table'>
<div className='row'>
<div className='row mobile hide'>
<p className='col centered'>Username</p>
<p className='col centered'>Soldiers</p>
<p className='col centered'>Recruits</p>
@@ -28,9 +28,9 @@ class PagedLadder extends React.Component {
<div className='break' />
<div className={'row'}>
<p className={'col centered truncate'}><Link to={`/profile?username=${this.state[key].username}`}>{this.state[key].username}</Link></p>
<p className={'col centered truncate'}>{this.state[key].soldiers}</p>
<p className={'col centered truncate'}>{this.state[key].recruits}</p>
<p className={'col centered truncate'}>{this.state[key].gold}</p>
<p className={'col centered truncate'}><span className='mobile show' style={{whiteSpace: 'pre'}}>Soldiers: </span>{this.state[key].soldiers}</p>
<p className={'col centered truncate'}><span className='mobile show' style={{whiteSpace: 'pre'}}>Recruits: </span>{this.state[key].recruits}</p>
<p className={'col centered truncate'}><span className='mobile show' style={{whiteSpace: 'pre'}}>Gold: </span>{this.state[key].gold}</p>
</div>
</div>)}
</div>