This commit is contained in:
Jarrad 2016-06-09 13:57:49 +02:00
commit 0b991af096
2 changed files with 495 additions and 39 deletions

397
build/index.html Executable file
View File

@ -0,0 +1,397 @@
<!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">
<link rel="stylesheet" href="css/main.min.css">
</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>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 class="status-email">
<div class="email">
<input type="email" class="email-input" placeholder="Enter your email for updates">
<div class="email-button"></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">
<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>
<script src="js/main.min.js"></script>
</body>
</html>

View File

@ -57,11 +57,11 @@
<div class="status">
<div class="status-text">
<h1>Status</h1>
<p>Help us shape the way towards a better, brighter internet. With Status you can interact with the web in new and exciting ways.</p>
<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 class="status-email">
<div class="email">
<input type="email" class="email-input" placeholder="Leave Your email">
<input type="email" class="email-input" placeholder="Enter your email for updates">
<div class="email-button"></div>
</div>
</div>
@ -81,28 +81,28 @@
</div>
</div>
</div>
<!--
<div class="table-row">
<div class="block block-white">
<div class="block1-icon">
</div>
<h3>Explore Decentralized Applications</h3>
<p>Status is a DApps browser for a brave new ecosystem. Your wallet, keys and identity can now live on the Blockchain.</p>
<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 Conversations</h3>
<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>Connect with Web 3.0</h3>
<p>Discover other members of the community who understand the benefits the blockchain will bring, and share ideas.</p>
</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>
@ -117,8 +117,8 @@
<div class="table-wrapper">
<div class="table-left">
<div class="section-heading-even">
<h2>Browse and Interact with Decentralized Applications</h2>
<p>Decentralized applications will form the foundation of a whole new economy, and change the way we trade and communicate. <br><br>Imagine a future where a decentralized world is at your fingertips. Whether it be starting a company, ordering a taxi, renting a holiday home, or investing in your retimement, Status wants to make this possible.</p>
<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>
@ -183,9 +183,8 @@
<div class="table-two-third">
<div class="section-heading-odd">
<h2>Have more meaningful conversations</h2>
<p>Integrate smart contracts and the benefits of the blockchain into your daily life.
<br><br>Send payments to friends directly from within chats. <br>Without borders, and without fees.<br></p>
<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">
@ -240,39 +239,51 @@
<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 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>
<h4>Say No to Censorship</h4>
<p>We believe in a free and open internet. We are an open source project bringing back the transparent ideals the internet was founded upon.</p>
<div class="white-blocks">
<div class="block-square">
<div class="card-avatar avatar-wallet">
</div>
<div class="block block-purple">
<div class="block-purple-icon">
<h3>Jarrad</h3>
<p>Offering fiat to ether exchange services in Berlin #USDtoETH #localexchange</p>
</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 class="block-square">
<div class="card-avatar avatar-etherwall">
</div>
<div class="block block-green">
<div class="block-green-icon">
<h3>Carl</h3>
<p>Trading #BTCtoETH. Smart contracts only. Reputable Trader. #virtualexchange</p>
</div>
<h4>Encrypted and Secure</h4>
<p>Guard your communication from prying eyes and malicious institutions with our military grade open source, end-to-end encryption.</p>
<div class="block-square">
<div class="card-avatar avatar-etheroll">
</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>
<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 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. Enabling natural communication with autonomous entities and humans alike.</p>
</div>
</div>
</div>
@ -286,13 +297,61 @@
<!-- <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. Enter your email below to be added to the private wait list. We respect privacy.</p>
<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">
@ -322,7 +381,7 @@
</div>
</div>
<div class="footer-half">
<a href="#" class="footer-logo"></a>
<a class="footer-logo"></a>
<div class="footer-links">
<a href="#">Team</a>
<a href="#">Jobs</a>