mirror of
https://github.com/status-im/universal-links-handler.git
synced 2025-02-23 08:08:08 +00:00
First pass at styling
This commit is contained in:
Noman
parent
2b826879ae
commit
c15c669728
BIN
public/images/status-logo-blue-w-text.png
Normal file
BIN
public/images/status-logo-blue-w-text.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
public/images/status-logo-blue.png
Normal file
BIN
public/images/status-logo-blue.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
@ -22,8 +22,7 @@
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
|
||||
var appStoreLink = $("#app-store-link");
|
||||
var appStoreLink = $('.app-store-link');
|
||||
if (isAndroid(navigator.userAgent)) {
|
||||
appStoreLink.attr('href', buildPlayStoreUrl());
|
||||
} else if (isIOS(navigator.userAgent)) {
|
||||
@ -31,5 +30,5 @@
|
||||
} else {
|
||||
appStoreLink.attr('href', buildPlayStoreUrl());
|
||||
}
|
||||
})
|
||||
});
|
||||
}());
|
||||
|
||||
@ -1,8 +1,84 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
padding: 50px;
|
||||
font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
|
||||
font: 14px "Verdana", Helvetica, Arial, sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
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;
|
||||
}
|
||||
|
||||
@ -13,20 +13,19 @@ router.get('/', function (req, res, next) {
|
||||
}
|
||||
|
||||
if (req.query.redirect) {
|
||||
return next();
|
||||
return next();
|
||||
}
|
||||
|
||||
var userAgent = req.headers['user-agent'];
|
||||
|
||||
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)) {
|
||||
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) {
|
||||
res.send('OK');
|
||||
@ -41,22 +40,23 @@ router.get('/.well-known/apple-app-site-association', function(req, res) {
|
||||
});
|
||||
|
||||
router.get('/chat/:chatType/:chatId', function(req, res, next) {
|
||||
const { chatId, chatType } = req.params;
|
||||
res.render('index', {
|
||||
title: 'Status.im join ' + req.params.chatId + ' chat',
|
||||
title: `Join the ${chatType} chat: #${chatId} in Status`,
|
||||
path: req.originalUrl
|
||||
});
|
||||
});
|
||||
|
||||
router.get('/user/:userId', function(req, res, next) {
|
||||
res.render('index', {
|
||||
title: 'Status.im view ' + req.params.userId + ' profile',
|
||||
title: `View user ${req.params.userId}'s profile in Status`,
|
||||
path: req.originalUrl
|
||||
});
|
||||
});
|
||||
|
||||
router.get('/browse/:url', function(req, res, next) {
|
||||
res.render('index', {
|
||||
title: 'Status.im browse ' + req.params.url + ' dapp',
|
||||
title: `Browse to ${req.params.url} in Status`,
|
||||
path: req.originalUrl
|
||||
});
|
||||
});
|
||||
|
||||
@ -15,7 +15,25 @@
|
||||
<link rel='stylesheet' href='/stylesheets/style.css' />
|
||||
</head>
|
||||
<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 type='text/javascript' src='/javascripts/app.js'></script>
|
||||
</body>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user