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

Default CSS in each page #253

Open
ralfiannor opened this issue Aug 20, 2022 · 7 comments
Open

Default CSS in each page #253

ralfiannor opened this issue Aug 20, 2022 · 7 comments
Labels
improvement New feature or request

Comments

@ralfiannor
Copy link

Instead applied a default css in each html page, why not to add the css style in the example project or welcome page generator only.

@matthewmueller
Copy link
Contributor

matthewmueller commented Aug 20, 2022

Hey @ralfiannor, thanks for trying Bud!

The default.css implementation was a bit rushed. The original goal is that when there's no other CSS on the page, Bud provides reasonable defaults. This stems from the fact that every website adds normalize.css, reset.css, preflight.css, etc. I also like the idea of supporting opinionated, prettier drop-in sheets like water.css.

A couple solutions I can think of right now.

1. You can override default.css by creating a public/default.css

This was the original plan. By creating a public/default.css, it becomes the default.css. The way you'd reset is by creating an empty file. This may not work so well with CSS frameworks like Tailwind though.

2. No default styles, instead you're expected to scaffold your CSS solution

Something like:

bud new css tailwind
bud create --css=tailwind

3. A default CSS stylesheet is added when you create a new project. You can delete it if you don't want it

This way you get the default, but you can go back to no styling or replace it by deleting the generated file. You could additionally add scaffolders for Tailwind like in 2., but the difference is that 3. starts with a default, where 2. does not.


I'm leaning towards 3. right now because I think it provides the most flexibility.

@matthewmueller
Copy link
Contributor

I remember @vito also being surprised about the default.css, do you have any thoughts?

@vito
Copy link
Contributor

vito commented Aug 22, 2022

I like 3 as well. I was a little surprised to have default CSS but I think it's a reasonable thing for Bud to do, since as you said just about every project starts with one, and I think it's good for Bud to cut out as much boilerplate as possible.

What I like about 3 is I can clearly see that it generated a default CSS for me. Thinking back what was more surprising was that it was happening without any indication, it was just sort of injected into the page for me.

One thing to consider is what happens when I bump to a new version of Bud that comes with a new default CSS. I guess I would expect the default.css to stay as-is since it's only at project generation time. I think that's preferable as long as there's some obvious way of upgrading it if the user wants, which might just mean copy/pasting from upstream.

@matthewmueller
Copy link
Contributor

matthewmueller commented Aug 23, 2022

One thing to consider is what happens when I bump to a new version of Bud that comes with a new default CSS.

Good point! I also agree that a manual upgrade would be preferable to a potential styling surprise. Copy and paste for now should be fine since I don't see normalize.css changing much.

Let's go with 3. then!

@ralfiannor, do you have any interest in contributing this change in your PR?

@matthewmueller matthewmueller added the improvement New feature or request label Aug 25, 2022
@ralfiannor
Copy link
Author

ralfiannor commented Aug 25, 2022

@matthewmueller Great, I'm interested to start contributing to this project. So If we run the command bud create <dir> we will scaffold public/default.css also and when add the flag --css=tailwind the default.css will fill tailwind css styling, right ?

@matthewmueller
Copy link
Contributor

matthewmueller commented Aug 26, 2022

I'd ignore tailwind scaffolding at the moment because I intend to work on that soon #188 and I'm not quite sure what shape that will take at the moment.

For now I'd suggest:

  1. Updating scaffolding to create public/default.css
  2. If you delete public/default.css all default styling is removed.

@hakanrw
Copy link

hakanrw commented Mar 2, 2024

any updates?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
improvement New feature or request
Projects
None yet
Development

No branches or pull requests

4 participants