Improve username space on smaller screens
This commit is contained in:
parent
32821a2471
commit
2ca39f8aa8
|
@ -83,20 +83,15 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media (max-width: 340px) {
|
||||
@media (max-width: 400px) {
|
||||
.account-profile-grid {
|
||||
grid-template-areas: "avatar avatar"
|
||||
"avatar avatar"
|
||||
"name name"
|
||||
"username username"
|
||||
"label label"
|
||||
"followed-by followed-by"
|
||||
"follow follow"
|
||||
"note note"
|
||||
"meta meta"
|
||||
"details details";
|
||||
grid-template-columns: min-content 1fr;
|
||||
grid-column-gap: 5px;
|
||||
grid-template-areas: "avatar name name label"
|
||||
"avatar username username username"
|
||||
"followed-by followed-by follow follow"
|
||||
"note note note note"
|
||||
"meta meta meta meta"
|
||||
"details details details details";
|
||||
grid-template-columns: min-content 1fr min-content min-content;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -31,12 +31,6 @@
|
|||
gap: 5px;
|
||||
}
|
||||
|
||||
@media (max-width: 340px) {
|
||||
.account-profile-follow {
|
||||
justify-self: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
:global(.account-profile-more-options-button),
|
||||
.account-profile-follow-button {
|
||||
padding: 10px;
|
||||
|
|
|
@ -103,12 +103,15 @@
|
|||
|
||||
@media (max-width: 767px) {
|
||||
.account-profile-name {
|
||||
font-size: 1.3em;
|
||||
/* font-size: 1.3em; */
|
||||
}
|
||||
.account-profile-username {
|
||||
font-size: 1.1em;
|
||||
/* font-size: 1.1em; */
|
||||
}
|
||||
.account-profile-name, .account-profile-username {
|
||||
.account-profile-name {
|
||||
align-self: flex-end;
|
||||
}
|
||||
.account-profile-username {
|
||||
align-self: flex-start;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue