Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(EW): reproduce original navigation #195

Merged
merged 8 commits into from
Jun 21, 2024
Merged

Conversation

ltclmbdev
Copy link
Contributor

@ltclmbdev ltclmbdev commented Jun 18, 2024

This reproduces the Naviagtion Footer components from original EW:

Desktop nav
Mobile nav
Footer

Racoon GIF

Copy link

vercel bot commented Jun 18, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
course-builder-docs ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 19, 2024 3:57pm
course-builder-poc ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 19, 2024 3:57pm
course-builder-video-blog ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 19, 2024 3:57pm
epic-web-v2 ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 19, 2024 3:57pm
pro-aws ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 19, 2024 3:57pm
pro-nextjs ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 19, 2024 3:57pm
value-based-design ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 19, 2024 3:57pm

@@ -0,0 +1,39 @@
'use client'
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

converted this component to the "client" because we need framer-motion here (for animation when sale banner appears above, not implemented yet)


import { ThemeToggle } from './theme-toggle'

export const getNavigationLinks = (): {
export const useNavigationLinks = (): {
Copy link
Contributor Author

@ltclmbdev ltclmbdev Jun 18, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

renamed to the useNaviagtionLinks to be able to use hooks inside

setHasMounted(true)
}, [])

const getTheme = (theme: string | undefined): 'light' | 'dark' => {
Copy link
Contributor Author

@ltclmbdev ltclmbdev Jun 18, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

a bit of overhead to get the theme value here just to appease the typescript

@@ -0,0 +1,342 @@
import { useId } from 'react'
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

use it for unique id's inside svgs because we have two instances of each icons and values should be unique to get icons rendered properly

@ltclmbdev ltclmbdev requested a review from vojtaholik June 21, 2024 11:19
import { cn } from '@/utils/cn'

// import { SearchIcon } from '@heroicons/react/outline'
// import { useSearchBar } from 'search-bar/use-search-bar'
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Not implemented yet

@kodiakhq kodiakhq bot merged commit 53f3ee4 into main Jun 21, 2024
23 checks passed
@kodiakhq kodiakhq bot deleted the en/adjust-navigation branch June 21, 2024 11:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants