readme.md

SCSS Utilities for websites and web applications

---

Installation

---

npm install lesli-css --save

Structure

---

lesli-css  
└── source/  
	├── elements/  
	│    ├── columns  
	│    └── blockquote  
	├── components/  
	│    ├── boxes  
	│    └── navigation  
	├── layout/  
	│    ├── hero  
	│    ├── container  
	│	 ├── normalize   
	│    └── scrollbar  
	├── functions/  
	│    └── color  
	├── helpers/  
	│    ├── flex  
	│    ├── fonts  
	│	 ├── units  
	│    ├── spacing  
	│    └── breakpoint  
	├── settings/  
	│    └── variables  
	└── vendor/  
		└── bulma  

Usage

---

// Import the library
@import "lesli-css";


// Include your custom fonts for titles and body
@include lesli-css-fonts-standard("Domine", "OpenSans");


// Work with the color pallete
.test {
	color: lesli-css-color(blue);
	color: lesli-css-color(blue, 100);
	color: lesli-css-color(blue, 300);
	color: lesli-css-color(blue, 500); // default
	color: lesli-css-color(blue, 700);
	color: lesli-css-color(blue, 900);
}


// Breakpoints
@include lesli-css-breakpoint("small") {
	// your code
}


@include lesli-css-breakpoint-only("mobile") {
	// styles for min-width: 320px and max-width: 768px only
}


@include lesli-css-breakpoint-custom(100px) {
	// styles start at 100px
}


@include lesli-css-breakpoint-custom(200px, 300px) {
	// styles for min-width: 200px and max-width: 300px only
}


// customize the scrollbar (if supported)
@include lesli-css-scrollbar()

License

---

Software developed in Guatemala distributed under the General Public License v 3.0 you can read the full license here