Merge pull request #8 from status-im/maitre-confirmation

added maitre confirmation page and heap analytics
This commit is contained in:
carlbennetts 2016-09-18 00:32:10 +08:00 committed by GitHub
commit 6f96ef3249
6 changed files with 671 additions and 393 deletions

View File

@ -1,388 +0,0 @@
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<title>Status</title>
<meta name="description" content="">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="img/favicon/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" href="img/favicon/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="img/favicon/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="img/favicon/apple-touch-icon-114x114.png">
<!--[if lt IE 9]>
<script type="text/javascript"
src="http://html5shiv.googlecode.com/svn/trunk/html5.js">
</script>
<![endif]-->
<link href="https://fonts.googleapis.com/css?family=Roboto:500,300,400" rel="stylesheet" type="text/css">
<!-- build:css css/main.min.css -->
<link rel="stylesheet" href="css/main.css">
<!-- endbuild -->
</head>
<body>
<section class="section-header">
<div class="table-center">
<div class="header-wrapper">
<header class="main-header clearfix">
<div class="logo-wrapper">
<div class="main-logo">
<a href="#"><img src="img/logo@2x.png" width="43" height="39" srcset="img/logo@2x.png 2x" alt="Status"></a>
</div>
<div class="logo-shadow"></div>
</div>
<div class="main-navigation">
<nav>
<ul>
<li><a href="#">Discover</a></li>
<li><a href="#">Features</a></li>
<li><a href="#">About</a></li>
</ul>
</nav>
</div>
</header>
<div class="table-left">
<div class="status">
<div class="status-text">
<h1>About Status</h1>
<p>Status is a browser and a messenger built on Ethereum.<br>Join us in making the Blockchain part of our daily lives.</p>
</div>
</div>
</div>
<div class="table-right table-bottom">
</div>
</div>
</div>
<!--
<div class="table-row">
<div class="block block-white">
<div class="block1-icon">
</div>
<h3>Browse Decentralised Apps</h3>
<p>Web 3.0 is coming and you can be a part.</p>
</div>
<div class="block block-white">
<div class="block2-icon">
</div>
<h3>Have Smarter Messaging</h3>
<p>Communicate with friends and DApps naturally, using Chats. Send messages, payments, smart contracts and more.
</p>
</div>
<div class="block block-white">
<div class="block3-icon">
</div>
<h3>Discover Great Services</h3>
<p>Find and connect with other Status users who love the blockchain as much as you do. Exchange, trade, and share ideas.</p>
</div>
</div> -->
</section>
<section class="section-table section-white">
<div class="table-center">
<div class="table-wrapper">
<div class="table-left">
<div class="section-heading-even">
<h2>Status is a Browser</h2>
<p>With Status this decentralized world is at your fingertips. Browse, and interact with DApps seamlessly, all from a single user interface.</p>
</div>
<div class="white-blocks">
<div class="block-square">
<div class="card-avatar avatar-wallet">
</div>
<h3>Wallet</h3>
<p>Store multiple currencies and wallets safely and security, and review your transactions</p>
</div>
<div class="block-square">
<div class="card-avatar avatar-etherwall">
</div>
<h3>Exchange</h3>
<p>A true decentralized peer-to-peer exchange to trade Fiat to Ether, Ether to Fiar and much more</p>
</div>
<div class="block-square">
<div class="card-avatar avatar-etheroll">
</div>
<h3>DAO Portal</h3>
<p>Review, vote and discuss with the community DAO Proposals and the state of the DAO</p>
</div>
</div>
</div>
<div class="table-right table-bottom">
<div class="phone-even">
<div class="phone-image phone-big">
<div class="phone-inner-image phone-big-image-2">
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section-table">
<div class="table-center">
<div class="table-wrapper">
<div class="table-one-third table-bottom">
<div class="phone-odd">
<div class="phone-image phone-big">
<div class="phone-inner-image phone-big-image">
</div>
</div>
</div>
</div>
<div class="table-two-third">
<div class="section-heading-odd">
<h2>Status is a Messenger</h2>
<p>Have more meaningful conversations, with the ability to send payments, smart contracts, and more, directly from within chats.<br><br></p>
<div class="tags">
<div class="tag tag-status">
<div class="setstatus-pink">
<span>!setStatus</span>
</div>
<p>Away</p>
</div>
<div class="tag tag-transaction">
<div class="transaction-green">
<span>!transaction</span>
</div>
<p>346 <span>ETH</span> </p>
</div>
<div class="tag tag-name">
<div class="name-brown">
<span>!name</span>
</div>
<p>Alex Petrov</p>
</div>
<div class="tag tag-password">
<div class="password-blue">
<span>!keypairPassword</span>
</div>
<div class="icon-lock"></div>
<p>********</p>
</div>
<div class="tag tag-location">
<div class="location-purple">
<span>!location</span>
</div>
<p>Two Bar Mountain,
<br>Maricopa County,
<br>AZ, US</p>
<div class="location-map"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section-table section-white">
<div class="table-center">
<div class="table-wrapper">
<div class="table-left">
<div class="section-heading-even">
<h2>Status is a Community</h2>
<p>Discover enables you to share your Status with the community, and find nearby members. Share ideas, exchange services, and help grow the community.<br><br>Sample Statuses:
</p>
</div>
<div class="white-blocks">
<div class="block-square">
<div class="card-avatar avatar-wallet">
</div>
<h3>Jarrad</h3>
<p>Offering fiat to ether exchange services in Berlin #USDtoETH #localexchange</p>
</div>
<div class="block-square">
<div class="card-avatar avatar-etherwall">
</div>
<h3>Carl</h3>
<p>Trading #BTCtoETH. Smart contracts only. Reputable Trader. #virtualexchange</p>
</div>
<div class="block-square">
<div class="card-avatar avatar-etheroll">
</div>
<h3>Dan</h3>
<p>Looking to buy #DAOtoETH or to chat about the DAO. #daoproposals</p>
</div>
</div>
</div>
<div class="table-right table-bottom">
<div class="phone-even">
<div class="phone-image phone-big">
<div class="phone-inner-image phone-big-image-2">
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- <section class="section-table section-white">
<div class="table-center">
<div class="table-container">
<div class="table-two-third">
<div class="block block-blue">
<div class="block-blue-icon">
</div>
<h4>Say No to Censorship</h4>
<p>We believe in a free and open internet. Status is bringing back the transparent ideals the internet was founded upon.</p>
</div>
<div class="block block-purple">
<div class="block-purple-icon">
</div>
<h4>Blind-Trust Not Required</h4>
<p>Decentralized, distributed, peer-to-peer technologies solve the problem that has plagued humankind for millennia: Trust.</p>
</div>
<div class="block block-green">
<div class="block-green-icon">
</div>
<h4>Encrypted and Secure</h4>
<p>Guard your communication from prying eyes and malicious institutions with our military grade end-to-end encryption.</p>
</div>
<div class="block block-peach">
<div class="block-peach-icon">
</div>
<h4>Web 3.0 Stack</h4>
<p>Harness the benefits of Ethereum, and the Web 3.0 stack to solve the problems of server failure, undelivered messages, and information loss.</p>
</div>
</div>
<div class="table-one-third">
<div class="section-text-column">
<h2>Enter a bold new world, resistant to corruption.</h2>
<p>Status combines the next generation of browser, with an open messenging platform. This enables safe, free and open communication with humans and DApps alike.</p>
</div>
</div>
</div>
</div>
</section> -->
<section class="section-table section-gradient">
<div class="table-center">
<div class="table-wrapper">
<div class="gradient-text">
<h2>Get early access</h2>
<div class="section-gradient-text">
<p>Status is arriving soon. Join our private wait list for early access and updates. We respect privacy.</p>
</div>
</div>
<div class="gradient-email">
<div class="email">
<input type="email" class="email-input" placeholder="Leave Your email">
<div class="email-button"></div>
</div>
</div>
</div>
</div>
</section>
<footer>
<div class="container">
<div class="footer-wrapper">
<div class="footer-half">
<p>Status Platform
<br>Kemperplatz 1
Berlin, Germany
<br> support@status.im</p>
<div class="footer-icons-social">
<a href="#" class="footer-icon icon-github"></a>
<a href="#" class="footer-icon icon-twitter"></a>
<a href="#" class="footer-icon icon-facebook"></a>
</div>
</div>
<div class="footer-half">
<a class="footer-logo"></a>
<div class="footer-links">
<a href="#">Team</a>
<a href="#">Jobs</a>
<a href="#">Press</a>
</div>
</div>
</div>
</div>
</footer>
<!-- build:js js/main.min.js -->
<script type="text/javascript" src="js/libs.min.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<!-- endbuild -->
</body>
</html>

