SCSS Utilities for websites and web applications

---

---

Installation

---

npm install lesli-css --save

Structure

---

lesli-css  
└── sass/  
	├── components/  
	│    └── navigation  
	├── elements/  
	│    ├── blockquote  
	│    └── columns  
	├── helpers/  
	│    ├── animation  
	│    ├── breakpoint  
	│    ├── flex  
	│	 └── fonts  
	├── layout/  
	│    ├── container  
	│	 ├── normalize   
	│    └── scrollbar  
	├── utilities/  
	│    ├── color  
	│    └── variables  
	└── vendor/  
	     ├── bulma  
	     ├── bulma-start  
		 └── normalize 

Usage

---

// Import the library
@use "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