discours.io/webapp
5
0
Fork 0
Code Issues Pull Requests Actions Projects Wiki Activity

Update AuthorBadge mobile view (#302)

Browse Source
This commit is contained in:
Ilya Y 2023-11-06 11:00:31 +03:00 committed by GitHub
parent 081c9c1734
commit 38ab3ddc4b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 51 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/Author/AuthorBadge/AuthorBadge.module.scss
View File

@ -11,6 +11,9 @@
margin-bottom: 0;
}
}
@include media-breakpoint-down(sm) {
flex-direction: column;
}
@include media-breakpoint-up(sm) {
margin-bottom: 2rem;
@ -20,12 +23,23 @@
text-align: left;
}
.basicInfo {
display: flex;
flex-direction: row;
align-items: center;
flex: 0 calc(100% - 5.2rem);
gap: 1rem;
@include media-breakpoint-down(sm) {
flex: 0 100%;
}
}
.info {
@include font-size(1.4rem);
border: none;
display: flex;
flex: 0 calc(100% - 5.2rem);
flex-direction: column;
line-height: 1.3;
margin-bottom: 1rem;
@ -60,6 +74,10 @@
margin-left: 5.2rem;
gap: 1rem;
@include media-breakpoint-down(sm) {
margin-left: 0;
}
@include media-breakpoint-up(sm) {
margin-left: 2rem;
}

2
src/components/Author/AuthorBadge/AuthorBadge.tsx
View File

@ -78,6 +78,7 @@ export const AuthorBadge = (props: Props) => {
return (
<div class={clsx(styles.AuthorBadge, { [styles.nameOnly]: props.nameOnly })}>
<div class={styles.basicInfo}>
<Userpic
hasLink={true}
size={'M'}
@ -108,6 +109,7 @@ export const AuthorBadge = (props: Props) => {
</Switch>
</Show>
</a>
</div>
<Show when={props.author.slug !== session()?.user.slug && !props.nameOnly}>
<div class={styles.actions}>
<Show