status-im
/
design.status.im
mirror of https://github.com/status-im/design.status.im.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

minor changes

This commit is contained in:
andmironov 2018-05-07 16:20:58 +03:00
parent fce8e46490
commit fedff83249
3 changed files with 71 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
css/main.css
View File

@ -685,7 +685,7 @@ select[multiple] {
.bubbles-wrap .bubbles {
transform: scale(0.8);
left: -95px;
top: -95px; } }
top: -75px; } }
.areas {
position: absolute;
@ -1708,12 +1708,16 @@ input[type=checkbox] {
align-items: center;
padding: 32px 0 75px 0; }
.footer-logo {
a.footer-logo {
display: block;
width: 52px;
height: 52px;
background-size: 52px;
background-image: url(../img/footer-logo.svg); }
a.footer-logo:hover {
opacity: .8; }
.footer-address {
color: #FFFFFF;
padding: 20px 0 0 0;
@ -1828,7 +1832,7 @@ input[type=checkbox] {
margin: 0 0 10px 0; }
.footer-logo-wrap__inner {
width: 100%;
padding: 0 0 40px 0;
padding: 32px 0 40px 0;
align-items: center;
text-align: center; }
.footer-link {
@ -1840,8 +1844,6 @@ input[type=checkbox] {
justify-content: center;
text-align: center; }
.footer-icon {
display: none; }
.footer-logo {
display: none; } }
body {
@ -1988,6 +1990,40 @@ a:visited {
width: 300px;
height: 300px; }
.section-link-wrap {
display: flex;
align-items: center;
margin: 16px 0 0 0; }
a.section-link {
display: block;
color: #4360DF;
text-decoration: none;
padding: 0 8px 0 0; }
a.section-link-icon {
display: block;
width: 24px;
height: 24px;
border-radius: 50%;
background-color: rgba(67, 96, 223, 0.1);
background-image: url(../img/link-arrow.svg);
background-size: 24px;
background-position: center;
background-repeat: no-repeat;
opacity: 0;
transform: scale(0.1);
transition: transform 0.6s cubic-bezier(0.25, 0.46, 0, 1.105), opacity 0.4s ease; }
.section__text .text:hover a.section-link-icon {
opacity: 1;
transform: scale(1); }
.section-link-wrap:hover a.section-link-icon {
opacity: 1;
transform: scale(1);
background-color: rgba(67, 96, 223, 0.14); }
.section:nth-child(odd) .section__text {
order: 1; }
@ -2008,7 +2044,7 @@ a:visited {
font-size: 22px; }
.section {
width: 100%;
height: 500px;
height: 520px;
padding: 0 24px;
flex-direction: column;
padding: 0;
@ -2021,11 +2057,16 @@ a:visited {
font-size: 20px;
line-height: 24px;
margin: 0 0 4px 0; }
.section-link-wrap {
justify-content: center; }
a.section-link-icon {
opacity: 1;
transform: scale(1); }
.section .section__text {
order: 1; }
.section .section__image {
order: 0;
margin: 32px 0 0 0; } }
margin: 12px 0 0 0; } }
@media (max-width: 640px) {
.inner-header {
@ -2038,4 +2079,4 @@ a:visited {
padding: 16px 32px 32px; }
.section__image {
width: 260px;
height: 260px; } }
height: 300px; } }

1
img/link-arrow.svg Normal file
View File

@ -0,0 +1 @@
<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg"><path d="M15.377 12.807l-4.068 4.067a.999.999 0 1 1-1.414-1.414l3.377-3.377-3.377-3.376a.999.999 0 1 1 1.414-1.415l4.068 4.068a1 1 0 0 1 .288.827 1 1 0 0 1-.288.62z" fill="#4360DF" fill-rule="evenodd"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 271 B

33
index.html
View File

@ -6,14 +6,14 @@
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/png" href="./img/logo-16.png?v=0.0.8" sizes="16x16" />
<link rel="icon" type="image/png" href="./img/logo-32.png?v=0.0.8" sizes="32x32" />
<link rel="icon" type="image/png" href="./img/logo-16.png?v=0.0.91" sizes="16x16" />
<link rel="icon" type="image/png" href="./img/logo-32.png?v=0.0.91" sizes="32x32" />
<link rel="apple-touch-icon" sizes="76x76" href="./img/apple-touch-icon-76.png?v=0.0.8">
<link rel="apple-touch-icon" sizes="120x120" href="./img/apple-touch-icon-120.png?v=0.0.8">
<link rel="apple-touch-icon" sizes="152x152" href="./img/apple-touch-icon-152.png?v=0.0.8">
<link rel="apple-touch-icon" sizes="180x180" href="./img/apple-touch-icon-180.png?v=0.0.8">
<link rel="apple-touch-icon" href="./img/apple-touch-icon-1024.png?v=0.0.8">
<link rel="apple-touch-icon" sizes="76x76" href="./img/apple-touch-icon-76.png?v=0.0.91">
<link rel="apple-touch-icon" sizes="120x120" href="./img/apple-touch-icon-120.png?v=0.0.91">
<link rel="apple-touch-icon" sizes="152x152" href="./img/apple-touch-icon-152.png?v=0.0.91">
<link rel="apple-touch-icon" sizes="180x180" href="./img/apple-touch-icon-180.png?v=0.0.91">
<link rel="apple-touch-icon" href="./img/apple-touch-icon-1024.png?v=0.0.91">
<title>Status Design</title>
<meta name="description" content="We’re the Status Design team and we are helping create the tools for a more open and equitable internet for all of us">
@ -22,16 +22,16 @@
<meta property="og:title" content="Status Design"/>
<meta property="og:description" content="We’re the Status Design team and we are helping create the tools for a more open and equitable internet for all of us" />
<meta property="og:type" content="article" />
<meta property="og:image" content="https://design.status.im/img/status-design-share?v=0.0.8" />
<meta property="og:image" content="https://design.status.im/img/status-design-share?v=0.0.91" />
<!-- Twitter -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@ethstatus" />
<meta name="twitter:title" content="Status Design" />
<meta name="twitter:description" content="We’re the Status Design team and we are helping create the tools for a more open and equitable internet for all of us" />
<meta name="twitter:image" content="https://design.status.im/img/status-design-share-twitter.png?v=0.0.8" />
<meta name="twitter:image" content="https://design.status.im/img/status-design-share-twitter.png?v=0.0.91" />
<link rel="stylesheet" href="./css/main.css?v=0.0.8">
<link rel="stylesheet" href="./css/main.css?v=0.0.91">
</head>
<body>
@ -285,6 +285,10 @@
<h2>Swarms</h2>
<div class="text">
<p>We are an entirely decentralised and transparent organization, where teams are funded by anybody with a valuable idea. As designers, we help bring these ideas to life in a highly open and collaborative environment.</p>
<div class="section-link-wrap">
<a class="section-link" href="https://ideas.status.im/all" target="_blank">View Active Swarms</a>
<a class="section-link-icon" href="https://ideas.status.im/all" target="_blank"></a>
</div>
</div>
</div>
<div class="section__image">
@ -328,6 +332,7 @@
<h2>Objectives and Key Results</h2>
<div class="text">
<p>Our team has ambitious and sometimes uncomfortable goals. We set our OKRs in order to have a direction, stay focused and measure our progress.</p>
<!-- a class="section-link" href="https://status.im" target="_blank">Storage</a -->
</div>
</div>
<div class="section__image">
@ -341,6 +346,10 @@
<h2>Status Open Bounty</h2>
<div class="text">
<p>We create products together with the help of the community. Status Open Bounty is the space where commited open source developers and fellow designers contribute and get rewarded for it.</p>
<div class="section-link-wrap">
<a class="section-link" href="http://openbounty.status.im/" target="_blank">Status Open Bounty</a>
<a class="section-link-icon" href="http://openbounty.status.im/" target="_blank"></a>
</div>
</div>
</div>
<div class="section__image">
@ -562,13 +571,13 @@
</div>
<div class="footer-logo-wrap">
<div class="footer-logo-wrap__inner">
<div class="footer-logo"></div>
<a class="footer-logo" href="https://status.im" target="_blank"></a>
<div class="footer-address">Status Research & Development GmbH<br/>Baarerstrasse 10<br/>Zug, Switzerland</div>
</div>
</div>
</div>
</div>
<script src="./js/bundle.js?v=0.0.8"></script>
<script src="./js/bundle.js?v=0.0.91"></script>
</body>
</html>