chinwag/ChinwagUI
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Spread out items in the navigation bar on mobile

Browse source
This commit is contained in:
Niléane 2023-11-16 01:48:52 +01:00
commit 67d5ddcffa
No known key found for this signature in database
4 changed files with 76 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

19
TangerineUI-purple.css
View file

@ -1335,6 +1335,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
margin-top: 15px; margin-top: 15px;
border-top-left-radius: 8px; border-top-left-radius: 8px;
border-top-right-radius: 8px; border-top-right-radius: 8px;
border-top: 1px solid var(--color-lines);
} }
} }
@media screen and (max-width:889px) { @media screen and (max-width:889px) {
@ -2454,6 +2455,21 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
box-sizing: border-box; box-sizing: border-box;
background-color: transparent; background-color: transparent;
} }
.layout-single-column
.navigation-panel:has(> *:nth-child(4):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: 50vw;
}
.layout-single-column
.navigation-panel:has(> *:nth-child(5):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: calc(100vw / 3);
}
.layout-single-column
.navigation-panel:has(> *:nth-child(6):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: 25vw;
}
.layout-single-column .column-link--transparent:is(.active, .active:hover, :active) { .layout-single-column .column-link--transparent:is(.active, .active:hover, :active) {
margin: 6px 0 8px; margin: 6px 0 8px;
padding: 4px 0 3px; padding: 4px 0 3px;
@ -2483,6 +2499,9 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
box-sizing: border-box; box-sizing: border-box;
border: 0; border: 0;
} }
.layout-single-column .navigation-panel .flex-spacer {
display: none;
}
} }
@media screen and (max-width:889px) { @media screen and (max-width:889px) {
.layout-single-column .columns-area__panels__main { .layout-single-column .columns-area__panels__main {

19
TangerineUI.css
View file

@ -1335,6 +1335,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
margin-top: 15px; margin-top: 15px;
border-top-left-radius: 8px; border-top-left-radius: 8px;
border-top-right-radius: 8px; border-top-right-radius: 8px;
border-top: 1px solid var(--color-lines);
} }
} }
@media screen and (max-width:889px) { @media screen and (max-width:889px) {
@ -2454,6 +2455,21 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
box-sizing: border-box; box-sizing: border-box;
background-color: transparent; background-color: transparent;
} }
.layout-single-column
.navigation-panel:has(> *:nth-child(4):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: 50vw;
}
.layout-single-column
.navigation-panel:has(> *:nth-child(5):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: calc(100vw / 3);
}
.layout-single-column
.navigation-panel:has(> *:nth-child(6):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: 25vw;
}
.layout-single-column .column-link--transparent:is(.active, .active:hover, :active) { .layout-single-column .column-link--transparent:is(.active, .active:hover, :active) {
margin: 6px 0 8px; margin: 6px 0 8px;
padding: 4px 0 3px; padding: 4px 0 3px;
@ -2483,6 +2499,9 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
box-sizing: border-box; box-sizing: border-box;
border: 0; border: 0;
} }
.layout-single-column .navigation-panel .flex-spacer {
display: none;
}
} }
@media screen and (max-width:889px) { @media screen and (max-width:889px) {
.layout-single-column .columns-area__panels__main { .layout-single-column .columns-area__panels__main {

19
mastodon/app/javascript/styles/tangerineui-purple/layout-single-column.scss
View file

@ -1335,6 +1335,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
margin-top: 15px; margin-top: 15px;
border-top-left-radius: 8px; border-top-left-radius: 8px;
border-top-right-radius: 8px; border-top-right-radius: 8px;
border-top: 1px solid var(--color-lines);
} }
} }
@media screen and (max-width:889px) { @media screen and (max-width:889px) {
@ -2454,6 +2455,21 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
box-sizing: border-box; box-sizing: border-box;
background-color: transparent; background-color: transparent;
} }
.layout-single-column
.navigation-panel:has(> *:nth-child(4):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: 50vw;
}
.layout-single-column
.navigation-panel:has(> *:nth-child(5):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: calc(100vw / 3);
}
.layout-single-column
.navigation-panel:has(> *:nth-child(6):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: 25vw;
}
.layout-single-column .column-link--transparent:is(.active, .active:hover, :active) { .layout-single-column .column-link--transparent:is(.active, .active:hover, :active) {
margin: 6px 0 8px; margin: 6px 0 8px;
padding: 4px 0 3px; padding: 4px 0 3px;
@ -2483,6 +2499,9 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
box-sizing: border-box; box-sizing: border-box;
border: 0; border: 0;
} }
.layout-single-column .navigation-panel .flex-spacer {
display: none;
}
} }
@media screen and (max-width:889px) { @media screen and (max-width:889px) {
.layout-single-column .columns-area__panels__main { .layout-single-column .columns-area__panels__main {

19
mastodon/app/javascript/styles/tangerineui/layout-single-column.scss
View file

@ -1335,6 +1335,7 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
margin-top: 15px; margin-top: 15px;
border-top-left-radius: 8px; border-top-left-radius: 8px;
border-top-right-radius: 8px; border-top-right-radius: 8px;
border-top: 1px solid var(--color-lines);
} }
} }
@media screen and (max-width:889px) { @media screen and (max-width:889px) {
@ -2454,6 +2455,21 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
box-sizing: border-box; box-sizing: border-box;
background-color: transparent; background-color: transparent;
} }
.layout-single-column
.navigation-panel:has(> *:nth-child(4):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: 50vw;
}
.layout-single-column
.navigation-panel:has(> *:nth-child(5):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: calc(100vw / 3);
}
.layout-single-column
.navigation-panel:has(> *:nth-child(6):last-child)
:is(.column-link, .navigation-panel__legal) {
flex: 25vw;
}
.layout-single-column .column-link--transparent:is(.active, .active:hover, :active) { .layout-single-column .column-link--transparent:is(.active, .active:hover, :active) {
margin: 6px 0 8px; margin: 6px 0 8px;
padding: 4px 0 3px; padding: 4px 0 3px;
@ -2483,6 +2499,9 @@ div[tabindex="-1"] + div[tabindex="-1"] > .status__wrapper > .status-reply.statu
box-sizing: border-box; box-sizing: border-box;
border: 0; border: 0;
} }
.layout-single-column .navigation-panel .flex-spacer {
display: none;
}
} }
@media screen and (max-width:889px) { @media screen and (max-width:889px) {
.layout-single-column .columns-area__panels__main { .layout-single-column .columns-area__panels__main {