jonnybarnes.uk/resources/sass/_layout-main.scss
Jonny Barnes 980f2e14d7 Mobile changes:
- Header layout fixed
  - Improved markup for better click region of header
  - reduced width of search input on mobile
2020-02-21 18:57:44 +00:00

101 lines
1.5 KiB
SCSS
Vendored

body {
display: flex;
flex-direction: column;
}
#top-header {
display: flex;
flex-direction: column;
justify-content: center;
h1 {
width: 100%;
text-align: center;
}
nav {
display: flex;
justify-content: center;
flex-wrap: wrap;
a {
margin: 0 0.5rem;
}
}
}
.h-feed {
display: flex;
flex-direction: column;
margin: auto;
img {
max-width: 100%;
}
@media screen and (min-width: 700px) {
max-width: 700px;
> .note,
> .h-entry {
padding: 0 1rem;
}
}
@media screen and (max-width: 699px) {
margin-left: 5px;
margin-right: 5px;
}
}
.note {
display: flex;
flex-direction: column;
.note-metadata {
display: flex;
flex-direction: row;
justify-content: space-between;
.syndication-links {
svg {
height: 1em;
width: 1em;
}
}
}
> .e-content {
> .naked-link {
.u-photo {
margin: 2rem 0;
}
}
}
}
.personal-bio {
padding: 0 2rem;
}
footer {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 1.5rem;
input {
@media screen and (max-width: 699px) {
max-width: 95vw;
}
}
.iwc-logo {
max-width: 100%;
}
@media screen and (max-width: 699px) {
margin-left: 5px;
margin-right: 5px;
}
}