Merge pull request #4 from noman-land/get-status

First pass at styling handler pages
This commit is contained in:
Andrea Maria Piana 2018-07-03 08:59:21 +02:00 committed by GitHub
commit 4b46e664ab
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 576 additions and 476 deletions

4
.gitignore vendored
View File

@ -18,9 +18,11 @@ node_modules
*.log *.log
*.gz *.gz
# Coveralls # Coveralls
coverage coverage
# Benchmarking # Benchmarking
benchmarks/graphs benchmarks/graphs
# Jetbrains
.idea

926
package-lock.json generated

File diff suppressed because it is too large Load Diff

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

View File

@ -22,8 +22,7 @@
} }
$(document).ready(function () { $(document).ready(function () {
var appStoreLink = $('.app-store-link');
var appStoreLink = $("#app-store-link");
if (isAndroid(navigator.userAgent)) { if (isAndroid(navigator.userAgent)) {
appStoreLink.attr('href', buildPlayStoreUrl()); appStoreLink.attr('href', buildPlayStoreUrl());
} else if (isIOS(navigator.userAgent)) { } else if (isIOS(navigator.userAgent)) {
@ -31,5 +30,5 @@
} else { } else {
appStoreLink.attr('href', buildPlayStoreUrl()); appStoreLink.attr('href', buildPlayStoreUrl());
} }
}) });
}()); }());

View File

@ -1,8 +1,84 @@
* {
box-sizing: border-box;
}
body { body {
padding: 50px; font: 14px "Verdana", Helvetica, Arial, sans-serif;
font: 14px "Lucida Grande", Helvetica, Arial, sans-serif; margin: 0;
padding: 0;
} }
a { a {
color: #00B7FF; color: #00B7FF;
} }
h1 {
font-size: 1.4rem;
margin: 0;
}
h2 {
font-size: 1.75rem;
margin: 1.25rem 0 1rem 0;
}
/* components */
.header {
align-items: center;
color: black;
display: flex;
font-weight: 600;
padding: 1rem;
}
.logo img {
max-width: 100px;
}
.try-it-now {
align-items: center;
background: #4957B8;
display: flex;
flex-direction: column;
font-size: 1rem;
padding: 1rem;
}
.try-it-now a {
color: white;
text-decoration: none;
}
.try-it-now a:hover {
opacity: 0.9;
}
.content {
align-items: center;
display: flex;
flex-direction: column;
padding: 2.25rem;
text-align: center;
}
.content img {
border-radius: 50%;
height: 125px;
width: 125px;
}
.content .button {
background-color: #00B7FF;
border-radius: 100px;
color: white;
font-size: 1.2rem;
font-weight: 400;
margin-top: 3rem;
padding: 1rem 2rem;
text-decoration: none;
}
.content .button:hover {
opacity: 0.9;
}

View File

@ -12,6 +12,10 @@ router.get('/', function (req, res, next) {
return userAgent.toLowerCase().indexOf("iphone") > -1; return userAgent.toLowerCase().indexOf("iphone") > -1;
} }
if (req.query.redirect) {
return next();
}
var userAgent = req.headers['user-agent']; var userAgent = req.headers['user-agent'];
res.header('Cache-Control', 'private, no-cache, no-store, must-revalidate'); res.header('Cache-Control', 'private, no-cache, no-store, must-revalidate');
@ -21,11 +25,11 @@ router.get('/', function (req, res, next) {
if (isAndroid(userAgent)) { if (isAndroid(userAgent)) {
return res.redirect("https://play.google.com/store/apps/details?id=im.status.ethereum"); return res.redirect("https://play.google.com/store/apps/details?id=im.status.ethereum");
} else if (isIOS(userAgent)) { } else if (isIOS(userAgent)) {
return res.redirect("https://status.im/success") return res.redirect("https://status.im/success");
} }
return res.redirect("https://status.im") return res.redirect("https://status.im");
}) });
router.get('/health', function(req, res) { router.get('/health', function(req, res) {
res.send('OK'); res.send('OK');
@ -40,22 +44,23 @@ router.get('/.well-known/apple-app-site-association', function(req, res) {
}); });
router.get('/chat/:chatType/:chatId', function(req, res, next) { router.get('/chat/:chatType/:chatId', function(req, res, next) {
const { chatId, chatType } = req.params;
res.render('index', { res.render('index', {
title: 'Status.im join ' + req.params.chatId + ' chat', title: `Join the ${chatType} chat: #${chatId} in Status`,
path: req.originalUrl path: req.originalUrl
}); });
}); });
router.get('/user/:userId', function(req, res, next) { router.get('/user/:userId', function(req, res, next) {
res.render('index', { res.render('index', {
title: 'Status.im view ' + req.params.userId + ' profile', title: `View user ${req.params.userId}'s profile in Status`,
path: req.originalUrl path: req.originalUrl
}); });
}); });
router.get('/browse/:url', function(req, res, next) { router.get('/browse/:url', function(req, res, next) {
res.render('index', { res.render('index', {
title: 'Status.im browse ' + req.params.url + ' dapp', title: `Browse to ${req.params.url} in Status`,
path: req.originalUrl path: req.originalUrl
}); });
}); });

View File

@ -15,7 +15,25 @@
<link rel='stylesheet' href='/stylesheets/style.css' /> <link rel='stylesheet' href='/stylesheets/style.css' />
</head> </head>
<body> <body>
<a id='app-store-link' href='#'>Don't have status yet, try it</a> <header class="header">
<a class="logo">
<img src="/images/status-logo-blue-w-text.png" />
</a>
</header>
<div class="try-it-now">
<a class='app-store-link' href='#'>
Don't have <strong>Status</strong> yet? Try it now!
</a>
</div>
<div class="content">
<a class="app-store-link">
<img src="/images/status-logo-blue.png">
</a>
<h2><%= title %></h2>
<a class="app-store-link button" href="#">
Try Status now
</a>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script type='text/javascript' src='/javascripts/app.js'></script> <script type='text/javascript' src='/javascripts/app.js'></script>
</body> </body>