alex.racine/themes/portfoliGor/assets/scss/_layout.scss

88 lines
1.2 KiB
SCSS

//////////////////
// //
// LAYOUT //
// //
//////////////////
body {
display: flex;
flex-direction: column;
height: 100vh;
margin: 0 auto 0 auto;
}
.body-fixed {
position: fixed;
width: 100%;
}
main.container {
flex-grow: 1;
max-width: $content-max-width;
margin: 5rem auto 0 auto;
h2 {
text-align: center;
}
.post-info {
margin-bottom: 1rem;
}
}
main.home {
height: 100%;
}
.content {
@include breakpoint(laptop) {
margin: 0 1rem 0 1rem;
}
@include breakpoint(tablet) {
margin: 0 1rem 0 1rem;
}
@include breakpoint(mobile) {
margin: 0 1rem 0 1rem;
}
}
.home-info {
position: relative;
top: 30%;
text-align: center;
letter-spacing: -0.05em;
font-weight: bold;
color: white;
@include breakpoint(small-height-desktop) {
top: 20%;
}
h1 {
font-size: 2.25em;
line-height: 1em;
}
p {
margin-top: -1em;
font-size: .8em;
}
}
.home-info.pushed-down {
margin-top: 12rem;
}
.pushed-down {
flex-grow: 1;
max-width: $content-max-width;
margin: 24rem auto 0 auto;
@include breakpoint(small-mobile) {
margin: 26rem auto 0 auto;
}
h2 {
text-align: center;
}
}