View File

@ -946,6 +946,9 @@ footer {
.icon-github {
background-image: url("../img/icon-github.svg"); }
.icon-email {
background-image: url("../img/icon-email.svg"); }
.icon-twitter {
background-image: url("../img/icon-twitter.svg"); }

17
src/img/icon-email.svg Normal file
View File

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.2.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 36 36" style="enable-background:new 0 0 36 36;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFFFFF;}
</style>
<g transform="translate(0.000000,300.000000) scale(0.100000,-0.100000)">
<path id="node1" class="st0" d="M61.3,2928c-4.7-2.2-9.4-6.8-11.3-11c-1.2-2.6-1.7-5.7-1.7-11.6v-8l13.4-10.5
c53.9-42.4,95.2-70.5,112.4-76.7c5.9-2.1,5.9-2.1,10.4-0.5c9.3,3.2,19.4,8.9,38.3,21.3c9.3,6.1,11.6,7.6,26,17.9
c11,7.8,35,25.9,49.9,37.7l12.9,10.2v7.9c-0.1,12-3.7,18.7-12.7,22.9l-4.4,2.1l-115-0.1C72.1,2929.5,64.4,2929.4,61.3,2928z"/>
<path id="node2" class="st0" d="M48.3,2795.5c0-75.7-0.3-72.1,5.5-78c1.6-1.7,4.7-4,6.9-5.1l4.1-2.1h114.8h114.8l4.4,2.1
c5.2,2.4,9.3,6.8,11.3,12c1.3,3.5,1.4,10.5,1.2,71.7l-0.3,67.9l-9.4-7.4c-11.5-8.9-19.8-15.2-24.8-18.7c-2-1.4-11.4-8.2-20.7-14.8
c-31.9-22.8-56.4-37.9-69-42.2c-6.1-2.1-7.2-2.2-10.8-1.3c-6.2,1.6-20.3,8.6-30.8,15.4c-8.3,5.4-31.8,21-36.5,24.3
c-20.7,14.6-48.7,35.1-58.4,42.7l-2.5,2.1V2795.5z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -5,8 +5,8 @@
<meta charset="utf-8">
<title>Status</title>
<meta name="description" content="The mobile light-client">
<title>Status | The Mobile Ethereum Client</title>
<meta name="description" content="Status is a mobile DApp browser and messenger for Ethereum. Join us in making Ethereum part of our everyday lives and interactions.">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

