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

Realistic Examples #6

Open
kalisjoshua opened this issue Apr 17, 2023 · 2 comments
Open

Realistic Examples #6

kalisjoshua opened this issue Apr 17, 2023 · 2 comments

Comments

@kalisjoshua
Copy link

I don't mean that (the title) as a slight or in any negative way at all. My suggestion is this, "create the examples as close to actual projects as possible" to illustrate to people how they could/should structure a project for their own ideas.

I'd be happy to help submit PRs to illustrate if you are interested.

@retrohacker
Copy link
Owner

Absolutely.

I'm deep in a contract right now. Once I come up for air I'm considering building a landing page. If you have some fun examples (ideally ones that "dazzle" with pretty graphics and stuff) that would look good on a landing page, please do send them.

@retrohacker
Copy link
Owner

One "rule of thumb" I've learned from this current contract is to use child combinators for pretty much everything.

So your top-level classes should be "unique" enough (i.e. .user-comment-component). Then, for all the child elements, I use child combinators for selecting them (i.e. .user-comment-component > .form > .title > label). This protects against "surprises" when you nest components and styles cascade down into the children.

ShadowDOM would also solve this, but comes with it's own trade-offs.

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

No branches or pull requests

2 participants