Skip to content
Wisembly - UI Elements
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
backstop_data
dist
gulp-tasks
release-it
src
website
.csscomb.json
.editorconfig
.gitignore
.npmignore
.sass-lint.yml
.travis.yml
Gulpfile.js
README.md
backstop.json
bower.json
env.js.dist
package.json
pre-commit.sh

README.md

Tapestry Build Status npm version Bower version

CSS guidelines

Goals

  • Maintainable OOCSS components
  • Scalable code

Naming

  • BEM - Block-element--modifier
  • PascaleCase for component name
  • camelCase for component childs
  • Lowercase for modifiers
  • Use is-* and has-* modifiers when needed
<div class="Component Component--modifier is-state">
  <div class="Component-child"></div>
  <div class="Component-otherChild"></div>
</div>

Spacing and indentation

  • Two spaces indent
  • Space after : property declaration
  • Space before { rule declaration
  • Closing braces on a new line
.Component {
  display: inline-block;
}

Else

  • Never use IDs
  • No magic number
  • Only use !important on utility classes
  • Max nesting level: 3

Development

Installation

npm install
npm install -g gulp pug-cli backstopjs

Run

gulp // starts server and watch files, available on localhost:3000
gulp icons // builds icons

Pre-commit and pre-push

Installation

Pre-commit hook ensures code has been linted.

npm run pre-commit

Bypass

To bypass the pre-commit, just add -n option.

git ci -n
git ci -nm "My commit message"

Release

npm run release // builds, commits, push, tags, publishes to Bower and NPM and deploys to GitHub Pages

Deploying

It can be run manually:

npm run deploy

Tests

Tests are run with Travis and have to be updated before branch merges. They can be run locally with these following commands.

npm run lint // linter
backstop reference // visual tests: builds references
backstop test // visual tests: compares references with actual HEAD
You can’t perform that action at this time.