From a1466217bc02871ab110b25e6b233885d8d238e5 Mon Sep 17 00:00:00 2001 From: limepotato Date: Sun, 25 Aug 2024 23:05:47 -0600 Subject: [PATCH] Koppers Reply CSS --- custom/assets/instance.css | 221 +++++++++++++++++++++++++++++-------- 1 file changed, 177 insertions(+), 44 deletions(-) diff --git a/custom/assets/instance.css b/custom/assets/instance.css index a0bae1758..ada817e51 100644 --- a/custom/assets/instance.css +++ b/custom/assets/instance.css @@ -59,6 +59,7 @@ div.emojis:nth-child(6) { #iceshrimp_app #maincontent div div div._root_b6w6v_1 div._content_b6w6v_6 div.cmuxhskf div.tl._block div.swiper.swiper-virtual.swiper-initialized.swiper-horizontal.swiper-watch-progress div.swiper-wrapper div.swiper-slide.swiper-slide-visible div.new button._buttonPrimary._shadow { border-radius: var(--radius) } + #iceshrimp_app div.mk-deck div.main div.columns.left section.dnpfarvg._narrow_.paged.active.column div div div div._root_b6w6v_1 div._content_b6w6v_6 div.cmuxhskf div.tl._block div.swiper.swiper-virtual.swiper-initialized.swiper-horizontal.swiper-watch-progress div.swiper-wrapper div.swiper-slide.swiper-slide-visible div.new button._buttonPrimary._shadow { border-radius: var(--radius) } @@ -134,9 +135,18 @@ html body div#iceshrimp_app div.mk-app div.main div.contents main div div.rsqzvs border-top-right-radius: var(--radius); } -.list .notes button.muted { display: none; } /* hide muted posts in tl */ +.list .notes button.muted { + display: none; +} -._shadow, #iceshrimp_app > div > ._button { --shadow: rgba(0, 0, 0, 0.5); } /* add missing shadows */ +/* hide muted posts in tl */ + +._shadow, +#iceshrimp_app>div>._button { + --shadow: rgba(0, 0, 0, 0.5); +} + +/* add missing shadows */ /* navbar stuff? */ header>.body>.top { @@ -157,67 +167,85 @@ header.sidebar { border-left: none; } -._root_b6w6v_1 { padding: var(--thePadding) !important; } +._root_b6w6v_1 { + padding: var(--thePadding) !important; +} -a.mention > .main > .host { display: none; } /* hide instance in all mentions */ +a.mention>.main>.host { + display: none; +} -section.modal._popup > div.form > textarea { resize: vertical !important; } /* resize fix */ +/* hide instance in all mentions */ + +section.modal._popup>div.form>textarea { + resize: vertical !important; +} + +/* resize fix */ /** ThatOneCalculator MisskeyTweaks **/ .profile .banner::after, ._popup .banner::after { - content: ""; - background-image: inherit; - position: fixed; - inset: 0; - background-size: cover; - background-position: center; - pointer-events: none; - opacity: 0.1; - filter: blur(10px); + content: ""; + background-image: inherit; + position: fixed; + inset: 0; + background-size: cover; + background-position: center; + pointer-events: none; + opacity: 0.1; + filter: blur(10px); } /*** BETTER PROFILES ***/ .narrow { position: relative; - } - .wide > .main + .sub { +} + +.wide>.main+.sub { position: sticky; height: max-content; min-height: calc(100vh - 35px); bottom: 15px; align-self: flex-end; - } - .profile { +} + +.profile { margin-bottom: var(--margin); - } - .profile .banner-container, - .profile .banner, - .profile .fade { +} + +.profile .banner-container, +.profile .banner, +.profile .fade { border-bottom-left-radius: var(--radius) !important; border-bottom-right-radius: var(--radius) !important; - } - .profile ~ .contents { +} + +.profile~.contents { position: relative; - } - .profile ~ .contents > div > ._panel .content.omitted > div { +} + +.profile~.contents>div>._panel .content.omitted>div { padding-inline: 0; - } - .profile ~ .contents > div > ._panel .content.omitted .stream { +} + +.profile~.contents>div>._panel .content.omitted .stream { display: flex; overflow-x: auto; scroll-padding: 24px; padding-left: 24px; scrollbar-color: transparent transparent; - mask: linear-gradient(to right, #000 calc(100% - 400px), rgba(0,0,0,0.4), transparent); - } - .profile ~ .contents > div > ._panel .content.omitted .stream a { + mask: linear-gradient(to right, #000 calc(100% - 400px), rgba(0, 0, 0, 0.4), transparent); +} + +.profile~.contents>div>._panel .content.omitted .stream a { min-width: max-content; scroll-snap-align: start; height: 100px; - } - .profile ~ .contents > div > ._panel .content.omitted button.fade { +} + +.profile~.contents>div>._panel .content.omitted button.fade { background: linear-gradient(to right, transparent, var(--panel)); background: none; top: 0; @@ -227,25 +255,130 @@ section.modal._popup > div.form > textarea { resize: vertical !important; } /* height: unset; width: auto; padding: 24px; - } - .profile ~ .contents > div > ._panel .content:not(.omitted) { +} + +.profile~.contents>div>._panel .content:not(.omitted) { padding: 0 14px !important; padding: 0 !important; padding-top: 14px !important; - } - .profile ~ .contents > div > ._panel .content:not(.omitted) > div { +} + +.profile~.contents>div>._panel .content:not(.omitted)>div { padding: 0; - } - .profile ~ .contents > div > ._panel .content:not(.omitted) .stream { +} + +.profile~.contents>div>._panel .content:not(.omitted) .stream { display: flex; flex-wrap: wrap; - } - .profile ~ .contents > div > ._panel .content:not(.omitted) .stream a { +} + +.profile~.contents>div>._panel .content:not(.omitted) .stream a { flex-grow: 1; height: auto; max-height: 60vh; border-radius: 0; - } - .profile ~ .contents > div > ._panel .content:not(.omitted) .empty { +} + +.profile~.contents>div>._panel .content:not(.omitted) .empty { display: none; - } +} + +/* Koppers Reply */ +:root { + --originalAvatarSize: var(--avatarSize); +} + +.list .note-container .reply-to { + --avatarSize: 16px; + + .avatar-container { + margin-left: calc((var(--originalAvatarSize) - var(--avatarSize)) / 2); + align-self: center; + } + + .cat:before, + .cat:after { + margin-bottom: 5px; + } + + .body { + display: flex; + align-items: baseline; + overflow-x: hidden; + + >.header { + align-items: initial; + + .user-info { + + >div>.name, + .info { + display: none; + } + + &, + >div:first-child { + width: auto; + } + } + + div:has(> .hpaizdrt) { + display: none + } + } + + >.body { + flex-grow: 1; + max-height: 32px; + + br, + .files, + .reply-icon, + &:has(.cw:not(._cw_style_modern)) .wrmlmaau, + .showMoreButton, + .rp, + .cw button { + display: none + } + + .mfm-object :not(br) { + display: inline; + } + + .mfm-object, + .mfm-object * { + --mfm-zoom-size: 100% !important; + + white-space: nowrap; + word-break: keep-all; + } + } + + .content { + &.collapsed>.body { + mask: none; + -webkit-mask: none; + } + + &._cw_style_modern.showContent { + min-height: initial; + + >.hiddenNote { + text-align: left; + font-weight: inherit; + font-size: inherit; + padding: 0; + } + + >button, + >.body { + display: none; + } + } + } + + .footer { + display: none !important; + } + } +}