Standardize render structure across main app and white label apps

Also fixes some whitelabel landing pages broken from the
standardization and removes unnecessary class names
This commit is contained in:
Brett Sun 2016-01-19 15:04:46 +01:00
parent 7e1cfbb490
commit efbc605fc8
8 changed files with 60 additions and 44 deletions

View File

@ -22,10 +22,10 @@ let AscribeApp = React.createClass({
const { children, routes } = this.props;
return (
<div className="container ascribe-default-app">
<div className="ascribe-default-app">
<Header routes={routes} />
{/* Routes are injected here */}
<div className="ascribe-body">
<div className="container ascribe-body">
{/* Routes are injected here */}
{children}
</div>
</div>

View File

@ -75,11 +75,12 @@ let PRApp = React.createClass({
}
return (
<div>
<div
style={style}
className={'ascribe-prize-app'}>
{header}
<div
style={style}
className={'container ascribe-prize-app client--' + subdomain}>
<div className="container ascribe-body">
{/* Routes are injected here */}
{children}
</div>
</div>

View File

@ -38,10 +38,12 @@ let PrizeApp = React.createClass({
}
return (
<div className={'container ascribe-prize-app client--' + subdomain}>
<div className="ascribe-prize-app">
{header}
{this.props.children}
<div className="container ascribe-body">
{/* Routes are injected here */}
{children}
</div>
</div>
);
}

View File

@ -36,7 +36,7 @@ let Vivi23Landing = React.createClass({
render() {
return (
<div className="container ascribe-form-wrapper vivi23-landing">
<div className="ascribe-form-wrapper vivi23-landing">
<div className="row">
<div className="col-xs-12">
<div className="row vivi23-landing--header">

View File

@ -57,38 +57,40 @@ let CylandLanding = React.createClass({
setDocumentTitle('CYLAND MediaArtLab');
return (
<div className="container ascribe-form-wrapper cyland-landing">
<div className="row">
<div className="col-xs-12">
<div className="row" style={{border: '1px solid #CCC', padding: '2em'}}>
<img src={this.state.whitelabel.logo} width="400px"/>
<div style={{marginTop: '1em'}}>
{getLangText('Submissions to Cyland Archive are powered by') + ' '}
<span>
<span className="icon-ascribe-logo"></span>
</span>
<div className="container">
<div className="ascribe-form-wrapper cyland-landing">
<div className="row">
<div className="col-xs-12">
<div className="row" style={{border: '1px solid #CCC', padding: '2em'}}>
<img src={this.state.whitelabel.logo} width="400px"/>
<div style={{marginTop: '1em'}}>
{getLangText('Submissions to Cyland Archive are powered by') + ' '}
<span>
<span className="icon-ascribe-logo"></span>
</span>
</div>
</div>
</div>
<div className="row" style={{border: '1px solid #CCC', borderTop: 'none', padding: '2em'}}>
<div className="col-xs-6">
<p>
{getLangText('Existing ascribe user?')}
</p>
<LinkContainer to="/login">
<Button>
{getLangText('Log in')}
</Button>
</LinkContainer>
</div>
<div className="col-xs-6">
<p>
{getLangText('Do you need an account?')}
</p>
<LinkContainer to="/signup">
<Button>
{getLangText('Sign up')}
</Button>
</LinkContainer>
<div className="row" style={{border: '1px solid #CCC', borderTop: 'none', padding: '2em'}}>
<div className="col-xs-6">
<p>
{getLangText('Existing ascribe user?')}
</p>
<LinkContainer to="/login">
<Button>
{getLangText('Log in')}
</Button>
</LinkContainer>
</div>
<div className="col-xs-6">
<p>
{getLangText('Do you need an account?')}
</p>
<LinkContainer to="/signup">
<Button>
{getLangText('Sign up')}
</Button>
</LinkContainer>
</div>
</div>
</div>
</div>

View File

@ -40,9 +40,10 @@ let WalletApp = React.createClass({
// In react-router 1.0, Routes have no 'name' property anymore. To keep functionality however,
// we split the path by the first occurring slash and take the first splitter.
return (
<div className={classNames('ascribe-wallet-app', 'route--' + (path ? path.split('/')[0] : 'landing'))}>
<div className='container'>
{header}
<div className={classNames('ascribe-wallet-app', `route--${(path ? path.split('/')[0] : 'landing')}`)}>
{header}
<div className="container ascribe-body">
{/* Routes are injected here */}
{children}
</div>
</div>

View File

@ -20,8 +20,13 @@ $vivi23--highlight-color: #de2600;
vertical-align: middle;
}
.hero {
display: none;
}
.vivi23-landing {
font-weight: normal;
padding: 0 15px;
text-align: center;
}

View File

@ -178,8 +178,13 @@ $cyland--button-sec-color: #515151;
vertical-align: middle;
}
.hero {
display: none;
}
.cyland-landing {
font-weight: normal;
padding: 0 15px;
text-align: center;
}
}