View File

@ -5,7 +5,7 @@
<meta charset="utf-8">
<title>Status</title>
<title>Status | Mobile Ethereum Client</title>
<meta name="description" content="The mobile light-client">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
@ -39,6 +39,11 @@
ga('create', 'UA-79146816-1', 'auto');
</script>
<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>
<!-- build:css css/main.min.css -->
<link rel="stylesheet" href="css/main.css">
<!-- endbuild -->
@ -99,7 +104,7 @@
jQuery("#maitre-verification").html(
"Remember to confirm your email to be added to the signup queue. <br /> Improve your position by referring your friends and spreading the word.");
jQuery("#maitre-share-container").html(
'<div class="footer-icons-social"><a href="#" class="footer-icon icon-github"></a><a href="#" class="footer-icon icon-twitter"></a><a href="#" class="footer-icon icon-facebook"></a></div>');
'<div class="footer-icons-social"><a href="#" class="footer-icon icon-email"></a><a href="#" class="footer-icon icon-twitter"></a><a href="#" class="footer-icon icon-facebook"></a></div>');
jQuery(".gradient-text").empty();
if (data.response == "subscriber_created") {
ga('send', 'event', 'Waitlist', 'Sign Up', 'Waitlist');
@ -611,7 +616,7 @@
<br>Kemperplatz 1 Berlin, Germany
<br> support@status.im</p>
<div class="footer-icons-social">
<a href="https://github.com/status-im" class="footer-icon icon-github"></a>
<a href="https://github.com/status-im" class="footer-icon icon-email"></a>
<a href="https://twitter.com/ethstatus" class="footer-icon icon-twitter"></a>
<a href="https://www.facebook.com/ethstatus" class="footer-icon icon-facebook"></a>
</div>

641
src/welcome.html Normal file
View File

@ -0,0 +1,641 @@
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<title>Status | The Mobile Ethereum Client</title>
<meta name="description" content="Status is a mobile DApp browser and messenger for Ethereum. Join us in making Ethereum part of our everyday lives and interactions.">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="img/favicon/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" href="img/favicon/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="img/favicon/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="img/favicon/apple-touch-icon-114x114.png">
<!--[if lt IE 9]>
<script type="text/javascript"
src="http://html5shiv.googlecode.com/svn/trunk/html5.js">
</script>
<![endif]-->
<link href="https://fonts.googleapis.com/css?family=Roboto:500,300,400" rel="stylesheet" type="text/css">
<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');
</script>
<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>
<!-- build:css css/main.min.css -->
<link rel="stylesheet" href="css/main.css">
<!-- endbuild -->
<script>
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
var foo = getParameterByName('maitre_code'); // Referral Code
var foo = getParameterByName('maitre_position'); // Waitlist Position
</script>
</head>
<body>
<section class="section-table">
<!-- section-header -->
<div class="table-center">
<div class="header-wrapper">
<header class="main-header clearfix">
<div class="logo-wrapper">
<div class="main-logo">
<a href="index.html"><img src="img/logo@2x.png" width="43" height="39" srcset="img/logo@2x.png 2x" alt="Status"></a>
</div>
<div class="logo-shadow"></div>
</div>
<div class="main-navigation">
<nav>
<ul>
<li><a href="https://status-platform.workable.com/">Jobs</a></li>
<li><a href="#features">Features</a></li>
<li><a href="http://slack.status.im/">Slack</a></li>
</ul>
</nav>
</div>
</header>
<div class="table-left">
<div class="status">
<div class="status-text">
<h1>Thanks for confirming your email.</h1>
<p>You'll be notifed when Status is ready to launch.<br /> Help us spread the word by inviting your friends! The more friends you invite, the sooner you'll get access: </p>
<div class="footer-icons-social">
<a href="mailto:?&subject=Ethereum Mobile Client&body=Hey,%20I%20just%20signed%20up%20to%20Status%20-%20it's%20mobile%20client%20built%20on%20Ethereum,%20check%20it%20out!%20https%3A//status.im/invite/MAITRE_CODE" class="footer-icon icon-email" target="_blank"></a>
<a href="https://twitter.com/home?status=I%20just%20signed%20up%20to%20%40ethstatus%20-%20an%20%23ethereum%20%23dapps%20browser%20for%20mobile%3A%20https%3A//status.im/invite/MAITRE_CODE" target="_blank" class="footer-icon icon-twitter"></a>
<a href="http://www.facebook.com/sharer.php?u=https%3A//status.im/invite/MAITRE_CODE" class="footer-icon icon-facebook"></a>
</div>
<p>Or share your unique link:</p><br/>
<div class="status-email" style="width:314px;margin:auto">
<input type="email" value="https://status.im/invite/MAITRE_CODE" >
<div class="email">
</div>
</div>
</div>
</div>
</div>
<div class="table-right table-bottom">
<div class="phone-header">
<div class="phone-image phone-primary">
<div class="phone-inner-image">
</div>
</div>
<div class="phone-image phone-secondary">
<div class="phone-inner-image phone-secondary-image">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="table-row mobile-hidden">
<div class="block block-white">
<div class="block1-icon">
</div>
<h3>Send, Receive, and Store Ether</h3>
<p>Safely secure your Ether and other Ethereum crypto-assets.</p>
</div>
<div class="block block-white">
<div class="block2-icon">
</div>
<h3>Browse Decentralised Apps</h3>
<p>Explore the next generation of apps, with the next generation of Browser.</p>
</div>
<div class="block block-white">
<div class="block3-icon">
</div>
<h3>Buy and Sell Ether Locally</h3>
<p>Discover nearby Status users to exchange goods, services and ideas.</p>
</div>
</div>
</section>
<!-- Mobile Table-Row -->
<div class="section-row section-white">
<div class="mobile-slider">
<div class="swiper-container swiper1">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="mobile-block block-white">
<div class="block1-icon">
</div>
<h3>Send, Receive, and Store Ether</h3>
<p>Safely secure your Ether and other Ethereum crypto-assets.</p>
</div>
</div>
<div class="swiper-slide">
<div class="mobile-block block-white">
<div class="block2-icon">
</div>
<h3>Browse Decentralised Apps</h3>
<p>Explore the next generation of apps, with the next generation of Browser.</p>
</div>
</div>
<div class="swiper-slide">
<div class="mobile-block block-white">
<div class="block3-icon">
</div>
<h3>Buy and Sell Ether Locally</h3>
<p>Discover nearby Status users to exchange goods, services and ideas.</p>
</div>
</div>
</div>
</div>
</div>
<div class="table-one-third">
</div>
</div>
<!-- Colourful blocks section for mobile layout
Remove or comment out if not needed
-->
<!-- <section class="section-table section-white">
<div class="table-center">
<div class="table-container">
<div class="table-two-third">
<div class="mobile-section-text">
<h2>Enter a bold new world, resistant to corruption.</h2>
<p>Status combines the next generation of browser, with an open messenging platform. This enables safe, free and open communication with humans and DApps alike.</p>
</div>
<div class="mobile-slider">
<div class="swiper-container swiper1">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="mobile-block block-blue">
<div class="block-blue-icon">
</div>
<h4>Say No to Censorship</h4>
<p>We believe in a free and open internet. Status is bringing back the transparent ideals the internet was founded upon.</p>
</div>
</div>
<div class="swiper-slide">
<div class="mobile-block block-purple">
<div class="block-purple-icon">
</div>
<h4>Blind-Trust Not Required</h4>
<p>Decentralized, distributed, peer-to-peer technologies solve the problem that has plagued humankind for millennia: Trust.</p>
</div>
</div>
<div class="swiper-slide">
<div class="mobile-block block-green">
<div class="block-green-icon">
</div>
<h4>Encrypted and Secure</h4>
<p>Guard your communication from prying eyes and malicious institutions with our military grade end-to-end encryption.</p>
</div>
</div>
<div class="swiper-slide">
<div class="mobile-block block-peach">
<div class="block-peach-icon">
</div>
<h4>Web 3.0 Stack</h4>
<p>Harness the benefits of Ethereum, and the Web 3.0 stack to solve the problems of server failure, undelivered messages, and information loss.</p>
</div>
</div>
</div>
</div>
</div>
<div class="mobile-hidden">
<div class="block block-blue">
<div class="block-blue-icon">
</div>
<h4>Say No to Censorship</h4>
<p>We believe in a free and open internet. Status is bringing back the transparent ideals the internet was founded upon.</p>
</div>
<div class="block block-purple">
<div class="block-purple-icon">
</div>
<h4>Blind-Trust Not Required</h4>
<p>Decentralized, distributed, peer-to-peer technologies solve the problem that has plagued humankind for millennia: Trust.</p>
</div>
<div class="block block-green">
<div class="block-green-icon">
</div>
<h4>Encrypted and Secure</h4>
<p>Guard your communication from prying eyes and malicious institutions with our military grade end-to-end encryption.</p>
</div>
<div class="block block-peach">
<div class="block-peach-icon">
</div>
<h4>Web 3.0 Stack</h4>
<p>Harness the benefits of Ethereum, and the Web 3.0 stack to solve the problems of server failure, undelivered messages, and information loss.</p>
</div>
</div>
</div>
<div class="table-one-third">
<div class="section-text-column">
<h2>Enter a bold new world, resistant to corruption.</h2>
<p>Status combines the next generation of browser, with an open messenging platform. This enables safe, free and open communication with humans and DApps alike.</p>
</div>
</div>
</div>
</div>
</section> -->
<!-- End colourful blocks section for mobile view -->
<section id="features" class="section-table section-white">
<div class="table-center">
<div class="table-wrapper">
<div class="table-right table-bottom">
<div class="phone-even">
<div class="phone-image phone-big no-float">
<div class="phone-inner-image phone-big-image-2">
</div>
</div>
</div>
</div>
<div class="table-left">
<div class="section-heading-even">
<h2>Decentralised Apps at your fingertips</h2>
<p>Status is a new type of Browser. Seamlessly interact with Decentralized Applications, and begin making Ethereum part of your every day life.</p>
</div>
<!-- Mobile Slider -->
<div class="mobile-slider">
<div class="swiper-container swiper2">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="mobile-block-square">
<div class="card-avatar avatar-wallet">
</div>
<h3>Wallet</h3>
<p>Store multiple currencies and wallets, review your transactions, and much more.</p>
</div>
</div>
<div class="swiper-slide">
<div class="mobile-block-square">
<div class="card-avatar avatar-etherwall">
</div>
<h3>Exchange</h3>
<p>Trade, communicate and collaborate with a community who also believes Ethereum will improve society.</p>
</div>
</div>
<div class="swiper-slide">
<div class="mobile-block-square">
<div class="card-avatar avatar-etheroll">
</div>
<h3>Your DAPP Here</h3>
<p>Status is an Open Platform, and anyone can list their DApp. Stay tuned for updates.</p>
</div>
</div>
</div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
</div>
<!-- End Mobile Slider -->
<div class="white-blocks">
<div class="block-square">
<div class="card-avatar avatar-wallet">
</div>
<h3>Wallet</h3>
<p>Store multiple currencies and wallets, review your transactions, and much more.</p>
</div>
<div class="block-square">
<div class="card-avatar avatar-etherwall">
</div>
<h3>Exchange</h3>
<p>Trade, communicate and collaborate with a community who also believes Ethereum will improve society.</p>
</div>
<div class="block-square">
<div class="card-avatar avatar-etheroll">
</div>
<h3>Your DApp Here</h3>
<p>Status is an Open Platform, and anyone can list their DApp. Stay tuned for updates.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section-table">
<div class="table-center">
<div class="table-wrapper">
<div class="table-two-third">
<div class="section-heading-odd">
<h2>Smarter messaging has arrived</h2>
<p>Status aims to replace your Messenger, enabling more meaningful conversations. Send payments, smart contracts, and more, directly from within chats.<br><br></p>
<div class="tags">
<div class="tag tag-status">
<div class="setstatus-pink">
<span>!setStatus</span>
</div>
<p>Away</p>
</div>
<div class="tag tag-transaction">
<div class="transaction-green">
<span>!transaction</span>
</div>
<p>346 <span>ETH</span> </p>
</div>
<div class="tag tag-name">
<div class="name-brown">
<span>!name</span>
</div>
<p>Alex Petrov</p>
</div>
<div class="tag tag-password">
<div class="password-blue">
<span>!keypairPassword</span>
</div>
<div class="icon-lock"></div>
<p>********</p>
</div>
<div class="tag tag-location">
<div class="location-purple">
<span>!location</span>
</div>
<p>Two Bar Mountain,
<br>Maricopa County,
<br>AZ, US</p>
<div class="location-map"></div>
</div>
</div>
</div>
</div>
<div class="table-one-third table-bottom">
<div class="phone-odd">
<div class="phone-image phone-big">
<div class="phone-inner-image phone-big-image">
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="section-table section-white">
<div class="table-center">
<div class="table-wrapper">
<div class="table-right table-bottom">
<div class="phone-even">
<div class="phone-image phone-big no-float">
<div class="phone-inner-image phone-big-image-3">
</div>
</div>
</div>
</div>
<div class="table-left">
<div class="section-heading-even">
<h2>Buy and sell Ether nearby</h2>
<p>Find nearby Status users through our Discover feature. Exchange currency, services, and ideas to help grow the Ethereum community.</p>
<p class="statuses">Sample Statuses:</p>
</div>
<!-- Mobile Slider -->
<div class="mobile-slider">
<div class="swiper-container swiper2">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="mobile-block-square">
<div class="card-avatar avatar-wallet">
</div>
<h3>Jarrad</h3>
<p>Offering fiat to ether exchange services in <span class="hashtag">#Berlin #USDtoETH #localexchange</span></p>
</div>
</div>
<div class="swiper-slide">
<div class="mobile-block-square">
<div class="card-avatar avatar-etherwall">
</div>
<h3>Carl</h3>
<p>Trading <span class="hashtag">#BTCtoETH</span>. Smart contracts only. Reputable Trader. <span class="hashtag">#virtualexchange</span></p>
</div>
</div>
<div class="swiper-slide">
<div class="mobile-block-square">
<div class="card-avatar avatar-etheroll">
</div>
<h3>Dan</h3>
<p>Looking to buy <span class="hashtag">#DGDtoETH</span> or to chat about <span class="hashtag">#solidity</span> or <span class="hashtag">#serpent</span></p>
</div>
</div>
</div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
</div>
<!-- End Mobile Slider -->
<div class="white-blocks">
<div class="block-square">
<div class="card-avatar avatar-wallet">
</div>
<h3>Jarrad</h3>
<p>Offering fiat to ether exchange services in <span class="hashtag">#Berlin #USDtoETH #localexchange</span></p>
</div>
<div class="block-square">
<div class="card-avatar avatar-etherwall">
</div>
<h3>Carl</h3>
<p>Trading <span class="hashtag">#BTCtoETH</span>. Smart contracts only. Reputable Trader. <span class="hashtag">#virtualexchange</span></p>
</div>
<div class="block-square">
<div class="card-avatar avatar-etheroll">
</div>
<h3>Dan</h3>
<p>Looking to buy <span class="hashtag">#DGDtoETH</span> or to chat about <span class="hashtag">#solidity</span> or <span class="hashtag">#serpent</span></p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- <section class="section-table section-white">
<div class="table-center">
<div class="table-container">
<div class="table-two-third">
<div class="block block-blue">
<div class="block-blue-icon">
</div>
<h4>Say No to Censorship</h4>
<p>We believe in a free and open internet. Status is bringing back the transparent ideals the internet was founded upon.</p>
</div>
<div class="block block-purple">
<div class="block-purple-icon">
</div>
<h4>Blind-Trust Not Required</h4>
<p>Decentralized, distributed, peer-to-peer technologies solve the problem that has plagued humankind for millennia: Trust.</p>
</div>
<div class="block block-green">
<div class="block-green-icon">
</div>
<h4>Encrypted and Secure</h4>
<p>Guard your communication from prying eyes and malicious institutions with our military grade end-to-end encryption.</p>
</div>
<div class="block block-peach">
<div class="block-peach-icon">
</div>
<h4>Web 3.0 Stack</h4>
<p>Harness the benefits of Ethereum, and the Web 3.0 stack to solve the problems of server failure, undelivered messages, and information loss.</p>
</div>
</div>
<div class="table-one-third">
<div class="section-text-column">
<h2>Enter a bold new world, resistant to corruption.</h2>
<p>Status combines the next generation of browser, with an open messenging platform. This enables safe, free and open communication with humans and DApps alike.</p>
</div>
</div>
</div>
</div>
</section> -->
<section class="section-table section-gradient">
<div class="table-center">
<div class="table-wrapper">
<div class="gradient-text">
</div>
</div>
</div>
</div>
</section>
<footer>
<div class="container">
<div class="footer-wrapper">
<div class="footer-half">
<a class="footer-logo-mobile"></a>
<p>Status Platform
<br>Kemperplatz 1 Berlin, Germany
<br> support@status.im</p>
<div class="footer-icons-social">
<a href="https://github.com/status-im" class="footer-icon icon-email"></a>
<a href="https://twitter.com/ethstatus" class="footer-icon icon-twitter"></a>
<a href="https://www.facebook.com/ethstatus" class="footer-icon icon-facebook"></a>
</div>
</div>
<div class="footer-half">
<a class="footer-logo"></a>
<div class="footer-links">
<a href="http://slack.status.im/">Slack</a>
<a href="https://status-platform.workable.com/">Jobs</a>
<!-- <a href="#">Press</a> -->
<a href="https://github.com/status-im">Github</a>
</div>
</div>
</div>
</div>
</footer>
<script>
ga('send', 'pageview');
</script>
<!-- build:js js/main.min.js -->
<script type="text/javascript" src="js/libs.min.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<!-- endbuild -->
</body>
</html>