Refresh the look and feel of the site

[hasanhaja]

https://www.cassie.codes/

This design is just amazing! The animation! The color palette and typography! Goregous!

I'd like to use this as inspiration when building out my site.

I think the elements that I would like in my site would be to mimic my ramen poster, which has a very retro aesthetic. I like that my poster is still very rounded and soft, but that it has thick outlines and the halftone dots and shadow. I like my colors I think, but I'd like to recreate the vibe I feel when I look at that poster.

Todo

Content

• [x] Mechanical keyboards
• [x] Speedcubes
• [ ] Add /blog
  • [ ] #27
  • [ ] Wrap toc component with intersectional observer
• [x] Picks (can start as a list of resources I like; favorite YouTuber for css, Frontend etc)
• [ ] #18
• [ ] #3
• [ ] #9
• [ ] #14
• [ ] Update landing page copy

SEO

• [ ] #15
• [ ] #23
• [ ] #12

General

• [ ] #34
• [x] #36
• [ ] Add heading counters for picks and gadgets: https://youtu.be/o1HzOJfgugE?si=GeFwVsiNV_BhxE8X&t=552
• [ ] Add link icon on hover over headings for picks & gadgets pages
• [ ] Add external link on hover based on some attribute. Perhaps create a new link component
• [ ] #27
• [ ] #2
• [ ] #24
• [ ] #28
• [ ] Rework mobile navbar to be similar to this: https://jgthms.com/
• [ ] Work on logo
• [x] Move new copy to "About"/"Background" page
• [x] Switch to mostly monotone colors with one accent
• [x] Replace colors with oklch colors
• [x] Figure out a v1 light color scheme
• [x] #30
• [x] #32
  • [x] : https://fonts.google.com/specimen/Crete+Round?query=crete
  • Hero fonts: https://fonts.google.com/specimen/Anton?preview.text=Hi,%20I%27m%20Hasan%20%F0%9F%91%8B%F0%9F%8F%BE&preview.text_type=custom&category=Sans+Serif, https://fonts.google.com/specimen/Oswald?preview.text=Hi,%20I%27m%20Hasan%20%F0%9F%91%8B%F0%9F%8F%BE&preview.text_type=custom&category=Sans+Serif, https://fonts.google.com/noto/specimen/Noto+Sans+New+Tai+Lue?preview.text=Hi,%20I%27m%20Hasan%20%F0%9F%91%8B%F0%9F%8F%BE&preview.text_type=custom&category=Sans+Serif
  • Content fonts: https://fonts.google.com/specimen/Quicksand?preview.text=Hi,%20I%27m%20Hasan%20%F0%9F%91%8B%F0%9F%8F%BE&preview.text_type=custom&category=Sans+Serif, https://fonts.google.com/noto/specimen/Noto+Sans+New+Tai+Lue?preview.text=Hi,%20I%27m%20Hasan%20%F0%9F%91%8B%F0%9F%8F%BE&preview.text_type=custom&category=Sans+Serif
• [x] Work on style and theme

[hasanhaja]

There are some interesting techniques here

https://codepen.io/thebabydino/pens/tags/?selected_tag=text-effects&cursor=ZD0xJm89MCZwPTQ=