1berry/mastodon-bird-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Nav panel improvements

Browse Source
This commit is contained in:
Freeplay 2023-03-26 15:33:15 -04:00 committed by GitHub
parent 5d1e9283b4
commit 401ce8c141
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 40 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
style.css
View File

@ -547,6 +547,11 @@ a.status-card.compact .status-card__host {
padding-left: calc(var(--gap-default) * 2);
padding-right: calc(var(--gap-default) * 2);
}
.layout-single-column .navigation-panel {
padding-left: 0 !important;
margin-right: -20px;
padding-right: 20px;
}
}
.layout-single-column .emoji-mart-anchor-bar,
@ -1334,6 +1339,11 @@ body.embed .detailed-status__meta .detailed-status__link .fa-retweet,
}
/* Right side panel */
.layout-single-column .navigation-panel {
margin-top: 0;
box-sizing: border-box;
padding: 10px;
}
.layout-single-column .navigation-panel hr {
/* Hide but reserve space */
visibility: hidden;
@ -1344,6 +1354,10 @@ body.embed .detailed-status__meta .detailed-status__link .fa-retweet,
height: 100%;
}
.layout-single-column .navigation-panel__logo hr {
margin: 0;
}
/* Hide scrollbars for .navigation-panel */
.dropdown-menu__container__list--scrollable::-webkit-scrollbar,
.layout-single-column .navigation-panel::-webkit-scrollbar {
@ -1353,18 +1367,15 @@ body.embed .detailed-status__meta .detailed-status__link .fa-retweet,
.layout-single-column .column-link {
align-items: center;
border-radius: 32px;
color: var(--color-light-text);
display: inline-flex;
overflow: visible;
font-size: var(--font-size-heading);
gap: var(--gap-default);
margin-bottom: 4px;
margin-right: auto;
margin-top: 4px;
padding-bottom: var(--gap-default);
padding-bottom: calc(var(--gap-default) + 4px);
padding-left: var(--gap-default);
padding-right: calc(var(--gap-default) * 1.5);
padding-top: var(--gap-default);
padding-top: calc(var(--gap-default) + 4px);
transition: all 100ms;
}
@ -1373,9 +1384,29 @@ body.embed .detailed-status__meta .detailed-status__link .fa-retweet,
margin-right: 0;
}
.layout-single-column .column-link:hover {
background-color: var(--color-column-link-hover);
.layout-single-column .column-link > i {
min-width: 1.3em;
}
.layout-single-column .column-link > span {
position: relative;
}
.layout-single-column .column-link > span::before {
content: "";
position: absolute;
top: calc(-4px - var(--gap-default));
bottom: calc(2px - var(--gap-default) * 1.5);
inset-inline-start: calc(-1.28571429em - (var(--gap-default) * 2));
inset-inline-end: calc(0px - var(--gap-default));
background-color: var(--color-column-link-hover);
border-radius: 32px;
opacity: 0;
transition: opacity 200ms;
}
.layout-single-column .column-link:hover > span::before,
.layout-single-column .column-link:focus > span::before {
opacity: 1;
}
.layout-single-column .account__section-headline a {
transition: all 200ms;
@ -2018,7 +2049,7 @@ body.embed .button.logo-button:hover,
/* Fix list links if they are too short */
.layout-single-column .list-panel .column-link {
margin-right: 50%;
display: flex;
}
}