1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 09:23:13 +01:00

Finish styling for landing page

This commit is contained in:
vrde 2015-09-18 13:46:15 +02:00
parent 36f7d8f3d3
commit b76ffcde73
4 changed files with 50 additions and 14 deletions

View File

@ -27,7 +27,7 @@ let PrizeApp = React.createClass({
}
return (
<div className="container ascribe-prize-app">
<div className={'container ascribe-prize-app client--' + subdomain}>
{header}
<RouteHandler />
<GlobalNotification />

View File

@ -32,13 +32,13 @@ let IkonotvLanding = React.createClass({
if(this.state.currentUser && this.state.currentUser.email) {
return (
<ButtonLink to="pieces">
{getLangText('ENTER')}
{getLangText('ENTER TO START')}
</ButtonLink>
);
} else {
return (
<ButtonLink to="signup">
{getLangText('ENTER')}
{getLangText('ENTER TO START')}
</ButtonLink>
);
}
@ -51,11 +51,13 @@ let IkonotvLanding = React.createClass({
<img src="https://s3-us-west-2.amazonaws.com/ascribe0/whitelabel/ikonotv/ikono_tv.png" />
<div className="tagline">
<h1>PROTECT</h1>
<img src="http://placehold.it/600x300" />
<div className="poster">
<div className="content">
</div>
</div>
<h1>& SHARE</h1>
</div>
<h2>Welcome to the ikonoTV</h2>
<h2>Registration Page</h2>
<h2>Welcome to the ikonoTV<br />Registration Page</h2>
</header>
<article>
<section>
@ -102,4 +104,4 @@ let IkonotvLanding = React.createClass({
}
});
export default IkonotvLanding;
export default IkonotvLanding;

View File

@ -8,9 +8,12 @@ import Footer from '../../footer';
import GlobalNotification from '../../global_notification';
import getRoutes from './wallet_routes';
import classNames from 'classnames';
let RouteHandler = Router.RouteHandler;
let WalletApp = React.createClass({
mixins: [Router.State],
@ -28,7 +31,7 @@ let WalletApp = React.createClass({
}
return (
<div className="container ascribe-prize-app">
<div className={classNames('container', 'ascribe-wallet-app', 'client--' + subdomain, {'page--landing': this.isActive('landing')})}>
{header}
<RouteHandler />
<GlobalNotification />

View File

@ -1,11 +1,20 @@
.client--ikonotv.page--landing {
background-color: #c40050;
margin: 0;
width: 100%;
padding: 5em 1em;
}
.client--ikonotv.page--landing .ascribe-footer {
display: none;
}
.ikonotv-landing {
/* center all text on the page */
text-align: center;
background-color: #c40050;
color: white;
padding: 5em 5em 5em 5em;
header {
/* center all images on the page */
img {
@ -16,7 +25,7 @@
/* Ikonotv logo */
img:first-child {
width: 200px;
max-width: 200px;
}
> .tagline {
@ -29,12 +38,30 @@
margin-top: 10px;
margin-bottom: 10px;
@media only screen and (max-width: 600px) {
font-size: 4em;
}
}
> .poster {
max-width: 600px;
margin: 0 auto;
> .content {
width: 100%;
padding-bottom: 56.25%;
height: 0;
background-color: #ffff00;
}
}
}
> h2 {
font-weight: 600;
font-size: 2.75em;
@media only screen and (max-width: 600px) {
font-size: 1.75em;
}
}
> h2 + h2 {
@ -44,7 +71,8 @@
article {
> section {
width: 65%;
width: 100%;
max-width: 60em;
margin: 3em auto 1em auto;
> h1 {
@ -57,6 +85,9 @@
text-align: left;
font-size: 1.3em;
line-height: 1.8;
@media only screen and (max-width: 600px) {
font-size: 1.1em;
}
}
}
}
@ -78,4 +109,4 @@
font-weight: 500;
}
}
}
}