fix(app): stop message text showing through the slowmode hint (#3017)

This commit is contained in:
Hampus authored and GitHub committed 2026-09-28 17:29:15 +02:00
1 parent 5a4edc0b59
commit fce81367fb
2 files changed
+15 -10

No files matched your search

+1 -1
View File
@@ -559,7 +559,7 @@ const SKELETON_SURFACE_INVARIANTS: ReadonlyArray<SkeletonSurfaceInvariant> = [
}, },
{ {
file: 'src/features/channel/components/textarea/InputWrapper.module.css', file: 'src/features/channel/components/textarea/InputWrapper.module.css',
requires: ['.composerRoot:has(.statusTypingSlot)::before'], requires: ['.composerRoot:has(.statusTypingSlot, .statusSlowmodeSlot)::before'],
}, },
{ {
file: 'src/features/app/components/layout/GuildsLayout.module.css', file: 'src/features/app/components/layout/GuildsLayout.module.css',
@@ -48,20 +48,25 @@
--composer-surface-fill: var(--composer-surface-color, var(--background-secondary-lighter)); --composer-surface-fill: var(--composer-surface-color, var(--background-secondary-lighter));
} }
.composerRoot:has(.statusTypingSlot)::before { .composerRoot:has(.statusTypingSlot, .statusSlowmodeSlot)::before {
content: ''; content: '';
position: absolute; position: absolute;
bottom: 100%; bottom: 100%;
inset-inline: calc(-1 * var(--composer-box-inset-inline, 0px)); inset-inline: calc(-1 * var(--composer-box-inset-inline, 0px));
height: var(--composer-status-safe-area); height: var(--composer-status-safe-area);
background: linear-gradient( background:
to bottom, radial-gradient(farthest-side at 0% 100%, var(--composer-surface-fill) 55%, transparent 100%) left bottom /
transparent 0%, min(28rem, 70%) 160% no-repeat,
color-mix(in srgb, var(--composer-surface-fill) 48%, transparent) 26%, radial-gradient(farthest-side at 100% 100%, var(--composer-surface-fill) 55%, transparent 100%) right bottom /
color-mix(in srgb, var(--composer-surface-fill) 82%, transparent) 54%, min(18rem, 50%) 160% no-repeat,
var(--composer-surface-fill) 78%, linear-gradient(
var(--composer-surface-fill) 100% to bottom,
); transparent 0%,
color-mix(in srgb, var(--composer-surface-fill) 64%, transparent) 20%,
color-mix(in srgb, var(--composer-surface-fill) 92%, transparent) 40%,
var(--composer-surface-fill) 60%,
var(--composer-surface-fill) 100%
);
pointer-events: none; pointer-events: none;
} }