Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/bootstrap-vue/bootstrap-vue/issues/5117 below:

Bootstrap Customization breaks component UI · Issue #5117 · bootstrap-vue/bootstrap-vue · GitHub

Hi, It's been 2 weeks I am using bootstrap vue for my project. It's very good. However, recently I came up with few issues.

Spacing Utilities:
In bootstrap-vue, we get some spacing utilities used in components like mx-1 or p-1. This is good for users but adding this to framework will break component styles if someone customizes bootstrap's spacer according to their needs. Below is some examples:

Toast

calendar

Icons:
As I have just started exploring bootstrap-vue I haven't explored all components and flexibility they provide. But I have an issue with changing icon of calendar component's action buttons. So, providing an option for using custom icons will be beneficial for everyone.

Change bootstrap spacer utility.
e.g.

$spacer: 1rem;
$spacers: ();
$spacers: map-merge(
  (
    0: 0,
    25: (
      $spacer * 0.25,
    ),
    50: (
      $spacer * 0.5,
    ),
    75: (
      $spacer * 0.75,
    ),
    1: (
      $spacer,
    ),
    2: (
      $spacer * 1.5,
    ),
    3: (
      $spacer * 3,
    ),
    4: (
      $spacer * 3.5,
    ),
    5: (
      $spacer * 4,
    ),
  ),
  $spacers
);

I have checked other library before creating this issue and I found that reactstrap don't use any spacing utilities. So, even if someone changes bootstrap's customization UI doesn't look weird.

Libraries:

• BootstrapVue: 2.11.0
• Bootstrap: 4.4.1
• Vue: 2.6.11

Environment:

Not required

None

None

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4