fix(big fix upgrade): upgrade multiple areas of the core functionalities

ts_web/elements/cloudly-dashboard.ts

@@ -97,6 +97,10 @@ export class CloudlyDashboard extends DeesElement {
                 name: 'Services',
                 element: CloudlyViewServices,
               },
+              {
+                name: 'Testing & Building',
+                element: CloudlyViewServices,
+              },
               {
                 name: 'Deployments',
                 element: CloudlyViewDeployments,

ts_web/elements/cloudly-view-backups.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,13 +32,9 @@ export class CloudlyViewBackups extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+      
     `,
   ];
 

ts_web/elements/cloudly-view-clusters.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,13 +32,9 @@ export class CloudlyViewClusters extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+      
     `,
   ];
 

ts_web/elements/cloudly-view-dbs.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,13 +32,9 @@ export class CloudlyViewDbs extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+      
     `,
   ];
 

ts_web/elements/cloudly-view-deployments.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,13 +32,9 @@ export class CloudlyViewDeployments extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+     
     `,
   ];
 

ts_web/elements/cloudly-view-dns.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,13 +32,8 @@ export class CloudlyViewDns extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
-    css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+    shared.viewHostCss,
+    css` 
     `,
   ];
 

ts_web/elements/cloudly-view-images.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import { DeesElement, customElement, html, state, css, cssManager } from '@design.estate/dees-element';
 
@@ -23,13 +24,9 @@ export class CloudlyViewImages extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+      
     `,
   ];
 

ts_web/elements/cloudly-view-logs.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,13 +32,9 @@ export class CloudlyViewLogs extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+      
     `,
   ];
 

ts_web/elements/cloudly-view-mails.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,14 +32,8 @@ export class CloudlyViewMails extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
-    css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
-    `,
+    shared.viewHostCss,
+    css``
   ];
 
   public render() {

ts_web/elements/cloudly-view-overview.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,13 +32,8 @@ export class CloudlyViewOverview extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 8px 16px;
-      }
       .clusterGrid {
         display: grid;
         grid-template-columns: ${cssManager.cssGridColumns(3, 8)};

ts_web/elements/cloudly-view-s3.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,13 +32,9 @@ export class CloudlyViewS3 extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+      
     `,
   ];
 

ts_web/elements/cloudly-view-secretbundles.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,13 +32,9 @@ export class CloudlyViewSecretBundles extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+      
     `,
   ];
 

ts_web/elements/cloudly-view-secretgroups.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import { DeesElement, customElement, html, state, css, cssManager } from '@design.estate/dees-element';
 
@@ -23,13 +24,9 @@ export class CloudlyViewSecretGroups extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+      
     `,
   ];
 

ts_web/elements/cloudly-view-services.ts

@@ -1,4 +1,5 @@
 import * as plugins from '../plugins.js';
+import * as shared from '../elements/shared/index.js';
 
 import {
   DeesElement,
@@ -31,13 +32,9 @@ export class CloudlyViewServices extends DeesElement {
 
   public static styles = [
     cssManager.defaultStyles,
+    shared.viewHostCss,
     css`
-      :host {
-        display: block;
-        margin: auto;
-        max-width: 1280px;
-        padding: 16px 16px;
-      }
+      
     `,
   ];
 

ts_web/elements/shared/cloudly-sectionheading.ts

@@ -21,6 +21,8 @@ export class CloudlySectionheading extends DeesElement {
       h1 {
         font-family: 'Cal Sans';
         letter-spacing: 0.025em;
+        margin: 0px;
+        margin-bottom: 16px;
       }
     `,
   ]

ts_web/elements/shared/css.ts

@@ -0,0 +1,10 @@
+import { css } from '@design.estate/dees-element';
+
+export const viewHostCss = css`
+  :host {
+    display: block;
+    margin: auto;
+    max-width: 1280px;
+    padding: 16px 16px;
+  }
+`;

ts_web/elements/shared/index.ts

@@ -1 +1,2 @@
-export * from './cloudly-sectionheading.js';
+export * from './cloudly-sectionheading.js';
+export * from './css.js';