Headers and Footers : LC Board

Create a header and footer for your website, just like the one being used in shadcn/ui’s website. We are now heading to the part where there is no official documentation for it, and you need to figure it out on your own. This is because headers and footers are not a new component and can be composed using existing shadcn/ui’s components. But you do have an important tool at your disposal : The Shadcn/ui website’s source code. This is where reverse engineering would come in.

• Download the shadcn/ui source code, install dependencies and run the website locally.
• Then, figure out where their components folder are, navigate to the folder, and locate the site header, footer, navbar components. Try to read the code and figure out how things are being accomplished. And this is where your programming skills would come in useful. Even if you do not understand the syntax, you should still be able to figure out what the code is trying to do.
• Copy paste the relevant code into your project, and modify it accordingly. Fortunately, we already created a mode toggle component, so we can simply reuse that component in the navbar.
• This is just a sample screenshot. Do not use it as a restriction. Try to be creative!
• Optional : The navbar from shadcn/ui will not work the same on mobile. You need to create a mobile navbar separately. The github repo already has the mobile nav implemented. Read through the code and implement your own mobile navbar.

git config --global core.autocrlf false

{
  "trailingComma": "es5",
  "semi": false
}

"format:check": "prettier --check --ignore-path .gitignore .",
"format:fix": "prettier --write --ignore-path .gitignore ."