Default button.css file is too big

Created on 17 January 2017, almost 8 years ago
Updated 11 September 2024, 4 months ago

buttons.scss for now is just including default bootstrap/button sass file like

@import "init";
@import "bootstrap/scss/buttons";

The thing is that compiled buttons.css is around 15.6kb in size and the whole compiled css for the theme is currently around 49.8kb. So buttons.css is defining a lot of stuff which we really do not need in base theme and also in lot of custom themes.

Consider adding mixins/buttons.scss and there define @mixin btn() which is the same as BS .btn class. Then in buttons.scss construct only btn rules we need - probably only .btn, .btn-primary and .btn-secondary.

With this we can offer lighter BS buttons implementation and more flexibility for creating custom btn modifiers only when really needed.

📌 Task
Status

Needs review

Version

2.0

Component

Code

Created by

🇷🇸Serbia pivica

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • 🇷🇸Serbia pivica

    Just as an idea maybe we can solve this with CSS vars approach, check what Bootstrap 5 is doing here when we update to it.

  • 🇷🇸Serbia pivica

    Just as an idea maybe we can solve this with CSS vars approach, check what Bootstrap 5 is doing here when we update to it.

Production build 0.71.5 2024