added success and JObs page
This commit is contained in:
Andrei Mironov
parent
4322b6be79
commit
72188b5f16
|
|
@ -73,6 +73,7 @@ gulp.task('dapps', function() {
|
|||
.pipe(gulp.dest('build/dapps'))
|
||||
})
|
||||
|
||||
|
||||
gulp.task('watch', ['css', 'browserify', 'browser-sync'], function() {
|
||||
gulp.watch('src/scss/**/*.+(sass|scss)', ['css'])
|
||||
gulp.watch('src/*.html', browserSync.reload)
|
||||
|
|
|
|||
|
|
@ -30,6 +30,7 @@
|
|||
"d3-ease": "^1.0.2",
|
||||
"d3-interpolate": "^1.1.2",
|
||||
"d3-scale": "^1.0.4",
|
||||
"gulp-file-include": "^1.0.0",
|
||||
"lodash.assign": "^4.2.0",
|
||||
"lodash.clone": "^4.0.1",
|
||||
"lodash.foreach": "^4.0.0",
|
||||
|
|
|
|||
136
src/css/main.css
136
src/css/main.css
|
|
@ -638,8 +638,9 @@ li.social-link a {
|
|||
background: white;
|
||||
border-radius: 8px; }
|
||||
|
||||
.page__content.page__content--success {
|
||||
padding: 160px 40px;
|
||||
.page__content.page__content--centered {
|
||||
max-width: 100%;
|
||||
padding: 50px 160px;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-align: center;
|
||||
|
|
@ -669,12 +670,101 @@ li.social-link a {
|
|||
.page__content p strong {
|
||||
font-family: "PostGrotesk-Medium", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; }
|
||||
|
||||
.page__content.page__content--success .page__title {
|
||||
.page__content.page__content--centered .page__title {
|
||||
max-width: 500px; }
|
||||
|
||||
.page__content.page__content--success .page__text {
|
||||
.page__content.page__content--centered .page__text {
|
||||
max-width: 500px; }
|
||||
|
||||
.page h3 {
|
||||
font-family: "PostGrotesk-Medium", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
|
||||
font-size: 22px;
|
||||
margin: 32px 0 8px 0; }
|
||||
|
||||
.page h5 {
|
||||
font-size: 15px;
|
||||
opacity: 1;
|
||||
padding: 16px; }
|
||||
|
||||
.page__social {
|
||||
width: 100%;
|
||||
padding: 48px 0; }
|
||||
|
||||
.page__social-buttons {
|
||||
width: 100%;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-ms-flex-wrap: nowrap;
|
||||
flex-wrap: nowrap; }
|
||||
|
||||
.page__social-button-wrap {
|
||||
-ms-flex-preferred-size: 33.3%;
|
||||
flex-basis: 33.3%;
|
||||
-ms-flex-negative: 1;
|
||||
flex-shrink: 1;
|
||||
-ms-flex-positive: 1;
|
||||
flex-grow: 1;
|
||||
margin: 12px;
|
||||
position: relative;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #e9eaf4;
|
||||
text-align: center;
|
||||
box-shadow: 0 2px 5px 0 rgba(71, 91, 106, 0.12);
|
||||
transition: box-shadow .2s ease; }
|
||||
|
||||
.page__social-button-wrap:first-child {
|
||||
margin-left: 0; }
|
||||
|
||||
.page__social-button-wrap:last-child {
|
||||
margin-right: 0; }
|
||||
|
||||
.page__social-button-wrap:hover {
|
||||
box-shadow: 0 4px 10px 0 rgba(71, 91, 106, 0.16); }
|
||||
|
||||
.page__social-button {
|
||||
padding: 24px;
|
||||
height: 92px;
|
||||
overflow: hidden; }
|
||||
|
||||
.big-button-wrap {
|
||||
margin: 48px 0 0 0; }
|
||||
|
||||
.button.button--big {
|
||||
height: 56px;
|
||||
line-height: 56px;
|
||||
font-size: 15px;
|
||||
letter-spacing: 1.2px; }
|
||||
|
||||
.button.button--secondary.button--page {
|
||||
display: inline-block;
|
||||
padding: 0 40px;
|
||||
background-color: #4A5C69;
|
||||
color: white; }
|
||||
|
||||
.button.button--secondary.button--page.button--page--slack {
|
||||
background-color: #E3306D; }
|
||||
|
||||
.button.button--secondary.button--page.button--page--wiki {
|
||||
background-color: #4A55BF; }
|
||||
|
||||
.button.button--secondary.button--page:hover {
|
||||
opacity: .8;
|
||||
background-color: #4A5C69; }
|
||||
|
||||
.button.button--secondary.button--page.button--page--slack:hover {
|
||||
opacity: .8;
|
||||
background-color: #E3306D; }
|
||||
|
||||
.button.button--secondary.button--page.button--page--wiki:hover {
|
||||
opacity: .8;
|
||||
background-color: #4A55BF; }
|
||||
|
||||
.page__social-button-label {
|
||||
display: block;
|
||||
text-align: center;
|
||||
opacity: .6;
|
||||
padding: 16px; }
|
||||
|
||||
.page__footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
|
|
@ -709,6 +799,18 @@ li.social-link a {
|
|||
margin: 0 0 30px 0; } }
|
||||
|
||||
@media (max-width: 1140px) {
|
||||
.page__social {
|
||||
padding: 16px 0; }
|
||||
.page__social-buttons {
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap; }
|
||||
.page__social-button-wrap {
|
||||
width: 100%;
|
||||
-ms-flex-preferred-size: 100%;
|
||||
flex-basis: 100%; }
|
||||
.page__social-button-wrap {
|
||||
margin-left: 0;
|
||||
margin-right: 0; }
|
||||
.page {
|
||||
margin: 20px 20px 0 20px; }
|
||||
.page__content-wrap {
|
||||
|
|
@ -723,13 +825,13 @@ li.social-link a {
|
|||
.page__content-wrap {
|
||||
top: -20px;
|
||||
margin: 0 0 20px 0; }
|
||||
.page__content.page__content--success {
|
||||
.page__content.page__content--centered {
|
||||
padding: 100px 20px; } }
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.page {
|
||||
margin: 0; }
|
||||
.page__content.page__content--success,
|
||||
.page__content.page__content--centered,
|
||||
.page__content {
|
||||
padding: 40px 0 80px 0; }
|
||||
.page__content-wrap {
|
||||
|
|
@ -1143,27 +1245,23 @@ input.email-form__input--email:disabled {
|
|||
box-shadow: 0px -2px 18px 0px rgba(72, 89, 102, 0.25);
|
||||
border-radius: 10px; }
|
||||
|
||||
.more-button {
|
||||
font-family: "PostGrotesk-Medium", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
|
||||
text-transform: uppercase;
|
||||
line-height: 15px;
|
||||
text-align: center;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
padding: 14px 35px 14px;
|
||||
font-size: 13px;
|
||||
letter-spacing: 1px;
|
||||
.button.button--secondary {
|
||||
color: #6370CA;
|
||||
background-color: rgba(99, 112, 202, 0.1);
|
||||
border-radius: 10px;
|
||||
box-shadow: none; }
|
||||
|
||||
.button.button--more {
|
||||
padding: 0 35px;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
left: 50%;
|
||||
transition: transform .2s ease, background-color .2s ease; }
|
||||
|
||||
.more-button:hover {
|
||||
.button.button--secondary:hover {
|
||||
background-color: rgba(99, 112, 202, 0.2); }
|
||||
|
||||
.more-button:active {
|
||||
.button.button--more:active {
|
||||
transform: translate3d(-50%, 0, 0) scale(0.99); }
|
||||
|
||||
.features__item {
|
||||
|
|
@ -1423,7 +1521,7 @@ input.email-form__input--email:disabled {
|
|||
border-bottom: 1px solid #EEF2F5; }
|
||||
.features__item:nth-child(3) .features-text {
|
||||
border-bottom: none; }
|
||||
.more-button {
|
||||
.button.button--more {
|
||||
display: none; } }
|
||||
|
||||
@keyframes shakeIt {
|
||||
|
|
|
|||
|
|
@ -144,7 +144,7 @@
|
|||
<p class="features__description">Discover nearby Status users to exchange goods and services.</p>
|
||||
</div>
|
||||
</div>
|
||||
<a class="more-button" href="#">Learn more</a>
|
||||
<a class="button button--secondary button--more" href="#">Learn more</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -335,18 +335,16 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer">
|
||||
<div class="footer-inner">
|
||||
|
||||
<div class="footer-logo-wrap">
|
||||
<div class="footer-logo-wrap__inner">
|
||||
<div class="footer-logo"></div>
|
||||
<div class="footer-address"> Status Holdings Pte. Ltd.<br/>22 Sin Ming Lane<br/>Singapore</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-table">
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">Social links</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -357,7 +355,6 @@
|
|||
<li class="footer-link footer-link--rd"><a href="https://www.reddit.com/r/statusim/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Reddit</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">More</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -365,7 +362,6 @@
|
|||
<li class="footer-link"><a href="https://blog.status.im/?gi=73d6676925e9" target="_blank">Status Blog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">Language</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -376,12 +372,11 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script src="js/app.js?v=44d5354"></script>
|
||||
<script src="js/mc-validate.js"></script>
|
||||
<!-- Google Analytics -->
|
||||
|
|
|
|||
|
|
@ -0,0 +1,183 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="x-ua-compatible" content="ie=edge">
|
||||
|
||||
<title>Status | The Mobile Ethereum Client</title>
|
||||
<meta name="description" content="Status is an interface to access Ethereum, built for Android & iOS. Enjoy encrypted messaging, a cryptocurrency wallet, and seamless access to DApps.">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<link rel="icon" type="image/png" href="img/new-site/logo-32.png" sizes="32x32" />
|
||||
<link rel="icon" type="image/png" href="img/new-site/logo-16.png" sizes="16x16" />
|
||||
|
||||
<link rel="apple-touch-icon" href="img/new-site/apple-touch-icon-1024.png">
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="img/new-site/apple-touch-icon-76.png">
|
||||
<link rel="apple-touch-icon" sizes="120x120" href="img/new-site/apple-touch-icon-120.png">
|
||||
<link rel="apple-touch-icon" sizes="152x152" href="img/new-site/apple-touch-icon-152.png">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="img/new-site/apple-touch-icon-180.png">
|
||||
<link rel="mask-icon" href="img/new-site/logo-mask.svg" color="4360DF">
|
||||
|
||||
<!-- favicon.ico in the root directory -->
|
||||
<link rel="stylesheet" href="css/main.css?v=16d1099">
|
||||
<meta property="og:title" content="Status, a Mobile Ethereum OS" />
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="page">
|
||||
|
||||
<div class="header-wrap">
|
||||
<div class="header">
|
||||
<div class="header__inner">
|
||||
<a class="logo" href="/">
|
||||
<span class="logo__icon"></span>
|
||||
<div class="logo_text">
|
||||
<span class="logo__title">Status</span>
|
||||
<span class="logo__description"><span>A </span>Mobile Ethereum OS</span>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="nav">
|
||||
<a class="nav__item nav__item--blog" target="_blank" href="https://blog.status.im/">Blog</a>
|
||||
<a class="nav__item nav__item--features" href="/">About</a>
|
||||
</div>
|
||||
|
||||
<div class="shares">
|
||||
<ul class="social-links">
|
||||
<li class="social-link social-link--fb"><a href="https://www.facebook.com/ethstatus" target="_blank"></a></li>
|
||||
<li class="social-link social-link--tw"><a href="https://twitter.com/ethstatus" target="_blank"></a></li>
|
||||
<li class="social-link social-link--sl"><a href="http://slack.status.im/" target="_blank"></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page__content-wrap">
|
||||
<div class="page__content">
|
||||
<h2 class="page__title">Love Clojure? Status is looking for Contributors.</h2>
|
||||
<div class="page__text">
|
||||
<p class="page__subheader">We’re building an open source messaging platform for the decentralized web.<br/>Powered by Ethereum.</p>
|
||||
|
||||
<h3>Welcome to Web 3.0.</h3>
|
||||
<p>With the new suite of protocols Ethereum has introduced, we have a clear path towards a more democratic internet where we can communicate securely without fear of institutional surveillance, where we can trade freely without borders, and controlling your own wealth without the dependency on intermediaries or centralized servers charging outrageously high fees.</p>
|
||||
|
||||
<h3>Status is an interface for the decentralized web.</h3>
|
||||
<p>We’re observing an emerging ecosystem of decentralized applications built on top of Ethereum’s protocols, and Status aims to provide an interface to access them. You can think of Status as a browser for the decentralized web, that uses messaging as a platform, akin to an open source, peer-to-peer version of WeChat.</p>
|
||||
|
||||
<h3>The technology</h3>
|
||||
<p>Status is already in alpha. We’re built using re-natal + re-frame + cljs + golang. Its communication protocol uses an Ethereum sub-protocol called SHH/Whisper (not to be confused with Signal) which is an identity-based encrypted messaging protocol with dark routing. You can learn more about it in this presentation.</p>
|
||||
<p>In Ethereum (and Status), there is a concept called 'web3', files are stored using SWARM (a kademlia-like decentralised file storage solution) and 'server-side logic' is done using Smart Contracts and on the blockchain. This allows us to create trust-less, censorship resistant systems.</p>
|
||||
|
||||
<h3>Still interested? Come Get Involved!</h3>
|
||||
<p>As an open sourceproject anyone is free to contribute to Status. Regardless of your experience or background all contributors are welcome to join our community and help us shape the direction of the project:</p>
|
||||
</div>
|
||||
<div class="page__social">
|
||||
<div class="page__social-buttons">
|
||||
|
||||
<div class="page__social-button-wrap page__social-button-wrap--gh">
|
||||
<div class="page__social-button page__social-button--github"><iframe src="https://ghbtns.com/github-btn.html?user=status-im&repo=status-react&type=star&count=true&size=large" frameborder="0" scrolling="0" width="160px" height="30px"></iframe></div>
|
||||
<span class="page__social-button-label">Star us on Github to raise awareness</span>
|
||||
</div>
|
||||
|
||||
<div class="page__social-button-wrap page__social-button-wrap--sl">
|
||||
<div class="page__social-button"><a href="http://slack.status.im" class="button button--secondary button--page button--page--slack">Slack</a></div>
|
||||
<span class="page__social-button-label">Come say hi, and meet our team of contributors</span>
|
||||
</div>
|
||||
|
||||
<div class="page__social-button-wrap page__social-button-wrap--wk">
|
||||
<div class="page__social-button"><a href="https://wiki.status.im/getting-started/mission-and-core-values/" class="button button--secondary button--page button--page--wiki">Wiki</a></div>
|
||||
<span class="page__social-button-label">Read about Our Mission and Values</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="page__text">
|
||||
<h3>Join Us Full Time</h3>
|
||||
<p>In addition to our wonderful community of part-time contributors, we have a full-time team of 8, and are looking to hire full-time Core Contributors who are passionate about smart contracts, crypto-currencies and are fluent in Lisp-dialect. Experience with ClojureScript and re-frame is ideal. You will be able to work remotely from anywhere in the world, and salaries competitive. (> pull-requests CVs)</p>
|
||||
<div class="big-button-wrap">
|
||||
<a class="button button--big button--secondary" href="https://status-platform.workable.com/jobs/406019/candidates/new">Apply as a Core Contributor</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="page__footer">
|
||||
<a class="page__footer-link" href="/">Learn more about Status</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer footer--page">
|
||||
<div class="footer-inner">
|
||||
<div class="footer-logo-wrap">
|
||||
<div class="footer-logo-wrap__inner">
|
||||
<div class="footer-logo"></div>
|
||||
<div class="footer-address"> Status Holdings Pte. Ltd.<br/>22 Sin Ming Lane<br/>Singapore</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-table">
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">Social links</h4>
|
||||
<ul class="footer-list">
|
||||
<li class="footer-link footer-link--fb"><a href="https://www.facebook.com/ethstatus" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Facebook</span></a></li>
|
||||
<li class="footer-link footer-link--tw"><a href="https://twitter.com/ethstatus" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Twitter</span></a></li>
|
||||
<li class="footer-link footer-link--sl"><a href="http://slack.status.im/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Slack</span></a></li>
|
||||
<li class="footer-link footer-link--gh"><a href="https://github.com/status-im" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Github</span></a></li>
|
||||
<li class="footer-link footer-link--rd"><a href="https://www.reddit.com/r/statusim/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Reddit</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">More</h4>
|
||||
<ul class="footer-list">
|
||||
<li class="footer-link"><a href="https://wiki.status.im" target="_blank">Status Wiki</a></li>
|
||||
<li class="footer-link"><a href="https://blog.status.im/?gi=73d6676925e9" target="_blank">Status Blog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">Language</h4>
|
||||
<ul class="footer-list">
|
||||
<li class="footer-link">
|
||||
<select class="language-switcher" name="lang">
|
||||
<option value="en">English</option>
|
||||
</select>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Google Analytics -->
|
||||
<script>
|
||||
(function(i, s, o, g, r, a, m) {
|
||||
i['GoogleAnalyticsObject'] = r;
|
||||
i[r] = i[r] || function() {
|
||||
(i[r].q = i[r].q || []).push(arguments)
|
||||
}, i[r].l = 1 * new Date();
|
||||
a = s.createElement(o),
|
||||
m = s.getElementsByTagName(o)[0];
|
||||
a.async = 1;
|
||||
a.src = g;
|
||||
m.parentNode.insertBefore(a, m)
|
||||
})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
|
||||
|
||||
ga('create', 'UA-79146816-1', 'auto');
|
||||
ga('send', 'pageview');
|
||||
</script>
|
||||
<!-- /Google Analytics -->
|
||||
|
||||
<!-- Heap Analytics -->
|
||||
<script type="text/javascript">
|
||||
window.heap=window.heap||[],heap.load=function(e,t){window.heap.appid=e,window.heap.config=t=t||{};var r=t.forceSSL||"https:"===document.location.protocol,a=document.createElement("script");a.type="text/javascript",a.async=!0,a.src=(r?"https:":"http:")+"//cdn.heapanalytics.com/js/heap-"+e+".js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(a,n);for(var o=function(e){return function(){heap.push([e].concat(Array.prototype.slice.call(arguments,0)))}},p=["addEventProperties","addUserProperties","clearEventProperties","identify","removeEventProperty","setEventProperties","track","unsetEventProperty"],c=0;c<p.length;c++)heap[p[c]]=o(p[c])};
|
||||
heap.load("1816593697");
|
||||
</script>
|
||||
<!-- /Heap Analytics -->
|
||||
|
||||
<!-- Twitter buttons -->
|
||||
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
|
||||
<!-- /Twitter buttons -->
|
||||
|
||||
<!-- Optimizely -->
|
||||
<script src="https://cdn.optimizely.com/js/7577170144.js"></script>
|
||||
<!-- /Optimizely -->
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -9970,7 +9970,7 @@ var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol
|
|||
hideCookiePopup();
|
||||
}
|
||||
|
||||
document.querySelectorAll(".more-button")[0].addEventListener('click', function (event) {
|
||||
document.querySelectorAll(".button--more")[0].addEventListener('click', function (event) {
|
||||
animateScroll(slideTwo, 600, "easeInOutCubic", 0);
|
||||
event.preventDefault();
|
||||
});
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@ if (statusCookiePolicyAccepted == "accepted") {
|
|||
hideCookiePopup()
|
||||
}
|
||||
|
||||
document.querySelectorAll(".more-button")[0].addEventListener('click', function(event){
|
||||
document.querySelectorAll(".button--more")[0].addEventListener('click', function(event){
|
||||
animateScroll(slideTwo, 600, "easeInOutCubic", 0)
|
||||
event.preventDefault()
|
||||
})
|
||||
|
|
|
|||
|
|
@ -69,16 +69,13 @@
|
|||
</div>
|
||||
<div class="footer footer--page">
|
||||
<div class="footer-inner">
|
||||
|
||||
<div class="footer-logo-wrap">
|
||||
<div class="footer-logo-wrap__inner">
|
||||
<div class="footer-logo"></div>
|
||||
<div class="footer-address"> Status Holdings Pte. Ltd.<br/>22 Sin Ming Lane<br/>Singapore</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-table">
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">Social links</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -89,7 +86,6 @@
|
|||
<li class="footer-link footer-link--rd"><a href="https://www.reddit.com/r/statusim/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Reddit</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">More</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -97,7 +93,6 @@
|
|||
<li class="footer-link"><a href="https://blog.status.im/?gi=73d6676925e9" target="_blank">Status Blog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">Language</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -108,9 +103,7 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -68,16 +68,13 @@
|
|||
</div>
|
||||
<div class="footer footer--page">
|
||||
<div class="footer-inner">
|
||||
|
||||
<div class="footer-logo-wrap">
|
||||
<div class="footer-logo-wrap__inner">
|
||||
<div class="footer-logo"></div>
|
||||
<div class="footer-address"> Status Holdings Pte. Ltd.<br/>22 Sin Ming Lane<br/>Singapore</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-table">
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">Social links</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -88,7 +85,6 @@
|
|||
<li class="footer-link footer-link--rd"><a href="https://www.reddit.com/r/statusim/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Reddit</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">More</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -96,7 +92,6 @@
|
|||
<li class="footer-link"><a href="https://blog.status.im/?gi=73d6676925e9" target="_blank">Status Blog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">Language</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -107,11 +102,11 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Google Analytics -->
|
||||
<script>
|
||||
(function(i, s, o, g, r, a, m) {
|
||||
|
|
|
|||
|
|
@ -26,15 +26,15 @@
|
|||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.page__content.page__content--success {
|
||||
padding: 160px 40px;
|
||||
.page__content.page__content--centered {
|
||||
max-width: 100%;
|
||||
padding: 50px 160px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.page__title {
|
||||
font-family:$PostGroteskMedium;
|
||||
font-size: 24px;
|
||||
|
|
@ -61,14 +61,121 @@
|
|||
font-family: $PostGroteskMedium;
|
||||
}
|
||||
|
||||
.page__content.page__content--success .page__title {
|
||||
.page__content.page__content--centered .page__title {
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.page__content.page__content--success .page__text {
|
||||
.page__content.page__content--centered .page__text {
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.page h3 {
|
||||
font-family: $PostGroteskMedium;
|
||||
font-size: 22px;
|
||||
margin: 32px 0 8px 0;
|
||||
}
|
||||
|
||||
.page h5 {
|
||||
font-size: 15px;
|
||||
opacity: 1;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.page__social {
|
||||
width: 100%;
|
||||
padding: 48px 0
|
||||
}
|
||||
|
||||
.page__social-buttons {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.page__social-button-wrap {
|
||||
flex-basis: 33.3%;
|
||||
flex-shrink: 1;
|
||||
flex-grow: 1;
|
||||
margin: 12px;
|
||||
position: relative;
|
||||
//background-color: $colorBg;
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(233, 234, 244, 1);
|
||||
text-align: center;
|
||||
box-shadow: 0 2px 5px 0 rgba(71,91,106,0.12);
|
||||
transition: box-shadow .2s ease;
|
||||
}
|
||||
|
||||
.page__social-button-wrap:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.page__social-button-wrap:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.page__social-button-wrap:hover {
|
||||
box-shadow: 0 4px 10px 0 rgba(71,91,106,0.16);
|
||||
}
|
||||
|
||||
.page__social-button {
|
||||
padding: 24px;
|
||||
height: 92px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.big-button-wrap {
|
||||
margin: 48px 0 0 0;
|
||||
}
|
||||
|
||||
.button.button--big {
|
||||
height: 56px;
|
||||
line-height: 56px;
|
||||
font-size: 15px;
|
||||
letter-spacing: 1.2px
|
||||
}
|
||||
|
||||
|
||||
|
||||
.page__social-button.page__social-button--github {
|
||||
//margin: 0 0 0 30px;
|
||||
}
|
||||
|
||||
.button.button--secondary.button--page {
|
||||
display: inline-block;
|
||||
padding: 0 40px;
|
||||
background-color: #4A5C69;
|
||||
color: $colorWhite
|
||||
}
|
||||
.button.button--secondary.button--page.button--page--slack {
|
||||
background-color: #E3306D
|
||||
}
|
||||
.button.button--secondary.button--page.button--page--wiki {
|
||||
background-color: #4A55BF
|
||||
}
|
||||
|
||||
.button.button--secondary.button--page:hover {
|
||||
opacity: .8;
|
||||
background-color: #4A5C69;
|
||||
}
|
||||
|
||||
.button.button--secondary.button--page.button--page--slack:hover {
|
||||
opacity: .8;
|
||||
background-color: #E3306D;
|
||||
}
|
||||
|
||||
.button.button--secondary.button--page.button--page--wiki:hover {
|
||||
opacity: .8;
|
||||
background-color: #4A55BF;
|
||||
}
|
||||
|
||||
.page__social-button-label {
|
||||
display: block;
|
||||
text-align: center;
|
||||
opacity: .6;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.page__footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
|
|
@ -109,6 +216,25 @@
|
|||
|
||||
@media (max-width: 1140px) {
|
||||
|
||||
.page__social {
|
||||
padding: 16px 0;
|
||||
}
|
||||
|
||||
.page__social-buttons {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.page__social-button-wrap {
|
||||
width: 100%;
|
||||
flex-basis: 100%;
|
||||
}
|
||||
|
||||
.page__social-button-wrap {
|
||||
margin-left: 0;
|
||||
margin-right: 0
|
||||
}
|
||||
|
||||
|
||||
.page {
|
||||
margin: 20px 20px 0 20px;
|
||||
}
|
||||
|
|
@ -121,6 +247,8 @@
|
|||
width: auto;
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
@media (max-width: 840px) {
|
||||
|
|
@ -135,7 +263,7 @@
|
|||
margin: 0 0 20px 0;
|
||||
}
|
||||
|
||||
.page__content.page__content--success {
|
||||
.page__content.page__content--centered {
|
||||
padding: 100px 20px;
|
||||
}
|
||||
}
|
||||
|
|
@ -146,7 +274,7 @@
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
.page__content.page__content--success,
|
||||
.page__content.page__content--centered,
|
||||
.page__content {
|
||||
padding: 40px 0 80px 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -313,29 +313,26 @@ input.email-form__input--email:disabled {
|
|||
// transform: translate3d(0, 0, 0);
|
||||
// }
|
||||
|
||||
.more-button {
|
||||
font-family:$PostGroteskMedium;
|
||||
text-transform: uppercase;
|
||||
line-height: 15px;
|
||||
text-align: center;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
padding: 14px 35px 14px;
|
||||
font-size: 13px;
|
||||
letter-spacing: 1px;
|
||||
.button.button--secondary {
|
||||
color: #6370CA;
|
||||
background-color: rgba(99, 112, 202, .1);
|
||||
border-radius: 10px;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.button.button--more {
|
||||
padding: 0 35px;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
left: 50%;
|
||||
transition: transform .2s ease, background-color .2s ease;
|
||||
}
|
||||
|
||||
.more-button:hover {
|
||||
.button.button--secondary:hover {
|
||||
background-color: rgba(99, 112, 202, .2);
|
||||
}
|
||||
|
||||
.more-button:active {
|
||||
.button.button--more:active {
|
||||
transform: translate3d(-50%, 0, 0) scale(.99)
|
||||
}
|
||||
|
||||
|
|
@ -739,7 +736,7 @@ input.email-form__input--email:disabled {
|
|||
border-bottom: none;
|
||||
}
|
||||
|
||||
.more-button {
|
||||
.button.button--more {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -54,16 +54,52 @@
|
|||
</div>
|
||||
|
||||
<div class="page__content-wrap">
|
||||
<div class="page__content page__content--success">
|
||||
<h2 class="page__title">You’ve been added to the Waitlist.<br />Could you help us spread the word?</h2>
|
||||
<div class="page__content page__content--centered">
|
||||
<h2 class="page__title">Welcome to the Status Community</h2>
|
||||
<div class="page__text">
|
||||
<p class="page__subheader">Please help support our open source project with a tweet, or follow us to stay updated on our progress:</p>
|
||||
<p class="page__subheader">Get involved and let’s shape the future of the decentralized web together</p>
|
||||
</div>
|
||||
|
||||
<div class="page__socilal-buttons">
|
||||
<a href="https://twitter.com/share" class="twitter-share-button" data-show-count="false" data-text="Check out Status (@ethstatus) - an open source project that will bring Ethereum to Android and iOS!" data-url="https://status.im/" data-size="large">Tweet</a>
|
||||
<a href="https://twitter.com/ethstatus" class="twitter-follow-button" data-size="large" data-show-screen-name="false" data-show-count="false">Follow @ethstatus</a>
|
||||
|
||||
<div class="page__social">
|
||||
<h5>Start with simple tasks to help grow our community</h5>
|
||||
<div class="page__social-buttons">
|
||||
<div class="page__social-button-wrap page__social-button-wrap--tw">
|
||||
<div class="page__social-button"><a href="https://twitter.com/ethstatus" class="twitter-follow-button" data-size="large" data-show-screen-name="false" data-show-count="false">Follow @ethstatus</a></div>
|
||||
<span class="page__social-button-label">Connect with Status and follow us on Twitter</span>
|
||||
</div>
|
||||
|
||||
<div class="page__social-button-wrap page__social-button-wrap--gh">
|
||||
<div class="page__social-button page__social-button--github"><iframe src="https://ghbtns.com/github-btn.html?user=status-im&repo=status-react&type=star&count=true&size=large" frameborder="0" scrolling="0" width="160px" height="30px"></iframe></div>
|
||||
<span class="page__social-button-label">Star us on Github to raise awareness</span>
|
||||
</div>
|
||||
|
||||
<div class="page__social-button-wrap page__social-button-wrap--fb">
|
||||
<div class="page__social-button"><iframe src="https://www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fethstatus&width=63&layout=button&action=like&size=large&show_faces=true&share=false&height=65&appId" width="63" height="65" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe></div>
|
||||
<span class="page__social-button-label">Follow our progress directly from Facebook</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="page__social">
|
||||
<h5>Or try something slightly more challenging</h5>
|
||||
<div class="page__social-buttons">
|
||||
<div class="page__social-button-wrap page__social-button-wrap--sl">
|
||||
<div class="page__social-button"><a href="http://slack.status.im" class="button button--secondary button--page button--page--slack">Slack</a></div>
|
||||
<span class="page__social-button-label">Join the Conversation on Slack</span>
|
||||
</div>
|
||||
<div class="page__social-button-wrap page__social-button-wrap--dc">
|
||||
<div class="page__social-button"><a href=" https://wiki.status.im/contributing/development/introduction/" class="button button--secondary button--page button--page--docs">Docs</a></div>
|
||||
<span class="page__social-button-label">Contribute to Our Codebase</span>
|
||||
</div>
|
||||
<div class="page__social-button-wrap page__social-button-wrap--wk">
|
||||
<div class="page__social-button"><a href="https://wiki.status.im/getting-started/mission-and-core-values/" class="button button--secondary button--page button--page--wiki">Wiki</a></div>
|
||||
<span class="page__social-button-label">Read about Our Mission and Values</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="page__footer">
|
||||
<a class="page__footer-link" href="http://slack.status.im/">Learn more about Status</a>
|
||||
|
|
@ -73,16 +109,13 @@
|
|||
</div>
|
||||
<div class="footer footer--page">
|
||||
<div class="footer-inner">
|
||||
|
||||
<div class="footer-logo-wrap">
|
||||
<div class="footer-logo-wrap__inner">
|
||||
<div class="footer-logo"></div>
|
||||
<div class="footer-address"> Status Holdings Pte. Ltd.<br/>22 Sin Ming Lane<br/>Singapore</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-table">
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">Social links</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -93,7 +126,6 @@
|
|||
<li class="footer-link footer-link--rd"><a href="https://www.reddit.com/r/statusim/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">Reddit</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">More</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -101,7 +133,6 @@
|
|||
<li class="footer-link"><a href="https://blog.status.im/?gi=73d6676925e9" target="_blank">Status Blog</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="footer-table__column">
|
||||
<h4 class="footer-header">Language</h4>
|
||||
<ul class="footer-list">
|
||||
|
|
@ -112,11 +143,11 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Google Analytics -->
|
||||
<script>
|
||||
(function(i, s, o, g, r, a, m) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue