Bug: Borders are not working in Firefox

guastallaigor commented 5 years ago

This bug was founded by @juanpablolvl99. I tested it myself and it is happening.

Describe the bug Pixelated borders are not working in Mozilla Firefox in the develop branch.

To Reproduce Steps to reproduce the behavior:

Clone the repository;
Run npm install;
Run npm run build;
Run npm run storybook;
Click in the Inputs or Buttons or Selects or Textareas or Progress menu inside the sidebar;
You will be able to see that the borders are not showing, even if you change the options to is-success, or is-warning or is-error;

Expected behavior The borders are pixelated and when I click an option it changes the color.

Screenshots

Environment:

OS: Ubuntu 16.04
Browser: Firefox Developer Edition 65.0b11 (64-bit) / Firefox Quantum 64.0 (64-bit) (test it on both)
Build environment Node v10.15.0

Suggestion(s) for fixing this issue Maybe the border-image property does not work in Firefox?

Additional context In master this is not happening in any of the browsers.

BcRikko commented 5 years ago

Maybe this is related to #234

bug	???

I don't know why but it seems that it will not be working when using HEX color codes. 🤔

BcRikko commented 5 years ago

WooHoo, I got it!! 🎉 I'll create Pull Request later. 👍 2019-01-29 16 10 11 border

fill="rgb(#{red($color)}, #{green($color)}, #{blue($color)})"

// I could not use 'rgba' function. Because like this:
rgba(#ff0000, 1.0) -> #ff0000

BcRikko commented 5 years ago

:tada: This issue has been resolved in version 2.0.0 :tada:

The release is available on:

Your semantic-release bot :package::rocket:

nostalgic-css / NES.css