From c263bc4573c8fca12cd6966c471e26ba8744136e Mon Sep 17 00:00:00 2001 From: Tony Grosinger Date: Sun, 28 Jan 2024 10:03:17 -0800 Subject: [PATCH] Remove logo avatar from top left corner --- src/components/Header.tsx | 143 +------------------------------------- 1 file changed, 2 insertions(+), 141 deletions(-) diff --git a/src/components/Header.tsx b/src/components/Header.tsx index 2542dcd..dfce6ef 100644 --- a/src/components/Header.tsx +++ b/src/components/Header.tsx @@ -187,75 +187,14 @@ function clamp(number: number, a: number, b: number) { return Math.min(Math.max(number, min), max) } -function AvatarContainer({ - className, - ...props -}: React.ComponentPropsWithoutRef<'div'>) { - return ( -
- ) -} - -function Avatar({ - large = false, - className, - ...props -}: Omit, 'href'> & { - large?: boolean -}) { - return ( - - - - - - - - - - - - - ) -} - export function Header() { let isHomePage = usePathname() === '/' let headerRef = useRef>(null) - let avatarRef = useRef>(null) let isInitial = useRef(true) useEffect(() => { - let downDelay = avatarRef.current?.offsetTop ?? 0 + let downDelay = 0 let upDelay = 64 function setProperty(property: string, value: string) { @@ -299,48 +238,14 @@ export function Header() { if (top === 0 && scrollY > 0 && scrollY >= downDelay) { setProperty('--header-inner-position', 'fixed') removeProperty('--header-top') - removeProperty('--avatar-top') } else { removeProperty('--header-inner-position') setProperty('--header-top', '0px') - setProperty('--avatar-top', '0px') } } - function updateAvatarStyles() { - if (!isHomePage) { - return - } - - let fromScale = 1 - let toScale = 36 / 64 - let fromX = 0 - let toX = 2 / 16 - - let scrollY = downDelay - window.scrollY - - let scale = (scrollY * (fromScale - toScale)) / downDelay + toScale - scale = clamp(scale, fromScale, toScale) - - let x = (scrollY * (fromX - toX)) / downDelay + toX - x = clamp(x, fromX, toX) - - setProperty( - '--avatar-image-transform', - `translate3d(${x}rem, 0, 0) scale(${scale})`, - ) - - let borderScale = 1 / (toScale / scale) - let borderX = (-toX + x) * borderScale - let borderTransform = `translate3d(${borderX}rem, 0, 0) scale(${borderScale})` - - setProperty('--avatar-border-transform', borderTransform) - setProperty('--avatar-border-opacity', scale === toScale ? '1' : '0') - } - function updateStyles() { updateHeaderStyles() - updateAvatarStyles() isInitial.current = false } @@ -363,44 +268,6 @@ export function Header() { marginBottom: 'var(--header-mb)', }} > - {isHomePage && ( - <> -
- -
-
- - -
-
- - - )}
-
- {!isHomePage && ( - - - - )} -
+