@enhance/styles

enhance-styles

Functional utility classes

Install

git clone https://github.com/enhance-dev/enhance-styles.git cd enhance-styles

Usage

npm run build

Outputs default stylesheet in enhance.css

npm run prod

Outputs a minified version as well enhance.min.css

Customize

Open config.json, make your updates then rerun the build

These utility classes follow Tailwind naming conventions

enhance style scales use a base font relative naming convention that uses positive numbers when increasing the scale increment and negative numbers when decreasing the scale increment.

/* Font sizes derived from a type scale */
/* Up the scale ( positive numbers ) */
.text5{font-size:4.209rem;}/* 75.757px */ 
.text4{font-size:3.157rem;}/* 56.832px */ 
.text3{font-size:2.369rem;}/* 42.635px */ 
.text2{font-size:1.777rem;}/* 31.984px */ 
.text1{font-size:1.333rem;}/* 23.994px */ 
/* Base font size */
.text0{font-size:1rem;}/* 18px */ 
/* Down the scale ( negative numbers ) */
.text-1{font-size:0.75rem;}/* 13.503px */ 
.text-2{font-size:0.563rem;}/* 10.13px */ 
.text-3{font-size:0.422rem;}/* 7.599px */ 
.text-4{font-size:0.317rem;}/* 5.701px */ 
.text-5{font-size:0.238rem;}/* 4.277px */