From 2f67de89c677458006f522da17ffeb32d0abdf2a Mon Sep 17 00:00:00 2001
From: Artur Arseniev <artur.catch@hotmail.it>
Date: Wed, 11 Dec 2019 19:35:50 +0100
Subject: [PATCH] Make the sync work on different devices

---
 src/selector_manager/view/ClassTagsView.js | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/selector_manager/view/ClassTagsView.js b/src/selector_manager/view/ClassTagsView.js
index eeab53aa1..b3379276a 100644
--- a/src/selector_manager/view/ClassTagsView.js
+++ b/src/selector_manager/view/ClassTagsView.js
@@ -67,7 +67,7 @@ export default Backbone.View.extend({
     this.listenTo(em, toList, this.componentChanged);
     this.listenTo(emitter, 'styleManager:update', this.componentChanged);
     this.listenTo(em, 'component:update:classes', this.updateSelector);
-    this.listenTo(em, 'styleable:change', this.checkSync); // component:styleUpdate
+    this.listenTo(em, 'styleable:change change:device', this.checkSync); // component:styleUpdate
     this.listenTo(coll, 'add', this.addNew);
     this.listenTo(coll, 'reset', this.renderClasses);
     this.listenTo(coll, 'remove', this.tagRemoved);
@@ -75,22 +75,24 @@ export default Backbone.View.extend({
   },
 
   syncStyle() {
-    // { allSelectors }
     const { em } = this;
     const target = this.getTarget();
     const cssC = em.get('CssComposer');
     const selectors = target.get('classes');
     const state = target.get('state');
-    // const device = em.getCurrentMedia();
-    const ruleComponent = cssC.getIdRule(target.getId(), { state });
+    const mediaText = em.getCurrentMedia();
+    const ruleComponent = cssC.getIdRule(target.getId(), { state, mediaText });
     const style = ruleComponent.getStyle();
     const rule =
-      cssC.get(selectors, state) || cssC.add(selectors.models, state);
+      cssC.get(selectors, state, mediaText) ||
+      cssC.add(selectors.models, state, mediaText);
+
     rule.addStyle(style);
     ruleComponent.setStyle({});
     em.trigger('component:toggle');
     em.trigger('component:sync-style', {
       component: target,
+      mediaText,
       rule,
       ruleComponent,
       state