@things-factory/operato-tools 7.0.1-rc.10 → 7.0.1-rc.12

package/client/pages/generator/meta-generator-page.js

@@ -49,7 +49,7 @@ class MetaGeneratorPage extends MenuConfigTabMixin(
           display: flex;
           flex-direction: column;
           background-color: var(--md-sys-color-background);
-          padding: var(--padding-wide);
+          padding: var(--spacing-large);
           overflow: auto;
         }
         h1 {
@@ -78,8 +78,8 @@ class MetaGeneratorPage extends MenuConfigTabMixin(
         .tab {
           background-color: var(--md-sys-color-secondary-container);
           color: var(--md-sys-color-on-secondary-container);
-          margin-top: var(--margin-default);
-          padding: var(--padding-narrow) var(--padding-wide) 0 var(--padding-wide);
+          margin-top: var(--spacing-medium);
+          padding: var(--spacing-small) var(--spacing-large) 0 var(--spacing-large);
           border-radius: 9px 9px 0 0;
           border-right: 1px solid rgba(0, 0, 0, 0.4);
           text-transform: capitalize;
@@ -120,8 +120,8 @@ class MetaGeneratorPage extends MenuConfigTabMixin(
 
         [field-2column] {
           background-color: var(--md-sys-color-surface);
-          margin: var(--margin-wide) 0;
-          padding: var(--padding-wide);
+          margin: var(--spacing-large) 0;
+          padding: var(--spacing-large);
           border-radius: var(--border-radius);
           box-shadow: var(--box-shadow);
           display: grid;
@@ -133,12 +133,12 @@ class MetaGeneratorPage extends MenuConfigTabMixin(
         [field] {
           display: flex;
           flex-direction: column;
-          padding-bottom: var(--padding-default);
+          padding-bottom: var(--spacing-medium);
         }
         [subfield] {
           background-color: var(--md-sys-color-surface-variant);
-          margin: var(--margin-wide) 0;
-          padding: var(--padding-wide);
+          margin: var(--spacing-large) 0;
+          padding: var(--spacing-large);
           border-radius: var(--border-radius);
           box-shadow: var(--box-shadow);
           gap: 5px 15px;

package/client/pages/main.js

@@ -11,7 +11,7 @@ class OperatoToolsMain extends connect(store)(PageView) {
         :host {
           display: block;
           background-color: var(--md-sys-color-background);
-          padding: var(--padding-wide);
+          padding: var(--spacing-large);
           overflow: auto;
         }
         h2 {