improvements to backcompat + fixes to topbar

src/components/top_bar.style.js

@@ -13,7 +13,15 @@ export default {
   defaultRules: [
     {
       directives: {
-        background: '--fg'
+        background: '--fg',
+        shadow: [{
+          x: 0,
+          y: 0,
+          blur: 4,
+          spread: 0,
+          color: '#000000',
+          alpha: 0.6
+        }]
       }
     }
   ]

src/services/style_setter/style_setter.js

@@ -13,7 +13,6 @@ export const applyTheme = (input) => {
   const t1 = performance.now()
   console.log('Themes 2 initialization took ' + (t1 - t0) + 'ms')
   const extraRules = convertTheme2To3(theme)
-  console.log(extraRules)
   const themes3 = init(extraRules)
   const t2 = performance.now()
   console.log('Themes 3 initialization took ' + (t2 - t1) + 'ms')

src/services/theme_data/theme2_to_theme3.js

@@ -222,7 +222,7 @@ export const convertTheme2To3 = (data) => {
       rule.variant = 'outgoing'
     } else if (prefix === 'panel') {
       rule.component = 'PanelHeader'
-    } else if (prefix === 'topbar') {
+    } else if (prefix === 'topBar') {
       rule.component = 'TopBar'
     } else if (prefix === 'chatMessage') {
       rule.component = 'ChatMessage'
@@ -248,6 +248,7 @@ export const convertTheme2To3 = (data) => {
         case 'Border':
           newRule.parent = rule
           newRule.directives.textColor = data.colors[key]
+          newRule.directives.textAuto = 'no-auto'
           variantArray = parts.slice(0, -1)
           break
         default:

top_bar.style.js

@@ -1,23 +0,0 @@
-export default {
-  name: 'TopBar',
-  selector: 'nav',
-  validInnerComponents: [
-    'Link',
-    'Text',
-    'Icon'
-  ],
-  defaultRules: [
-    {
-      directives: {
-        shadow: [{
-          x: 0,
-          y: 0,
-          blur: 4,
-          spread: 0,
-          color: '#000000',
-          alpha: 0.6
-        }]
-      }
-    }
-  ]
-}