diff --git a/src/app.css b/src/app.css index 8befdfaf..73a7851f 100644 --- a/src/app.css +++ b/src/app.css @@ -144,9 +144,10 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) { user-select: none; } .deck > header .header-grid { - background-color: var(--bg-blur-color); + background-color: var(--bg-color); + /* background-color: var(--bg-blur-color); background-image: linear-gradient(to bottom, var(--bg-color), transparent); - backdrop-filter: saturate(180%) blur(20px); + backdrop-filter: saturate(180%) blur(20px); */ border-bottom: var(--hairline-width) solid var(--divider-color); min-height: 3em; display: grid; @@ -895,7 +896,7 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) { .status-carousel > ul { display: flex; overflow-x: auto; - overflow-y: hidden; + overflow-y: clip; scroll-snap-type: x mandatory; scroll-behavior: smooth; margin: 0; @@ -904,6 +905,8 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) { align-items: flex-start; counter-reset: index; min-height: 160px; + max-height: 65vh; + max-height: 65dvh; } .status-carousel > ul > li { scroll-snap-align: center; @@ -915,8 +918,8 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) { list-style: none; margin: 0; padding: 0; - max-height: 65vh; - max-height: 65dvh; + /* max-height: 65vh; + max-height: 65dvh; */ counter-increment: index; position: relative; } @@ -1422,7 +1425,7 @@ body:has(.media-modal-container + .status-deck) .media-post-link { right: max(16px, env(safe-area-inset-right)); padding: 16px; background-color: var(--button-bg-blur-color); - backdrop-filter: blur(16px); + /* backdrop-filter: blur(16px); */ z-index: 10; box-shadow: 0 3px 8px -1px var(--drop-shadow-color), 0 10px 36px -4px var(--button-bg-blur-color); @@ -2471,6 +2474,7 @@ ul.link-list li a .icon { border-bottom: 0; border-radius: 16px; background-color: var(--bg-faded-blur-color); + backdrop-filter: blur(16px); background-image: none; border-radius: 16px; min-height: 4em; diff --git a/src/components/media-post.css b/src/components/media-post.css index b9ba419d..2a52a11a 100644 --- a/src/components/media-post.css +++ b/src/components/media-post.css @@ -34,7 +34,7 @@ word-break: break-word; word-wrap: break-word; overflow-wrap: break-word; - mix-blend-mode: luminosity; + /* mix-blend-mode: luminosity; */ -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; diff --git a/src/components/shortcuts.css b/src/components/shortcuts.css index 59bee8f7..69e680be 100644 --- a/src/components/shortcuts.css +++ b/src/components/shortcuts.css @@ -59,8 +59,9 @@ left: 0; right: 0; z-index: 100; - background-color: var(--bg-blur-color); - backdrop-filter: blur(16px) saturate(3); + background-color: var(--bg-color); + /* background-color: var(--bg-blur-color); + backdrop-filter: blur(16px) saturate(3); */ border-top: var(--hairline-width) solid var(--outline-color); box-shadow: 0 -8px 16px -8px var(--drop-shadow-color); overflow: auto; @@ -165,6 +166,7 @@ shortcuts .tab-bar[hidden] { padding: env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left); background-color: var(--bg-faded-blur-color); + backdrop-filter: blur(16px); border: 0; box-shadow: none; border-bottom: var(--hairline-width) solid var(--bg-faded-color); diff --git a/src/components/status.css b/src/components/status.css index 10deb5d5..ec8e83a4 100644 --- a/src/components/status.css +++ b/src/components/status.css @@ -206,7 +206,7 @@ .status-card:not(.status-carousel .status) :is(.content, .poll, .media-container) { max-height: 160px !important; - overflow: hidden; + overflow: clip; } .status.small:not(.status-carousel .status) .status-card @@ -1957,7 +1957,7 @@ a.card:is(:hover, :focus):visited { color: var(--media-fg-color); background-color: var(--media-bg-color); border: var(--hairline-width) solid var(--media-outline-color); - mix-blend-mode: luminosity; + /* mix-blend-mode: luminosity; */ border-radius: 4px; padding: 4px; opacity: 0.65;