New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add naming convention #1379

Merged
merged 2 commits into from Apr 12, 2018

Conversation

Projects
None yet
2 participants
@simurai
Member

simurai commented Apr 6, 2018

Description of the Change

This adds a CSS naming convention (rendered) to docs/. We already have been using it more or less, but still good to have it written down somewhere.

Alternate Designs

  • Should it stay CSS only or mixed with JS or other conventions?
  • Is it too strict and hard to remember? It could also be simplified more. On the other hand, it's just a guide and fine if not followed always 100%.
  • There is no definition where a CSS component "starts" and "ends". It could be related to components in JS, like github-<ReactComponentName>-<something>.
  • Could we potentially use other ways to style components? Like using CSS in JS? Might not be easy to make the Less theme variables work. And harder for themes, users to override, than just use simple classes.

Benefits

馃憠 Benefits.

Possible Drawbacks

Yet another thing to remember.

Applicable Issues

This is a straight up copy from atom/design-decisions#5

@simurai

This comment has been minimized.

Member

simurai commented Apr 6, 2018

/cc @annthurium that 鉂わ笍 flexbox

This PR has low priority, just added it so I don't forget after reading the chat.

@annthurium

This comment has been minimized.

Contributor

annthurium commented Apr 6, 2018

@simurai this is awesome -- thanks for documenting!!

my opinion: css-in-js is great for, like, Facebook where they have 1000s of developers doing ui development on the same codebase, which makes specificity unwieldy. Since we are not at that scale in terms of team size or codebase size, css in js would be overkill.

The convention you specified here is close enough to BEM to be easy to remember.

@simurai

This comment has been minimized.

Member

simurai commented Apr 9, 2018

OK, let's keep it simple. 馃憤

The convention you specified here is close enough to BEM to be easy to remember.

Right, it's BEM with a modified syntax. Pascal/camelCase, instead of underscores. Very close to SUIT.

@simurai

This comment has been minimized.

Member

simurai commented Apr 12, 2018

Ok, let's merge this as is. We can come back and iterate any time.

@simurai simurai merged commit 11b9b37 into master Apr 12, 2018

3 checks passed

ci/circleci Your tests passed on CircleCI!
Details
continuous-integration/appveyor/pr AppVeyor build succeeded
Details
continuous-integration/travis-ci/pr The Travis CI build passed
Details

@simurai simurai deleted the sm-naming-convention branch Apr 12, 2018

@annthurium

This comment has been minimized.

Contributor

annthurium commented Apr 12, 2018

oh yes, to be clear I definitely was indicating my solid thumbs up for everything in this pull request!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment