@cornflour

24 Followers
11 Following
146 Posts
i occasionally do web dev stuff
@x2ero I have never used classes inside contexts, but from my understanding, Context compares changes by `Object.is`, so since your old and new value here is still the same object, it doesn't rerender.
Related section in React docs: https://react.dev/reference/react/useContext#caveats
useContext – React

The library for web and native user interfaces

@aleandros only after replying did I realize your post is already 2 weeks old, I'm sorry for digging it up 🥲
@aleandros My favorite CSS-related youtube channel is https://www.youtube.com/@KevinPowell, he is very knowledgeable in CSS and have plenty of videos showing step-by-step of how to implement a certain thing, which I find very helpful
Similarly, https://www.youtube.com/@Hyperplexed is also really good at taking a complex task and breaking it down into smaller, manageable pieces and implementing them
Kevin Powell

Helping you learn how to make the web, and make it look good while you're at it. With videos every Tuesday and Thursday, I'll be bringing you How Tos and Tutorials, as well as simple tips and tricks, with a big focus on helping people see how wonderful CSS is!

YouTube
@aleandros If you already have a crystal clear design but struggle to implement it the way it's supposed to look, tbh my best suggestion is to just keep implementing and eventually you'll be faster. I usually try to inspect the stylings when I see something I like, toggling things on and off to see what each line does. Being some basic patterns like using flexbox also goes a long way in making things behave the way you expect!
@aleandros I think it depends a bit on what part of CSS you're struggling. Do you have a clear design in mind of what you want to make? If not quite (and what you come up with just doesn't look good enough), then it's more of a design issue than a coding one. If this is the case, what've worked for me is to borrow from existing design systems, since good spacings, font sizes and color palette go a long way in making a design looks nicer
@tomkra Hi there!
I am not the most experienced or knowledgeable out there, but if you encounter any questions or problems with webdev, feel free to ping/DM me and I'll try my best to help! 😁
I hope you'll enjoy the journey!
@smitten shadcn-ui is my go-to now (though it's not quite a component library)! It is mostly built on top of radix-ui which is already a very good headless component library, but also with very well-designed default stylings so I don't have to do as much work customizing, and the copy-paste approach is really good at allowing me to truly own the components when I do need to customize. It has a pretty nice CLI too!
https://ui.shadcn.com/
shadcn/ui

Beautifully designed components that you can copy and paste into your apps. Accessible. Customizable. Open Source.

shadcn/ui
@pieq I'd probably do `display: flex`, `flex-direction: column` and `align-items: center` on the container of all these items and `width: 70rem` on each of the text block? At least that's the first thing that comes to my mind
@Xerto hmm I believe in order to get the text to wrap like that what you'll need is `float` instead of flexbox. Here is a simple replication that I tried
https://jsfiddle.net/o2f57we0/30/
Edit fiddle - JSFiddle - Code Playground

Test your JavaScript, CSS, HTML or CoffeeScript online with JSFiddle code editor.

@Xerto Do you need help on the design part or the implementation (CSS) part?