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

Update starter app to Bootstrap 5.3.x and eliminate as much custom css as possible #346

Open
codeconsole opened this issue Aug 2, 2024 · 3 comments
Assignees

Comments

@codeconsole
Copy link
Contributor

codeconsole commented Aug 2, 2024

grails create-app creates a nice starter example, but has a lot of css rules that are too generalized and can't be used in new projects. If we are going to utilize bootstrap, we should try to leverage Bootstrap classes where possible and limit the amount of CSS in the generated app.

I propose the following:

  1. Update Bootstrap to the latest version
  2. Make a package.json in grails-forge-core file that will update bootstrap to the latest version using the npm run command
  3. Minimize the usage of any custom css to as little as possible and utilize bootstrap-icons where possible. Current custom css 2000 lines of code 👎
  4. Update g:paginate and g:sortableColumn to allow overriding of class names so that bootstrap classes could be used instead.
  5. Collaborate with fields plugin tags to allow overriding of class names instead of having to create a _wrapper.gsp in order to use bootstrap classes. Out of the box, <f:all should be able to render a clean bootstrap 5 form representation without need for extensive css.

https://getbootstrap.com/docs/5.3/forms/layout/

https://github.com/grails/grails-forge/tree/6.2.x/grails-forge-core/src/main/resources

https://github.com/grails-profiles/web

Snippet needs class customization:
https://github.com/grails/grails-core/blob/01d3e5895aef127fe5808ba1c23f416933552d01/grails-web-common/src/main/groovy/org/grails/web/errors/ErrorsViewStackTracePrinter.groovy#L71

@codeconsole codeconsole self-assigned this Aug 2, 2024
@codeconsole codeconsole converted this from a draft issue Aug 2, 2024
@codeconsole codeconsole moved this from In Progress to Todo in Grails 7 Aug 2, 2024
@jeffscottbrown
Copy link
Member

grails create-app creates a nice starter example, but has a lot of css rules that are too generalized and can't be used in new projects.

What kinds of rules can't be used in new projects?

@jamesfredley
Copy link
Contributor

I think we should also explore pulling bootstrap and jquery from webjars instead of living in /assets/

implementation "org.webjars.npm:bootstrap:5.3.3"
implementation "org.webjars.npm:jquery:3.7.1"

<asset:javascript src="webjars/jquery/3.7.1/dist/jquery.min.js" />
<asset:stylesheet src="webjars/bootstrap/5.3.3/dist/css/bootstrap.min.css" />

@codeconsole
Copy link
Contributor Author

I think we should also explore pulling bootstrap and jquery from webjars instead of living in /assets/

implementation "org.webjars.npm:bootstrap:5.3.3" implementation "org.webjars.npm:jquery:3.7.1"

<asset:javascript src="webjars/jquery/3.7.1/dist/jquery.min.js" /> <asset:stylesheet src="webjars/bootstrap/5.3.3/dist/css/bootstrap.min.css" />

I got that working

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Status: In Progress
Development

No branches or pull requests

3 participants