Add prefix to class name about nes.css HOT 12 CLOSED

from nes.css.

I think that there are few libraries that only use .is-primary or is-xxx. 🤔

For example, in the case of bulma.

.button
   &.is-primary

https://github.com/jgthms/bulma/blob/master/docs/_sass/index.sass#L72-L73

.nes-btn.is-primary(NES.css) and .button.is-primary(Bulma) do not conflict.
so, I think that prefix is not necessary for everything 🙈

from nes.css.

Translation:

Title: Add prefix to class name

Body:

Since NES.css doesn't provide layout. It maybe conflict when NES.css using the common class name.
Maybe add a prefix like ns- or nes- to solve this.

from nes.css.

Derp, I forgot that for a moment... Then I am siding with nes-.

from nes.css.

from nes.css.

Another option we could eventually look into is allowing users to generate their own version of the library. This idea comes from the Brototype library. There's a companion to that library, Bro-tie, that allows the user to do just that.

It's certainly not something we need to bother with while the framework is still in such an early stage, but it would certainly be a fun option to provide. Either way, I agree that we should be fine if we add the prefix to the main classes, then we leave the modifiers as they are.

from nes.css.

@DanSnow Thanks for translate 🙇

from nes.css.

.8bit-selector is an invalid selector, since CSS selectors can't start with a digit. .nes-selector would be a good one, though, as it's not used by any other major CSS libraries.

from nes.css.

OK, nes- 👍

For example...

<button class="nes-button is-primary"></button>

<section class="nes-container is-rounded with-title"></section>

<i class="nes-icon heart is-large"></i>

<div class="nes-field">
  <input class="nes-input is-success">
</div>

from nes.css.

This issue include breaking changes. ⚠️
so I would like to fix after setting CI. -> #13

from nes.css.

I'd suggest everything should have a prefix. is-large, is-primary etc could all be classes used in other libraries.

from nes.css.

🎉 This issue has been resolved in version 1.0.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

from nes.css.