website/_sass/banners.scss

38 lines
697 B
SCSS

@mixin large {
@media screen and (min-width: #{$large-breakpoint}) {
@content;
}
}
@mixin small {
@media screen and (max-width: #{$large-breakpoint}) {
@content;
}
}
.ribbonbanner {
@include large {
padding: 10px 55px;
transform: rotate(-45deg);
top: 28px;
left: -60px;
width: 250px;
}
@include small {
padding: 3px 0;
top: 0px;
width: 100%;
}
text-align: center;
position: absolute;
color: $header-heading-color;
background-color: $header-bg-color;
box-shadow: 0 0 3px rgba(0,0,0,0.3);
a {
color: $header-heading-color;
text-decoration: underline;
}
}