- create plugin example
- create theme example
- use DOTENV for project https://github.com/motdotla/dotenv
https://starter.silvestar.codes/ https://github.com/maliMirkec/starter-project
before start run "npm install"
.dblock - @extend .dblock - для всяких :before/:after элементов .align-center-parent - идеальное выравнивание по центру (горизонтально и вертикально), задавать родительскому. элемент что центровать - .align-center .justify-child - родительский элемент, блоки внутри будут по всей ширине
градиенты
- @include linear-gradient(yellow, blue);
- @include linear-gradient(to top, red 0%, green 50%, orange 100%);
- @include linear-gradient(45deg, orange 0%, pink 50%, green 50.01%, green 50.01%, violet 100%);
пиксели то ем https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/functions/_px-to-em.scss // Convert pixels to ems // eg. for a relational value of 12px write em(12) when the parent is 16px // if the parent is another value say 24px write em(12, 24)
треугольники
- triangle generator
- https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/addons/_triangle.scss
- @include triangle(12px, gray, down);
- @include triangle(12px 6px, gray lavender, up-left);
- The $size argument can take one or two values—width height.
- The $color argument can take one or two values—foreground-color background-color.
- $direction: up, down, left, right, up-right, up-left, down-right, down-left
нестандартные шрифты, осторожно
- @font-face mixin
- Bulletproof font-face via Font Squirrel
- @include fontface('family', 'assets/fonts/', 'myfontname');