Unfloyded/Legamunt
0
0
Fork 0
Code Activity

Change responsive break points on navigation panel in web UI (#32034)

Browse source
This commit is contained in:
Eugen Rochko 2024-09-25 18:36:19 +02:00 • committed by GitHub
parent 28966fa0a6
commit 28c4eca0af
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 112 additions and 91 deletions
Download patch file Download diff file Expand all files Collapse all files

54
app/javascript/styles/mastodon/components.scss
View file

@ -3490,12 +3490,14 @@ $ui-header-logo-wordmark-width: 99px;
margin-top: 10px;
margin-bottom: 10px;
height: calc(100% - 20px);
overflow-y: auto;
overflow: hidden;
display: flex;
flex-direction: column;
& > a {
flex: 0 0 auto;
&__menu {
flex: 1 1 auto;
min-height: 0;
overflow-y: auto;
}
.logo {
@ -3506,6 +3508,36 @@ $ui-header-logo-wordmark-width: 99px;
&__logo {
margin-bottom: 12px;
}
@media screen and (height <= 710px) {
&__portal {
display: none;
}
}
@media screen and (height <= 765px) {
&__portal .trends__item:nth-child(n + 3) {
display: none;
}
}
@media screen and (height <= 820px) {
&__portal .trends__item:nth-child(n + 4) {
display: none;
}
}
@media screen and (height <= 920px) {
.column-link.column-link--optional {
display: none;
}
}
@media screen and (height <= 1040px) {
.list-panel {
display: none;
}
}
}
.navigation-panel,
@ -3869,22 +3901,6 @@ $ui-header-logo-wordmark-width: 99px;
}
}
@media screen and (height <= 810px) {
.trends__item:nth-of-type(3) {
display: none;
}
}
@media screen and (height <= 720px) {
.trends__item:nth-of-type(2) {
display: none;
}
}
@media screen and (height <= 670px) {
display: none;
}
.trends__item {
border-bottom: 0;
padding: 10px;