🚀 Rocket SCSS

⚠️ This project is still in progress. A complete component library coming soon.

Rocket SCSS is a component library built on 🧑‍🚀 Launchpad SCSS. Containing minimal styled basic components useful in any project.

Methodology

The design of the components is based on the CSS mothodology BEM.

The following is an example of how a component could be structured.

<div class="foo foo--alternative">
  <div class="foo__bar">
    <!-- HTML -->
  </div>
</div>

In the example above, .foo is the name of the component (block). .foo__bar is a child element. .foo--alternative is a modifier. To convert this into scss it could look like this:

.foo {
  color: #000;

  &--altenative {
    color: #757575;
  }

  &__bar {
    margin-bottom: 8px;
  }
}

SCSS Base

This component library is based on 🧑‍🚀 Launchpad SCSS. See the Launchpad SCSS documentation for more information about the scss base structure and helpers.