Skip to content

Instantly share code, notes, and snippets.

@dyarfi
Created August 23, 2021 10:14
Show Gist options
  • Save dyarfi/c46c9d7984c986d749d7e98f0fef211f to your computer and use it in GitHub Desktop.
Save dyarfi/c46c9d7984c986d749d7e98f0fef211f to your computer and use it in GitHub Desktop.
magazine_layout.scss
@import "https://fonts.googleapis.com/css?family=Playfair+Display:300,400,600,700,900";
body {
font-size: .95rem;
}
h1,h2,h3,h4,h4 {
font-family: 'Playfair Display', sans-serif;
font-weight: 900;
}
.content {
&:first-letter {
float: left;
text-transform: uppercase;
font-size: 4rem;
margin-right: .75rem;
padding: 0;
line-height: .9;
font-family: 'Playfair Display', sans-serif;
font-weight: 900;
}
}
.img-headline {
position: absolute;
text-align: center;
bottom: 0;
right: 0;
left: 0;
color: white;
font-family: 'Playfair Display', sans-serif;
font-weight: 800;
font-size: 3.25rem;
padding-top: 1rem;
padding-bottom: 1rem;
background: linear-gradient(to top,rgba(50,55,59,.75),rgba(50,55,59,0));
}
.ilist-c {
filter: none;
transition: .5s ease;
&:hover {
filter: contrast(1.12);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment