@lostmyname/css

Lost My Name CSS configuration

This repository contains typographic classes, colour palette classes, layout-specific spacing classes, generic utility classes, and some SCSS functions & config variables.

The only explicitly exported CSS classes are the type size classes, as well as the default resets. This is in keeping with Chameleon's ethos. All others are available through the @include placeholder() mixin.

Config variables

These variable declarations, located in scss/config to set breakpoints, and spacing sizes to be consumed by Chameleon, as well as font families, type sizes, and colours.

Functions

We have some unit functions, located in scss/functions to do things such as change a pixel value into a rem, remove a unit from a value, etc.

Mixins

Chameleon mixins are imported, giving us access to things such as the @include on() and @include placeholders() mixins.

There are also config-specific mixins, for typography.

Utilities

As well as importing Chameleon's box, positioning and visibility utility placeholders, we add a11y and type utility placeholders.

As with all placeholders, these aren't exported as classes by default.

Installation

npm install
gulp