fix(core): update

ts_web/elements/dees-spinner.ts

@@ -23,6 +23,8 @@ export class DeesSpinner extends DeesElement {
     <dees-spinner></dees-spinner>
     <dees-spinner status="success"></dees-spinner>
     <dees-spinner status="error"></dees-spinner>
+    <dees-spinner size=${64} status="success"></dees-spinner>
+    <dees-spinner .size=${64} status="error"></dees-spinner>
   `;
 
   @property({
@@ -45,6 +47,7 @@ export class DeesSpinner extends DeesElement {
       }
 
       #loading {
+        position: relative;
         transition: none;
         display: flex;
         justify-content: center;
@@ -84,36 +87,11 @@ export class DeesSpinner extends DeesElement {
         }
       }
 
-      #loading .checkmark {
-        display: inline-block;
-        width: 22px;
-        height: 22px;
-        -ms-transform: rotate(45deg); /* IE 9 */
-        -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
-        transform: rotate(45deg);
-      }
-
-      #loading .checkmark_stem {
+      dees-icon {
+        color: #fff;
         position: absolute;
-        width: 3px;
-        height: 9px;
-        background-color: #fff;
-        left: 9px;
-        top: 5px;
-      }
-
-      #loading .checkmark_kick {
-        position: absolute;
-        width: 3px;
-        height: 3px;
-        background-color: #fff;
-        left: 6px;
-        top: 11px;
-      }
-
-      #loading.disabled .checkmark_stem,
-      #loading.disabled .checkmark_kick {
-        background-color: ${cssManager.bdTheme('#333', '#fff')};
+        height: 100%;
+        width: 100%;
       }
     `,
   ];
@@ -125,16 +103,18 @@ export class DeesSpinner extends DeesElement {
           width: ${this.size}px;
           height: ${this.size}px;
         }
+        dees-icon {
+          font-size: ${Math.round(this.size * 0.6)}px;
+        }
       </style>
       <div class="${this.status}" id="loading">
-        ${this.status === 'success' || this.status === 'error'
-          ? html`
-              <span class="checkmark">
-                <div class="checkmark_stem"></div>
-                <div class="checkmark_kick"></div>
-              </span>
-            `
-          : null}
+        ${(() => {
+          if (this.status === 'success') {
+            return html`<dees-icon style="transform: translateX(1%) translateY(3%);" .iconFA=${'check' as any}></dees-icon>`;
+          } else if (this.status === 'error') {
+            return  html`<dees-icon .iconFA=${'xmark' as any}></dees-icon>`;
+          }
+        })()}
       </div>
     `;
   }