Skip to content

Instantly share code, notes, and snippets.

View Grawl's full-sized avatar
🔨
work work

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

🔨
work work
View GitHub Profile
@Grawl
Grawl / webpack-https-mkcert.md
Created August 10, 2019 06:21
Running Webpack Dev Server with HTTPS on developer machine using MKCERT
  1. Add local domain to /etc/hosts:

    127.0.0.1 my-project.dev

  2. Install mkcert

  3. Create certificate for this domain:

    ➜ mkcert my-project.dev
@Grawl
Grawl / sass-nested-media.md
Created April 23, 2019 11:45
Sass nested media queries issue

With Sass, I can use nested media queries:

.selector
    @media (min-width: 100px)
        @media (max-width: 200px)
            color: white

And it combines all media queries with and:

@Grawl
Grawl / index.html
Created December 6, 2018 08:45
Off-Canvas navigation without JS
<html>
<body>
<input
type='checkbox'
id='nav-off-canvas'
class='offCanvas-model'
>
<div class='offCanvas-layer'>
<p>navigation</p>
<label
@Grawl
Grawl / example.twig
Last active July 11, 2018 05:34 — forked from SimonSimCity/pagination.html.twig
A gist for pagination in Twig, based on the total number of pages, the current page and some URL-settings. UIkit design.
{% include 'modules/pagination.twig' with {
currentFilters: {
foo: 'bar',
},
currentPage: 43,
paginationPath: '/news',
showAlwaysFirstAndLast: true,
lastPage: 75,
urlType: 'slash',
} %}
export default {
tClose: 'Закрыть', // Alt text on close button
tLoading: 'Загрузка…', // Text that is displayed during loading. Can contain %curr% and %total% keys
gallery: {
tPrev: 'Назад', // Alt text on left arrow
tNext: 'Далее', // Alt text on right arrow
tCounter: '%curr%/%total%' // Markup for "1 of 7" counter
},
image: {
tError: 'Не получилось загрузить <a href="%url%">изображение</a>.' // Error message when image could not be loaded

& между командами

Для выполнения двух команд параллельно, например yarn live & ./artisan-serve

&& между командами

Для выполнения двух команд последовательно, например yarn && composer install

Соответствует двум строкам в сценарии:

@Grawl
Grawl / sass-order.md
Last active December 21, 2017 03:19
Sass order
  1. @extends
    • @extends %placeholder
    • @extends .className
  2. $variables
  3. @media
    • @media (max-width: 1400px)
    • +breakpoint(medium)
    • @media (max-width: 768px)
  4. @at-root
  • @at-root :root &
@Grawl
Grawl / htmlhintrc.json
Last active November 15, 2017 06:32
FEIP HTML lint rules
{
"alt-require": true,
"attr-lowercase": true,
"attr-no-duplication": true,
"attr-unsafe-chars": true,
"attr-value-double-quotes": false,
"attr-value-not-empty": false,
"csslint": false,
"doctype-first": true,
"doctype-html5": true,

Sublime Text plugins used in FEIP

GitGutter

Shows you modified lines

SublimeLinter

Required for other linters

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

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

.block__elem--mod

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