zspecza

Stylus Best Practices

Introduction

This is a curated set of conventions and best practices for Stylus, an expressive, dynamic, robust and advanced CSS preprocessor. Frustrated with there not being a set of conventions set in place (that could be easily found), I set forth to find out on my own.

karol-majewski

type Singleton = string;
type Union = string | number;

type DistributedKeyOf<T> =
  T extends any
    ? keyof T
    : never;

type DistributedValueOf<T> = T[DistributedKeyOf<T>];

nekitk

CodePen Collection

Page Layout

1. Simple page layout
2. Animating grid (FireFox only)
3. Using instead of Bootstrap grid

Items list variations

4. Basic items list
5. Using explicit and implicit properties together