diff --git a/glitch-fixes.css b/glitch-fixes.css index 193aaf9..c4010c1 100644 --- a/glitch-fixes.css +++ b/glitch-fixes.css @@ -85,6 +85,7 @@ body.app-body.flavour-glitch > #mastodon .status__relative-time { margin-inline: auto 5px !important; z-index: 2; flex-grow: 0 !important; + min-width: 5ch !important; } body.app-body.flavour-glitch > #mastodon .reactions-bar { width: unset; diff --git a/modern.css b/modern.css index 13e419b..b5feeaf 100644 --- a/modern.css +++ b/modern.css @@ -701,6 +701,7 @@ a:focus-visible, margin-bottom: 10px !important; border-radius: 0px !important; padding: 15px !important; + height: max-content; isolation: isolate; overflow: hidden; } @@ -726,7 +727,9 @@ a:focus-visible, z-index: -1; } #mastodon .dismissable-banner .scrollable:not(.scrollable--flex) .account-timeline__header, -#mastodon .follow_requests-unlocked_explanation .scrollable:not(.scrollable--flex) .account-timeline__header { +#mastodon .follow_requests-unlocked_explanation .scrollable:not(.scrollable--flex) .account-timeline__header, +#mastodon .dismissable-banner .scrollable:not(.scrollable--flex) .dismissable-banner, +#mastodon .follow_requests-unlocked_explanation .scrollable:not(.scrollable--flex) .dismissable-banner { margin: 0px !important; } #mastodon .dismissable-banner .focusable, @@ -830,7 +833,7 @@ a:focus-visible, #mastodon .column:not(.scrollable--flex) > .dismissable-banner ~ .scrollable { border-radius: 0 !important; } -#mastodon .scrollable > .dismissable-banner { +#mastodon :not(.account__section-headline) + .scrollable > .dismissable-banner { margin: 0px !important; margin-bottom: 0 !important; } @@ -1794,6 +1797,14 @@ a:focus-visible, .directory__list.directory__list { padding: 15px 10px; } +.layout-multiple-columns .explore__suggestions, +.layout-multiple-columns .directory__list { + display: block !important; +} +.layout-multiple-columns .explore__suggestions > *, +.layout-multiple-columns .directory__list > * { + margin: 10px !important; +} .focusable.account-card.account-card.account-card .account-card__header, .entry.account-card.account-card.account-card .account-card__header, .statuses-grid__item .detailed-status.account-card.account-card.account-card .account-card__header, @@ -2654,6 +2665,11 @@ a:focus-visible, #mastodon .picture-in-picture__footer :not(i) { pointer-events: all; } +#mastodon .status__action-bar > div, +#mastodon .detailed-status__action-bar > div, +#mastodon .picture-in-picture__footer > div { + all: unset; +} #mastodon .status__action-bar .icon-button, #mastodon .detailed-status__action-bar .icon-button, #mastodon .picture-in-picture__footer .icon-button { @@ -2671,21 +2687,6 @@ a:focus-visible, #mastodon .picture-in-picture__footer .icon-button:last-child { margin: 0 !important; } -#mastodon .status__action-bar .icon-button i, -#mastodon .detailed-status__action-bar .icon-button i, -#mastodon .picture-in-picture__footer .icon-button i { - min-width: 22px; -} -#mastodon .status__action-bar .icon-button[aria-label]::after, -#mastodon .detailed-status__action-bar .icon-button[aria-label]::after, -#mastodon .picture-in-picture__footer .icon-button[aria-label]::after { - all: unset; - font-size: 12px; - margin-inline-start: 0.5em; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; -} #mastodon .status__action-bar .icon-button .icon-button__counter, #mastodon .detailed-status__action-bar .icon-button .icon-button__counter, #mastodon .picture-in-picture__footer .icon-button .icon-button__counter { @@ -3216,7 +3217,8 @@ a:focus-visible, background-color: inherit; z-index: -1; } - #mastodon .scrollable:not(.scrollable--flex) .account-timeline__header { + #mastodon .scrollable:not(.scrollable--flex) .account-timeline__header, + #mastodon .scrollable:not(.scrollable--flex) .dismissable-banner { margin: 0px !important; } #mastodon .focusable, @@ -4513,7 +4515,8 @@ a:focus-visible, background-color: inherit; z-index: -1; } -.layout-multiple-columns #mastodon .columns-area .scrollable:not(.scrollable--flex) .account-timeline__header { +.layout-multiple-columns #mastodon .columns-area .scrollable:not(.scrollable--flex) .account-timeline__header, +.layout-multiple-columns #mastodon .columns-area .scrollable:not(.scrollable--flex) .dismissable-banner { margin: 0px !important; } .layout-multiple-columns #mastodon .columns-area .focusable, diff --git a/modern.user.css b/modern.user.css index 013bbfb..5de6309 100644 --- a/modern.user.css +++ b/modern.user.css @@ -13,13 +13,16 @@ //////////////////////////////////////////////////////////////////// -/* Update 1.8.3 -- Fix large status buttons in vanilla mastodon w/ new icons +/* Update 1.8.4 +- Fix misplaced menu button on statuses +- Tweaks +Advanced view: +- Fixed People tab in Explore */ /* ==UserStyle== @name Mastodon Modern -@version 1.8.3 +@version 1.8.4 @description Drastically improves the look & feel of Mastodon @updateURL https://codeberg.org/Freeplay/Mastodon-Modern/raw/branch/main/modern.user.css @homepageURL https://codeberg.org/Freeplay/Mastodon-Modern @@ -91,7 +94,7 @@ background-color inherit z-index -1 } - .account-timeline__header { + .account-timeline__header, .dismissable-banner { margin 0px !important } } @@ -602,6 +605,7 @@ margin-bottom 10px !important border-radius 0px !important padding 15px !important + height max-content isolation isolate overflow hidden /.dismissable-banner__message { @@ -624,7 +628,7 @@ border-radius 0 !important } } - .scrollable > .dismissable-banner { + :not(.account__section-headline) + .scrollable > .dismissable-banner { margin 0px !important margin-bottom 0 !important } @@ -1164,6 +1168,13 @@ &.directory__list { padding 15px 10px } + /.layout-multiple-columns & { + // this was done because having overflow scroll/hidden + display grid or flex breaks it ? + display block !important + > * { + margin 10px !important + } + } } box-shadow var(--shadow) .account-card__header { @@ -1812,6 +1823,9 @@ :not(i) { pointer-events all } + > div { + all unset + } .icon-button { display inline-flex align-items center @@ -1827,18 +1841,6 @@ &:last-child { margin 0 !important } - i { - min-width 22px - } - &[aria-label]::after { - all unset - // content attr(aria-label) - font-size 12px - margin-inline-start .5em - white-space nowrap - overflow hidden - text-overflow ellipsis - } .icon-button__counter { width auto !important } @@ -3453,6 +3455,7 @@ margin-inline auto 5px !important z-index 2 flex-grow 0 !important + min-width 5ch !important } .reactions-bar {