design.status.im/index.html

344 lines
16 KiB
HTML
Executable File
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Status Design</title>
<link rel="stylesheet" href="./css/main.css">
</head>
<body>
<div class="overlay overlay--agreement">
<div class="popup popup--agreement">
<a class="popup__button popup__button--close"></a>
<h4 class="popup__title">Contribution Agreement & Terms and Conditions</h4>
<div class="popup__text">You must read and agree to the following information before you can proceed.</div>
</div>
</div>
<div class="home-cover">
<div class="header">
<div class="header-left">
<a class="logo" href="/"></a>
<ul class="main-nav">
<li><a href="#">Open Positions</a></li>
<li><a href="#">How We Work</a></li>
<li><a href="#">Who We Are</a></li>
</ul>
</div>
<ul class="secondary-nav">
<li><a href="#">About Status</a></li>
<li class="social-link social-link--twitter"><a href="#"></a></li>
<li class="social-link social-link--github"><a href="#"></a></li>
</ul>
</div>
<div class="pattern"></div>
<div class="intro">
<h1>Status is looking for designers</h1>
<p>Store, send & receive Eth and ERC-20 tokens with Status Store, send & receive Eth and ERC-20 tokens with Status HardwalletHardwallet</p>
<div class="intro-buttons">
<a class="button" href="">More about us</a>
<a class="button button--secondary" href="">Open positions</a>
</div>
</div>
</div>
<div class="home-wrap">
<div class="sections">
<div class="inner-header">
<h2>Our Workflow</h2>
<p>Store, send & receive Eth andStore, send & receive Eth and ERC-20 tokens Store, send & receive Eth and ERC-20 tokens with Status Hardwallet tokens Store, send & receive Eth and ERC-20 tokens with Status Hardwallet</p>
</div>
<div class="section section--odd section--one">
<div class="section__text">
<h2>Contactless transactions, built for&nbsp;mobile</h2>
<div class="text">
<p>With NFC & Bluetooth, you can now use the Status Hardwallet combined with your mobile device to approve & send payments.</p>
</div>
</div>
<div class="section__image">
<div class="swarms">
<div class="swarm">
<div class="circle circle--big"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle circle--transparent"><div class="circle-inner"></div></div>
<div class="circle circle--transparent"><div class="circle-inner"></div></div>
<div class="circle circle--transparent"><div class="circle-inner"></div></div>
</div>
<div class="swarm">
<div class="circle circle--big"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle circle--transparent"><div class="circle-inner"></div></div>
<div class="circle circle--transparent"><div class="circle-inner"></div></div>
</div>
<div class="swarm">
<div class="circle circle--big"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle"><div class="circle-inner"></div></div>
<div class="circle circle--transparent"><div class="circle-inner"></div></div>
<div class="circle circle--transparent"><div class="circle-inner"></div></div>
<div class="circle circle--transparent"><div class="circle-inner"></div></div>
</div>
</div>
</div>
</div>
<div class="section section--even section--two">
<div class="section__text">
<h2>Safer by design</h2>
<div class="text">
<p>Forget leaving your assets in the vulnerable hands of exchanges or hot wallets online. Isolate your private keys into the safety of your Status Hardwallet offline.</p>
</div>
</div>
<div class="section__image">
<svg class="bubbles" width="450" height="450" viewBox="-225 -225 450 450"></svg>
</div>
</div>
<div class="section section--odd section--three">
<div class="section__text">
<h2>Transactions with Eth and most tokens</h2>
<div class="text">
<p>Status Hardwallet is built to be compatible with all major cryptocurrencies including Eth and ERC-20 token tokens.</p>
</div>
</div>
<div class="section__image">
<div class="areas">
<div class="area-logo"></div>
<div class="area"><div class="area-inner"><div class="area-dot"></div></div></div>
<div class="area"><div class="area-inner"><div class="area-dot"></div></div></div>
<div class="area"><div class="area-inner"><div class="area-dot"></div></div></div>
<div class="area"><div class="area-inner"><div class="area-dot"></div></div></div>
</div>
</div>
</div>
</div>
<!-- div class="positions">
<h4>Open Positions <span>8</span></h4>
<div class="positions-wrap">
<div class="positions-item">
<div class="positions-item-background"></div>
<div class="positions-item-inner">
<div class="positions-item-top">
<h2>UI/UX Designer</h2>
<p>Store, send & receive Eth and ERC-20 tokens with Status Hardwallet</p>
</div>
<div class="reward">
<p class="reward-description">Bonus for a recommendation<br/>$1000 value</p>
<div class="reward-amount">
<span class="reward-amount-text">
<span class="number">10K</span>
<span class="currency">SNT</span>
</span>
</div>
</div>
</div>
</div>
<div class="positions-item">
<div class="positions-item-background"></div>
<div class="positions-item-inner">
<div class="positions-item-top">
<h2>UI/UX Designer</h2>
<p>Store, send & receive Eth and ERC-20 tokens with Status Hardwallet</p>
</div>
<div class="reward">
<p class="reward-description">Bonus for a recommendation<br/>$1000 value</p>
<div class="reward-amount">
<span class="reward-amount-text">
<span class="number">10K</span>
<span class="currency">SNT</span>
</span>
</div>
</div>
</div>
</div>
<div class="positions-item">
<div class="positions-item-background"></div>
<div class="positions-item-inner">
<div class="positions-item-top">
<h2>UI/UX Designer</h2>
<p>Store, send & receive Eth and ERC-20 tokens with Status Hardwallet</p>
</div>
<div class="reward">
<p class="reward-description">Bonus for a recommendation<br/>$1000 value</p>
<div class="reward-amount">
<span class="reward-amount-text">
<span class="number">10K</span>
<span class="currency">SNT</span>
</span>
</div>
</div>
</div>
</div>
<div class="positions-item">
<div class="positions-item-background"></div>
<div class="positions-item-inner">
<div class="positions-item-top">
<h2>UI/UX Designer</h2>
<p>Store, send & receive Eth and ERC-20 tokens with Status Hardwallet</p>
</div>
<div class="reward">
<p class="reward-description">Bonus for a recommendation<br/>$1000 value</p>
<div class="reward-amount">
<span class="reward-amount-text">
<span class="number">10K</span>
<span class="currency">SNT</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div-->
<div class="section-header">
<h2>Who We Are</h2>
<p>Store, send & receive Eth andStore, send & receive Eth and ERC-20 tokens Store, send & receive Eth and ERC-20 tokens with Status Hardwallet tokens Store, send & receive Eth and ERC-20 tokens with Status Hardwallet</p>
</div>
<div class="people">
<div class="person">
<div class="person-inner">
<h3>Denis Sharypin</h3>
<p>UI/UX Designer</p>
<div class="person-image person--denis"></div>
</div>
</div>
<div class="person">
<div class="person-inner">
<h3>Denis Sharypin</h3>
<p>UI/UX Designer</p>
<div class="person-image person--pat"></div>
</div>
</div>
<div class="person">
<div class="person-inner">
<h3>Denis Sharypin</h3>
<p>UI/UX Designer</p>
<div class="person-image person--hester"></div>
</div>
</div>
<div class="person">
<div class="person-inner">
<h3>Denis Sharypin</h3>
<p>UI/UX Designer</p>
<div class="person-image person--euge"></div>
</div>
</div>
<div class="person">
<div class="person-inner">
<h3>Denis Sharypin</h3>
<p>UI/UX Designer</p>
<div class="person-image person--andrei"></div>
</div>
</div>
<div class="person person--extra">
<div class="person-inner">
</div>
</div>
</div>
<div class="section-header">
<h2>Read our Blog</h2>
<p>Store, send & receive Eth andStore, send & receive Eth and ERC-20 tokens Store, send & receive Eth and ERC-20 tokens with Status Hardwallet tokens Store, send & receive Eth and ERC-20 tokens with Status Hardwallet</p>
</div>
<div class="blog-posts">
<div class="blog-post">
<div class="blog-post-inner">
<h3>Status to host first team offsite in Thailand</h3>
<p>Join usin Bangkok or onlineas we come together to plan the future of Status</p>
<a href="#">Read more</a>
</div>
</div>
<div class="blog-post">
<div class="blog-post-inner">
<h3>Status Alpha 0.9.17 Release Notes</h3>
<p>0.9.17</p>
<a href="#">Read more</a>
</div>
</div>
<div class="blog-post">
<div class="blog-post-inner">
<h3>Securing the Path to Beta</h3>
<p>Leading security expert Déjà Vu Security engaged to ready Status Beta</p>
<a href="#">Read more</a>
</div>
</div>
</div>
<div class="section-header">
<h2>Follow Us</h2>
<p>Store, send & receive Eth andStore, send & receive Eth and ERC-20 tokens Store, send & receive Eth and ERC-20 tokens with Status Hardwallet tokens Store, send & receive Eth and ERC-20 tokens with Status Hardwallet</p>
</div>
<div class="social-blocks">
<div class="social-block">
<div class="social-block-inner">
<div class="social-block-logo social-block-logo--one"></div>
<p>Store, send & receive Eth andStore, send & receive Eth and ERC-20 tokens Store, send & receive Eth</p>
</div>
</div>
<div class="social-block">
<div class="social-block-inner">
<div class="social-block-logo social-block-logo--two"></div>
<p>Store, send & receive Eth andStore, send & receive Eth and ERC-20 tokens Store, send & receive Eth</p>
</div>
</div>
<div class="social-block">
<div class="social-block-inner">
<div class="social-block-logo social-block-logo--three"></div>
<p>Store, send & receive Eth andStore, send & receive Eth and ERC-20 tokens Store, send & receive Eth</p>
</div>
</div>
</div>
</div>
<div class="footer">
<div class="footer-inner">
<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--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>
<li class="footer-link footer-link--yt"><a href="https://www.youtube.com/channel/UCFzdJTUdzqyX4e9dOW7UpPQ/" target="_blank"><span class="footer-icon"></span><span class="footer-link-label">YouTube</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>
<li class="footer-link"><a href="https://status.im/jobs.html" target="_blank">Jobs</a></li>
</ul>
</div>
</div>
<div class="footer-logo-wrap">
<div class="footer-logo-wrap__inner">
<div class="footer-logo"></div>
<div class="footer-address">Status Research & Development GmbH<br/>Baarerstrasse 10<br/>Zug, Switzerland</div>
</div>
</div>
</div>
</div>
<script src="./js/bundle.js"></script>
</body>
</html>