winkekatze.tv/assets/scss/_events.scss
2022-01-16 19:15:13 +01:00

102 lines
2.1 KiB
SCSS

div.events {
margin: 0 auto;
padding: 20px 30px;
background: transparent;
p {
color: $font_default;
font-size: $font_size_default;
}
a, a:link, a:visited {
text-decoration: none;
color: $font_accent_4;
}
a:hover, a:active {
color: $font_accent_3;
}
code {
color: $font_accent_4;
font-size: $font_size_code;
}
.headline a {
color: $font_accent_3;
font-size: $font_size_h2;
text-shadow: 0px 0px 1px black;
text-decoration: none;
}
.meta {
color: silver;
font-style: italic;
}
.blog-post {
background: rgba(128,128,128,0.15);
padding: 16px;
margin-top: 50px;
box-shadow: 0px 0px 2px 8px rgba(128,128,128,0.1);
}
h2 {
color: $font_accent_3;
text-shadow: 0px 0px 1px black;
}
img {
max-width: 94%;
margin: 3%;
box-shadow: 5px 5px 4px 3px grey;
}
}
@media (min-width: $large_view) {
div.events {
max-width: $large_min_width;
p {
font-size: $font_size_default_large;
}
.headline a {
font-size: $font_size_h2_large;
}
code {
font-size: $font_size_code_large;
}
img:hover {
box-shadow: 8px 8px 6px 5px silver;
}
}
}
@media (max-width: $mobile_view) {
div.events {
p {
font-size: $font_size_default_mobile;
}
img {
max-width: 98%;
margin: 1%;
box-shadow: 0px 0px 4px 4px rgba(128,128,128,0.6);
}
code {
font-size: $font_size_code_mobile;
}
.headline a {
font-size: $font_size_h2_mobile;
}
}
}
@media (max-width: $tiny_view) {
div.events {
p {
font-size: $font_size_default_tiny;
}
.headline a {
font-size: $font_size_h2_tiny;
}
}
}
@media (max-width: $pico_view) {
div.events {
.headline a {
font-size: $font_size_h2_pico;
}
}
}