I made 18 UI components for all developers

Hello guys,

Last week, I have developed ui-components.com.
You can find good UI components and copy the scss code just by one click.

I updated this website and added new 18 Ui components.

website: https://ui-components.com
github: https://github.com/YuikoIto/ui-components

The updates are as follows.

• Added new 4 button components
• Added new 2 input components
• Created the Text Animation page and added new 4 text animation components
• Created the Arrow page and added 4 arrow components
• Created the Speech Bubble page and added 4 speech bubble components
• Bug fixes

Buttons

I added the following 4 buttons.

Inputs

I added the following 2 inputs.

Text Animations

I added the following 4 text animations.

Tips:

I'm using 5 span tags to separate this Hello characters, but I didn't want to use for example &:nth-child(1) and &:nth-child(2)... Then I used @for.

This is really useful.

  @for $i from 1 through 5 {
    &:nth-child(#{$i + 1}) {
      $delay: $i * 0.1 + s;
      animation-delay: $delay;
    }
  }

Arrows

I added the following 4 arrows.

This is easy, but I think it's a bit bothersome. So I added.

Speech Bubbles

I added the following 4 speech bubbles.

Bug fixes

The bug fixes is below.

• When a modal was open, clicking anywhere would close the modal.

Before

You may want to copy a part of the code while the modal is open, but before updating, no matter where you click in the modal, it closes.

After

Then, I fixed.

🌖🌖🌖🌖🌖🌖🌖🌖
Thank you for reading!
I would be really grad if you use this website and give me any feedback!

🍎🍎🍎🍎🍎🍎

Please send me a message if you need.

• [e-mail]
• https://twitter.com/yui_active

🍎🍎🍎🍎🍎🍎