UX: Improve mobile view for the new /about page (#28406)

This commit makes the new /about page look better on mobile.
This commit is contained in:
Osama Sayegh 2024-08-17 03:44:18 +03:00 committed by GitHub
parent 5e91233ca9
commit 2f8dc64caf
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 27 additions and 5 deletions

View File

@ -1,8 +1,16 @@
.about {
&__main-content {
display: grid;
grid-template-columns: 2.5fr 1fr;
column-gap: 2em;
display: flex;
flex-wrap: wrap;
gap: 2em;
max-width: 1100px;
}
&__left-side {
flex: 1 1 650px;
}
&__right-side {
flex: 1 2 200px;
}
&__stats {
@ -11,11 +19,25 @@
border-bottom: 1px solid var(--primary-low);
padding: 1em 1em;
margin-bottom: 1em;
@include breakpoint(tablet) {
flex-direction: column;
}
.d-icon {
margin-right: 3px;
}
}
&__stats-item {
flex-grow: 1;
flex-basis: 0;
flex: 1 0 fit-content;
@include breakpoint(tablet) {
margin-bottom: 1em;
&:last-child {
margin-bottom: 0;
}
}
}
&__banner {