from bb

Author: Кирилл Э. Федотов

.enb/make.js

@@ -18,7 +18,7 @@ const techs = {
             require('postcss-calc')(),
             require('postcss-nested'),
             require('rebem-css'),
-            require('postcss-url')({ url: 'inline' }),
+            require('postcss-url')({ url: 'rebase' }),
             require('autoprefixer')(),
             require('postcss-reporter')()
         ],
@@ -41,7 +41,7 @@ const techs = {
         { path: 'node_modules/bem-components-custom/desktop.blocks', check: false },
         { path: 'node_modules/bem-components-custom/design/common.blocks', check: false },
         { path: 'node_modules/bem-components-custom/design/desktop.blocks', check: false },
-        { path: 'node_modules/whitepaper-bem', check: false },
+
         'common.blocks',
         'desktop.blocks',
     ];
@@ -120,4 +120,4 @@ module.exports = function(config) {
 
         // nodeConfig.addTargets([/* '?.bemtree.js', */ '../../?.html', '../../?.min.css', '../../?.min.js']);
     });
-};
+};

assets/rocket.png

@@ -0,0 +1,4 @@
+.avatar__photo_size_l {
+    width: var(--graphics-size-3xl);
+    height: var(--graphics-size-3xl);
+}

assets/trolly.svg

@@ -0,0 +1,4 @@
+.avatar__photo_size_m {
+    width: var(--graphics-size-2xl);
+    height: var(--graphics-size-2xl);
+}

common.blocks/avatar/__photo/_size/avatar__photo_size_l.post.css

@@ -0,0 +1,4 @@
+.avatar__photo_size_s {
+    width: var(--graphics-size-xl);
+    height: var(--graphics-size-xl);
+}

common.blocks/avatar/__photo/_size/avatar__photo_size_m.post.css

@@ -0,0 +1,4 @@
+.avatar__photo_size_xs {
+    width: var(--graphics-size-l);
+    height: var(--graphics-size-l);
+}

common.blocks/avatar/__photo/_size/avatar__photo_size_s.post.css

@@ -0,0 +1,8 @@
+.avatar__photo {
+    border-radius: 50%;
+    height: 100%;
+    overflow: hidden;
+    background-image: url("data:image/svg+xml,%3Csvg width='80' height='80' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23D8D8D8' fill-rule='evenodd'%3E%3Cpath d='M78 80c0-22.091-12-30-38-30S2 57.909 2 80h76zM40 45c8.942 0 15.048-8.954 16-20 1.143-13.258-7.058-20-16-20s-17.143 6.741-16 20c.952 11.046 7.058 20 16 20z'/%3E%3C/g%3E%3C/svg%3E");
+    background-size: cover;
+    object-fit: cover;
+}

common.blocks/avatar/__photo/_size/avatar__photo_size_xs.post.css

@@ -0,0 +1,26 @@
+# avatar
+
+Блок для отображения аватарки пользователя. Если изображение неопределено вставляется дефолтная картинка.
+
+``` html
+<div class="avatar">
+    <div class="avatar__photo avatar__photo_size_m"></div>
+</div>
+```
+
+## Живые примеры и дизайн
+
+[avatar на whitepaper.tools](http://whitepaper.tools/doc.html#/content-avatar)
+
+___
+
+
+## Элементы блока
+
+### Элемент photo
+
+Элемент в который вставляется аватарка пользователя. За счёт модификаторов регулируется размер изображения.
+
+Модификатор элемента | Значение         | Описание
+-------------------- | ---------------- | --------
+`size`               | `xs` `s` `m` `l` | Размер

common.blocks/avatar/__photo/avatar__photo.post.css

@@ -0,0 +1,4 @@
+.avatar {
+    display: inline-block;
+    position: relative;
+}