Даниил Пронин Grawl

Настоящим обязываю разработчиков ДВИП придерживаться следующих положений:

Использовать систему именования классов БЭМ

.block__elem--mod

Вместо `` для `blockelem` использовать `-`

PageSpeed Insights MANIFEST automation

Test your website using Google PageSpeed Insights https://developers.google.com/speed/pagespeed/insights/

On the bottom, you’ll see a link to download an archive containing optimized images, JS and CSS resources. You have to get it and replace your website’s files using archive content.

But after you unpack this archive, you will have all files moved to new locations based on file type, like this:

images
image.jpg

	<?
	/*
	Since WooCommerce CSS is a piece of shit and tries to style selectors like '.button' and 'img', it's a good idea to remove this shitty CSS. But! it's hard to implement all styles properly because WooCommerce templates is a hell on Earth without classnames consension and full of server-side rendering. So you cannot “just style it again”. You have to change almost every template function. And even you have enough time for it, there is a lot of things to change before you get a frontend that is OK.
	So, a better idea is to remove WooCommerce classnames from your frontend root and move them to WooCommerce content root, a safe place where you want these styles.
	*/

	function remove_woocommerce_body_classes() {
	remove_filter('body_class', 'wc_body_class');
	}
	add_action('init', 'remove_woocommerce_body_classes');

	.vue-drag-select {
	position: relative;
	user-select: none;
	}
	.vue-drag-select-box {
	position: absolute;
	background: rgba(0, 162, 255, .4);
	z-index: 99;
	}

	<?
	/*
	# WP Super Cache plugin to cache pages with different custom cookie

	This file must be in `wp-content/plugins/wp-super-cache-plugins` folder (depend on your choise at 1st step of this instruction)

	To make it work, do the following:

	1. Open `wp-content/wp-cache-config.php` and change `$wp_cache_plugins_dir` to this:

	module.exports = {
	"styles:watch": {
	"watch": {
	"--pattern": "sources/styles/*/.{sass,scss}",
	"--command": "npm run styles:build"
	}
	},
	"styles:build": [
	"npm run sass:once",
	"npm run postcss:once"

	// Task to compile styles with PostCSS
	elixir.extend('processStyles', options=> {
	var name = 'processStyles'
	var sourcemaps = require('gulp-sourcemaps')
	var err = e => {
	console.log(require('gulp-util').colors.bgRed('PostCSS - Error'))
	console.log(e.message)
	}
	var notification = require('laravel-elixir/Notification')
	new elixir.Task(name, ()=> {

	{
	"name": "85",
	"description": "NetCat CMS template for shop",
	"scripts": {
	"watch:config": "node node_modules/watch-cli/bin/watch",
	"watch:styles": "npm run watch:config -- --pattern 'assets/source-styles/*/.styl' --command 'npm run build:styles'",
	"build:styles": "npm run stylus:once && npm run postcss:once",
	"stylus:config": "node node_modules/stylus/bin/stylus --sourcemap --sourcemap-root ./assets/source-styles --use nib --out ./assets/css",
	"stylus:once": "npm run stylus:config -- ./assets/source-styles/styles.styl",
	"postcss:once": "node node_modules/postcss-cli/bin/postcss --config postcss.json",

	// ----
	// Sass (v3.4.21)
	// Compass (v1.0.3)
	// ----

	/// Map of breakpoints
	/// @type Map
	$breakpoints: (
	'small': '(min-width: 860px)',
	'medium': '(min-width: 1000px)',

	<body class="t-light">
	<article class="c-modal c-modal--wide js-modal is-open">
	<div class="c-modal__content">
	<div class="s-cms-content">
	...
	</div>
	</div>
	<div class="c-modal__foot">
	<p class="o-layout">
	<span class="o-layout__item u-1/3">

Даниил Пронин Grawl

Использовать систему именования классов БЭМ

Вместо __ для block__elem использовать -

PageSpeed Insights MANIFEST automation

Вместо `` для `blockelem` использовать `-`