Introduce color+size system

[pszalko]

Hi,

Would it be possible to introduce color and size system similar to bootstrap?
I mean the ...-color and ...-size classes for the three-dots component, just like at bootstrap colors page

I think it may be useful to use different colors/sizes of dots depending on the loader context.

I would see it as follow:

<div class="dot-flashing dot-primary dot-sm"></div>

Which would mean:

• use dot-flashing animation
• use primary color
• use sm size

For Sass/Less users (Sass here!) it would be helpful too to introduce variables for each color/size.

[pszalko]

Alternatively, if it's easier to implement:
Introduce mixins to create few three-dots instances in Sass, to create own system, for example:

@use "~three_dots"
.dot-white-sm {
    $dot-width: 2px;
    $dot-height: 2px;
    $dot-spacing: 6px;
    $dot-color: $white;
   @include three-dots.pulse
}

.dot-primary-sm {
    $dot-width: 2px;
    $dot-height: 2px;
    $dot-spacing: 6px;
    $dot-color: $primary;
   @include three-dots.pulse
}

[chemseddine201]

same requirement for react components, i can't control size and colors using custom css.