Mobile: author page style fixes

This commit is contained in:
kvakazyambra 2023-09-21 23:44:41 +03:00
parent 097157288b
commit bfc6599149
2 changed files with 49 additions and 9 deletions

View File

@ -2,12 +2,16 @@
align-items: flex-start;
display: flex;
flex-flow: row nowrap;
margin-bottom: 2.4rem;
margin-bottom: 1.6rem;
&:last-child {
margin-bottom: 0;
}
@include media-breakpoint-up(md) {
margin-bottom: 2.4rem;
}
@include media-breakpoint-down(lg) {
flex-wrap: wrap;
}
@ -21,22 +25,25 @@
display: flex;
}
&.authorDetailsShrinked {
flex: 0 0 auto;
}
@include media-breakpoint-down(sm) {
flex-wrap: wrap;
}
@include media-breakpoint-down(md) {
text-align: center;
}
@include media-breakpoint-between(md, lg) {
flex-wrap: wrap;
}
&.authorDetailsShrinked {
flex: 0 0 auto;
}
}
.authorDetailsWrapper {
flex: 1 0;
padding-right: 1em;
@include media-breakpoint-up(sm) {
flex: 1;
@ -226,6 +233,10 @@
margin-right: 0.5em;
width: 9em;
&:first-of-type {
margin-left: 0;
}
&:last-child {
margin-right: 0;
}
@ -249,13 +260,21 @@
.authorSubscribeSocial {
align-items: center;
display: flex;
margin: 0 0.8rem 1.6rem;
margin: 0 0.8rem 2rem;
@include media-breakpoint-down(sm) {
flex: 1 100%;
justify-content: center;
margin-top: 1em;
}
@include media-breakpoint-down(md) {
justify-content: center;
}
a:link {
border: none;
}
}
.buttonSubscribe {
@ -449,23 +468,36 @@
display: flex;
flex-wrap: wrap;
font-size: 1.4rem;
margin-top: 1em;
margin-top: 0.5rem;
@include media-breakpoint-down(md) {
justify-content: center;
}
}
.subscribers {
align-items: center;
cursor: pointer;
display: inline-flex;
margin-top: 1rem;
margin-right: 3rem;
vertical-align: top;
&:last-child {
margin-right: 0;
}
.userpic {
background: var(--background-color);
box-shadow: 0 0 0 2px var(--background-color);
height: 1.8rem;
min-width: 1.8rem;
max-width: 1.8rem;
vertical-align: top;
width: 1.8rem;
&:not(:first-child) {
margin-left: -2.2rem;
margin-left: -1.8rem;
}
}
}

View File

@ -10,6 +10,12 @@
.groupControls {
margin-bottom: 2em !important;
margin-top: 0 !important;
@include media-breakpoint-down(md) {
border-top: 2px solid #000;
margin-top: -1.6rem;
padding-top: 1.6rem;
}
}
}
@ -27,9 +33,11 @@
}
.additionalControls {
display: none;
white-space: nowrap;
@include media-breakpoint-up(md) {
display: block;
text-align: right;
}
}