Separate styling in component.

Dennis Labordus · Dennis Labordus · commit 78ab16d73c2e · 2021-12-13T07:57:57.000+01:00
Signed-off-by: Dennis Labordus &lt;dennis.labordus@alliander.com&gt;
diff --git a/src/compas/CompasSettings.ts b/src/compas/CompasSettings.ts
@@ -108,8 +108,7 @@ export class CompasSettingsElement extends LitElement {
                      value="${this.compasSettings.sclAutoAlignmentServiceUrl}" required>
       </mwc-textfield>
 
-      <mwc-button style="--mdc-theme-primary: var(--mdc-theme-error)"
-                  @click=${() => {
+      <mwc-button @click=${() => {
                     if (this.reset()) {
                       this.close();
                     }
@@ -127,6 +126,10 @@ export class CompasSettingsElement extends LitElement {
       margin: 10px;
       width: 100%;
     }
+
+    mwc-button {
+      --mdc-theme-primary: var(--mdc-theme-error)
+    }
   `
 }
 

Original file line number	Diff line number	Diff line change
`@@ -108,8 +108,7 @@ export class CompasSettingsElement extends LitElement {`
`108`	`108`	`value="${this.compasSettings.sclAutoAlignmentServiceUrl}" required>`
`109`	`109`	`</mwc-textfield>`
`110`	`110`
`111`		`- <mwc-button style="--mdc-theme-primary: var(--mdc-theme-error)"`
`112`		`- @click=${() => {`
	`111`	`+ <mwc-button @click=${() => {`
`113`	`112`	`if (this.reset()) {`
`114`	`113`	`this.close();`
`115`	`114`	`}`
`@@ -127,6 +126,10 @@ export class CompasSettingsElement extends LitElement {`
`127`	`126`	`margin: 10px;`
`128`	`127`	`width: 100%;`
`129`	`128`	`}`
	`129`	`+`
	`130`	`+ mwc-button {`
	`131`	`+ --mdc-theme-primary: var(--mdc-theme-error)`
	`132`	`+ }`
`130`	`133`	`
`131`	`134`	`}`
`132`	`135`