From e052f5e198603246cb031e00d9cadc2ae4bb140d Mon Sep 17 00:00:00 2001 From: Eric Bailey Date: Tue, 10 Dec 2024 14:52:30 -0600 Subject: Refactor sidebar (#6971) * Refactor RightNav (cherry picked from commit 96bb02acfd2d7452df18a0e7410e6a7169a583ed) * Better gutter handling * Clean up styles * Memoize breakpoints * Format * Comment * Loosen spacing, handle overflow, smaller text to match prod * Fix circular imports on native * Return 0 instead of undefined for easier calculations * Re-assign * Fix * Port over fix from subs/base * Space out right nav feeds, widen sidebar to match prod * Fix lost padding on home header * Fix perf by not actually linking to new URL * Remove underline on focus * Foramt --------- Co-authored-by: Dan Abramov --- src/alf/index.tsx | 15 ++------------- 1 file changed, 2 insertions(+), 13 deletions(-) (limited to 'src/alf/index.tsx') diff --git a/src/alf/index.tsx b/src/alf/index.tsx index a96803c56..5443669c7 100644 --- a/src/alf/index.tsx +++ b/src/alf/index.tsx @@ -1,5 +1,4 @@ import React from 'react' -import {useMediaQuery} from 'react-responsive' import { computeFontScaleMultiplier, @@ -14,13 +13,14 @@ import {BLUE_HUE, GREEN_HUE, RED_HUE} from '#/alf/util/colorGeneration' import {Device} from '#/storage' export {atoms} from '#/alf/atoms' +export * from '#/alf/breakpoints' export * from '#/alf/fonts' export * as tokens from '#/alf/tokens' export * from '#/alf/types' export * from '#/alf/util/flatten' export * from '#/alf/util/platform' export * from '#/alf/util/themeSelector' -export * from '#/alf/util/useGutterStyles' +export * from '#/alf/util/useGutters' export type Alf = { themeName: ThemeName @@ -142,14 +142,3 @@ export function useTheme(theme?: ThemeName) { return theme ? alf.themes[theme] : alf.theme }, [theme, alf]) } - -export function useBreakpoints() { - const gtPhone = useMediaQuery({minWidth: 500}) - const gtMobile = useMediaQuery({minWidth: 800}) - const gtTablet = useMediaQuery({minWidth: 1300}) - return { - gtPhone, - gtMobile, - gtTablet, - } -} -- cgit 1.4.1