posts + members pages responsive mobile

This commit is contained in:
Yves Gatesoupe 2020-07-17 16:17:11 +02:00
parent 1e9b6f6d5f
commit 6da83b2d89
7 changed files with 68 additions and 11 deletions

View File

@ -18,7 +18,9 @@
</li> </li>
</ul> </ul>
</div> </div>
{% include "partials/components//posts-list.njk" %} <section class="[ news-list wrapper ]">
{% include "partials/components/posts-list.njk" %}
</section>
{% include "partials/components/contact-form.njk" %} {% include "partials/components/contact-form.njk" %}
</main> </main>
{% endblock %} {% endblock %}

View File

@ -18,7 +18,9 @@
</li> </li>
</ul> </ul>
</div> </div>
{% include "partials/components//posts-list.njk" %} <section class="[ news-list wrapper ]">
{% include "partials/components/posts-list.njk" %}
</section>
{% include "partials/components/contact-form.njk" %} {% include "partials/components/contact-form.njk" %}
</main> </main>
{% endblock %} {% endblock %}

View File

@ -51,3 +51,19 @@
} }
} }
} }
@media (max-width: 575.98px) {
.member-list {
&__heading {
margin: 4rem 0;
}
&__items {
display: block;
}
&__item + &__item {
margin-top: 3rem;
}
}
}

View File

@ -63,3 +63,18 @@
} }
} }
} }
@media (max-width: 575.98px) {
.member {
margin-top: 3rem;
margin-bottom: 8rem;
&__wrapper {
display: block;
}
&__bio {
margin-top: 8rem;
}
}
}

View File

@ -338,7 +338,6 @@
font-size: 1.75rem; font-size: 1.75rem;
} }
.split-content { .split-content {
display: block; display: block;
} }
@ -368,6 +367,10 @@
} }
} }
} }
.post-info {
align-self: flex-start;
}
} }
} }
} }

View File

@ -88,15 +88,11 @@
} }
&__items { &__items {
display: flex; display: block;
overflow-y: auto;
padding-bottom: 1rem;
padding-left: 1.25rem;
} }
&__item { &__item + &__item {
flex-shrink: 0; margin-top: 1.5rem;
flex-basis: 16rem;
} }
} }
@ -120,9 +116,17 @@
} }
&__items { &__items {
display: flex;
overflow-y: auto;
padding-bottom: 1rem;
padding-left: 1.25rem; padding-left: 1.25rem;
} }
&__item {
flex-shrink: 0;
flex-basis: 16rem;
}
.return-link { .return-link {
margin-right: 1.25rem; margin-right: 1.25rem;
} }

View File

@ -12,7 +12,10 @@
li { li {
display: inline-block; display: inline-block;
margin-left: 1.5rem;
+ li {
margin-left: 1.5rem;
}
a { a {
font-weight: 600; font-weight: 600;
@ -26,3 +29,15 @@
} }
} }
} }
@media (max-width: 575.98px) {
.posts {
h1 {
font-size: 1.75rem;
}
.post-filter {
align-self: flex-start;
}
}
}