Author: LASCH agency

LASCH-frontend is all-inclusive start HTML5 template with Bootstrap 4 (grid, reboot & utilities), Gulp 4, Sass, Browsersync, Github pages, Autoprefixer, Clean-CSS, Uglify, Rsync and Bower (libs path) support.

LASCH-frontend Start Project Template was created on the knee of curves projects. Now it works like a clock!

Cross-browser compatibility: IE9+.

Correct creation and output of png & svg sprites.

1️⃣ LASCH-frontend from GitHub - Download;

2️⃣ Install Node Modules in root project folder: npm i;

3️⃣ Run the template: gulp;

4️⃣ For installing new jQuery library, just run the command bower i plugin-name in the terminal. Libraries are automatically placed in the folder src/libs. Bower must be installed in the system (npm i -g bower).

• gulp: run default gulp task (sass, js, watch, browserSync) for web development;
• rsync: project deployment on the server from 📂 build folder via RSYNC;
• github: project deployment on Github pages.

HTML

	<svg class="custom-class"><use xlink:href="img/sprite-svg.svg#id_sprite"></use></svg>

CSS

	.custom-class {
		height: 14px;
		width: 14px;
	}

• The provided mixins are intended for use with variables.

SASS

	.icon-imagename
		@include sprite($image_name)

• How to use:

HTML

	<i class="icon icon-chrome"></i>

CSS

	.icon {
		display: inline-block;
	}

	.icon-chrome {
		background-image: url(../img/sprite-png.png);
		background-position: 0px 0px;
		width: 64px;
		height: 64px;
	}