commit
ebe9d49e1c
|
@ -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;
|
||||||
|
|
|
@ -54,6 +54,11 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
<div class="news">
|
||||||
|
<div class="news-inner">
|
||||||
|
<strong>Hey</strong> Welcome to Status Open Bounty <a href="#" target="_blank">Learn more</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="container-wrap">
|
<div class="container-wrap">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
|
|
|
@ -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;
|
||||||
|
|
|
@ -54,6 +54,11 @@
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
<div class="news">
|
||||||
|
<div class="news-inner">
|
||||||
|
<strong>Hey</strong> Welcome to Status Open Bounty <a href="#" target="_blank">Learn more</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="container-wrap">
|
<div class="container-wrap">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
|
|
|
@ -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";
|
||||||
|
|
|
@ -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;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue