OpenCloud
/
mastodon
mirror of https://github.com/tootsuite/mastodon
1
1
Fork 0
Code Issues Releases Wiki Activity

Fix logo pushing header buttons out of view on certain conditions in mobile layout (#29787)

pull/28961/head
Claire 2024-03-28 15:00:57 +01:00 committed by GitHub
parent e85f24174e
commit 4f068d4fcc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/javascript/styles/mastodon/components.scss
View File

@ -2612,6 +2612,7 @@ a.account__display-name {
}
$ui-header-height: 55px;
$ui-header-logo-wordmark-width: 99px;
.ui__header {
display: none;
@ -2627,6 +2628,10 @@ $ui-header-height: 55px;
&__logo {
display: inline-flex;
padding: 15px;
flex-grow: 1;
flex-shrink: 1;
overflow: hidden;
container: header-logo / inline-size;
.logo {
height: $ui-header-height - 30px;
@ -2637,7 +2642,7 @@ $ui-header-height: 55px;
display: none;
}
@media screen and (width >= 320px) {
@container header-logo (min-width: #{$ui-header-logo-wordmark-width}) {
.logo--wordmark {
display: block;
}
@ -2654,6 +2659,7 @@ $ui-header-height: 55px;
gap: 10px;
padding: 0 10px;
overflow: hidden;
flex-shrink: 0;
.button {
flex: 0 0 auto;