Skip to content

getting-started.md

Latest commit

 

History

History
33 lines (28 loc) · 775 Bytes

getting-started.md

File metadata and controls

33 lines (28 loc) · 775 Bytes

Getting Started

Install the npm package in your client project

npm install vllayout

Create your own style root, lets call it app.scss You can configure your colors and other variables here

// import vllayout
@use "../node_modules/vllayout/main" with (
	$page-color: #000,
	$page-background: #fff,
	$page-border-color: #ccc,
	$page-hover-background: #ddd,

	$page-accent-background: #007afa,
	$page-accent-color: #fff,
	$page-accent-active-background: #007afa,
	$page-accent-active-color: #fff,
	$page-accent-hover-background: #466079,
	$page-accent-hover-color: #fff,
);

// add custom elements, styles, imports, ...

Build your stylesheet with sass (npm install -g sass)

sass app.scss dist.css

Include dist.css in your webpage and have fun!