Feat/icons-sprite

abstract/SolutionBlock.js

@@ -1,4 +1,5 @@
 import { uploaderBlockCtx } from './CTX.js';
+import svgIconsSprite from '../blocks/themes/lr-basic/svg-sprite.js';
 import { Block } from './Block.js';
 
 export class SolutionBlock extends Block {
@@ -7,7 +8,7 @@ export class SolutionBlock extends Block {
   _template = null;
 
   static set template(value) {
-    this._template = value + /** HTML */ `<slot></slot>`;
+    this._template = svgIconsSprite + value + /** HTML */ `<slot></slot>`;
   }
 
   static get template() {

blocks/CloudImageEditor/src/EditorButtonControl.js

@@ -43,6 +43,6 @@ export class EditorButtonControl extends Block {
 
 EditorButtonControl.template = /* HTML */ `
   <div class="before"></div>
-  <lr-icon size="20" set="@name: icon;"></lr-icon>
+  <lr-icon set="@name: icon;"></lr-icon>
   <div class="title" ref="title-el">{{title}}</div>
 `;

blocks/CloudImageEditor/src/EditorFilterControl.js

@@ -73,7 +73,7 @@
   initCallback() {
     super.initCallback();
 
     this.$['on.click'] = (e) => {
       if (!this.$.active) {
         this.$['*sliderEl'].setOperation(this._operation, this._filter);
         this.$['*sliderEl'].apply();
@@ -150,5 +150,5 @@
 EditorFilterControl.template = /* HTML */ `
   <div class="before"></div>
   <div class="preview" ref="preview-el"></div>
-  <lr-icon size="40" ref="icon-el" set="@name: icon; @size: iconSize;"></lr-icon>
+  <lr-icon ref="icon-el" set="@name: icon; @size: iconSize;"></lr-icon>
 `;

blocks/CloudImageEditor/src/css/index.css

@@ -1,2 +1 @@
-@import url('icons.css');
 @import url('common.css');

blocks/CloudImageEditor/src/elements/button/LrBtnUi.js

@@ -50,7 +50,7 @@
       }
     });
 
     this.sub('text', (txt) => {
       this._iconSingle = false;
     });
 
@@ -76,6 +76,6 @@
 LrBtnUi.bindAttributes({ text: 'text', icon: 'icon', reverse: 'reverse', theme: 'theme' });
 
 LrBtnUi.template = /* HTML */ `
-  <lr-icon size="20" set="className: iconCss; @name: icon;"></lr-icon>
+  <lr-icon set="className: iconCss; @name: icon;"></lr-icon>
   <div class="text">{{text}}</div>
 `;