mirror of
https://github.com/supabase/supabase.git
synced 2026-10-14 05:39:11 +03:00
## Problem The shared Skip to content control parks itself with `-translate-y-full`, so its bottom edge sits on the top of the viewport. After raised Button shadows landed, the `0 1px 3px` drop shadow still peeks into the top-left of Studio, Docs, www, and design-system even when the link is hidden. ## Solution Hide the control with `-translate-y-[calc(100%+8px)]` so the shadow clears the viewport. Update the unit test to match. One shared `ui-patterns` change covers every consumer. | Before | | --- | | <img width="420" height="108" alt="CleanShot 2026-10-09 at 10 14 27@2x" src="https://github.com/user-attachments/assets/469dd260-d989-49a2-a28c-7f02fa353571" /> | | _Note the shadow poking out from the top of the viewport_ | ## Review instructions On light mode and on Safari (for clearest visibility): 1. Open any Studio, Docs, or www preview page (no need to sign in on www/docs). 2. Look at the top-left of the viewport before pressing Tab. Confirm there is no faint button shadow / dark speck. 3. Press Tab once. Confirm the Skip to content button still slides in cleanly, then Enter to jump to main content.
Supabase UI Patterns
This package should be used for components which are built using NPM libraries (react-markdown, reactflow for example),
which make no sense to be included in all apps. It should also be used for components which are constructed using various
components from the ui package.
This package does not have a barrel file - each component has to be imported from its index
(ui-patterns/PrivacySettings, for example). This is intentional so that adding a new component which is used only in
1 or 2 apps doesn't burden the rest of the apps.