Landing page fixes

This commit is contained in:
andmironov 2017-11-01 19:01:40 -05:00
parent 1f48c9970e
commit b406f3964b
6 changed files with 158 additions and 0 deletions

View File

@ -777,6 +777,52 @@ li.social-link a {
-ms-transform: scale(0.9); -ms-transform: scale(0.9);
transform: scale(0.9); } } transform: scale(0.9); } }
.news {
width: 100%;
font-size: 15px;
line-height: 22px;
padding: 16px 0;
background: #8AEBAC;
color: rgba(0, 0, 0, 0.6);
text-align: center; }
.news strong {
font-family: "PostGrotesk-Medium", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; }
.news.news--dark {
background-color: #4A5C69;
color: #FFFFFF; }
.news.news--finish {
background-color: #eef2f5;
color: #49555F; }
.news.news--hidden {
display: none; }
.news a {
display: inline-block;
padding: 2px 12px;
border-radius: 8px;
color: #49555F;
background-color: rgba(0, 0, 0, 0.1);
margin: 0 0 0 12px;
transition: background-color .2s ease, color .2s ease; }
.news a:hover {
background-color: rgba(255, 255, 255, 0.8); }
@media (max-width: 600px) {
.news {
padding: 6px 16px; }
.news a {
font-family: "PostGrotesk-Medium", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
display: inline;
background-color: transparent;
padding: 0;
margin: 0;
text-decoration: underline; } }
.cards { .cards {
position: relative; position: relative;
width: 300px; width: 300px;

View File

@ -54,6 +54,11 @@
</head> </head>
<body> <body>
<div class="news">
<div class="news-inner">
<strong>Hey</strong> Welcome to Status Open Bounty&nbsp;<a href="#" target="_blank">Learn&nbsp;more</a>
</div>
</div>
<div class="container-wrap"> <div class="container-wrap">
<div class="container"> <div class="container">
<div class="header"> <div class="header">

View File

@ -777,6 +777,52 @@ li.social-link a {
-ms-transform: scale(0.9); -ms-transform: scale(0.9);
transform: scale(0.9); } } transform: scale(0.9); } }
.news {
width: 100%;
font-size: 15px;
line-height: 22px;
padding: 16px 0;
background: #8AEBAC;
color: rgba(0, 0, 0, 0.6);
text-align: center; }
.news strong {
font-family: "PostGrotesk-Medium", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; }
.news.news--dark {
background-color: #4A5C69;
color: #FFFFFF; }
.news.news--finish {
background-color: #eef2f5;
color: #49555F; }
.news.news--hidden {
display: none; }
.news a {
display: inline-block;
padding: 2px 12px;
border-radius: 8px;
color: #49555F;
background-color: rgba(0, 0, 0, 0.1);
margin: 0 0 0 12px;
transition: background-color .2s ease, color .2s ease; }
.news a:hover {
background-color: rgba(255, 255, 255, 0.8); }
@media (max-width: 600px) {
.news {
padding: 6px 16px; }
.news a {
font-family: "PostGrotesk-Medium", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
display: inline;
background-color: transparent;
padding: 0;
margin: 0;
text-decoration: underline; } }
.cards { .cards {
position: relative; position: relative;
width: 300px; width: 300px;

View File

@ -54,6 +54,11 @@
</head> </head>
<body> <body>
<div class="news">
<div class="news-inner">
<strong>Hey</strong> Welcome to Status Open Bounty&nbsp;<a href="#" target="_blank">Learn&nbsp;more</a>
</div>
</div>
<div class="container-wrap"> <div class="container-wrap">
<div class="container"> <div class="container">
<div class="header"> <div class="header">

View File

@ -4,6 +4,7 @@
@import "page"; @import "page";
@import "welcome"; @import "welcome";
@import "news";
@import "cards"; @import "cards";
@import "actions"; @import "actions";
@import "slides"; @import "slides";

View File

@ -0,0 +1,55 @@
.news {
width: 100%;
font-size: 15px;
line-height: 22px;
padding: 16px 0;
background: #8AEBAC;
color: rgba(0, 0, 0, .6);
text-align: center;
}
.news strong {
font-family: $PostGroteskMedium;
}
.news.news--dark {
background-color: #4A5C69;
color: #FFFFFF;
}
.news.news--finish {
background-color: $colorBg;
color: #49555F;
}
.news.news--hidden {
display: none;
}
.news a {
display: inline-block;
padding: 2px 12px;
border-radius: 8px;
color: #49555F;
background-color: rgba(0, 0, 0, .1);
margin: 0 0 0 12px;
transition: background-color .2s ease, color .2s ease;
}
.news a:hover {
background-color: rgba(255, 255, 255, .8);
}
@media (max-width: 600px) {
.news {
padding: 6px 16px;
}
.news a {
font-family: $PostGroteskMedium;
display: inline;
background-color: transparent;
padding: 0;
margin: 0;
text-decoration: underline;
}
}