feat(web/services): add deploy service action to the services view

changelog.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## 2026-03-16 - 1.17.0 - feat(web/services)
+add deploy service action to the services view
+
+- Adds a prominent "Deploy Service" button to the services page header.
+- Routes users into the create service view directly from the services listing.
+- Includes a new service creation form screenshot asset for the updated interface.
+
 ## 2026-03-16 - 1.16.0 - feat(services)
 add platform service navigation and stats in the services UI
 

ts/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/onebox',
-  version: '1.16.0',
+  version: '1.17.0',
   description: 'Self-hosted container platform with automatic SSL and DNS - a mini Heroku for single servers'
 }

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/onebox',
-  version: '1.16.0',
+  version: '1.17.0',
   description: 'Self-hosted container platform with automatic SSL and DNS - a mini Heroku for single servers'
 }

ts_web/elements/ob-view-services.ts

@@ -146,7 +146,37 @@ export class ObViewServices extends DeesElement {
   public static styles = [
     cssManager.defaultStyles,
     shared.viewHostCss,
-    css``,
+    css`
+      .page-actions {
+        display: flex;
+        justify-content: flex-end;
+        margin-bottom: 16px;
+      }
+
+      .deploy-button {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        padding: 10px 20px;
+        background: ${cssManager.bdTheme('#18181b', '#fafafa')};
+        color: ${cssManager.bdTheme('#fafafa', '#18181b')};
+        border: none;
+        border-radius: 6px;
+        font-size: 14px;
+        font-weight: 500;
+        cursor: pointer;
+        transition: opacity 200ms ease;
+      }
+
+      .deploy-button:hover {
+        opacity: 0.9;
+      }
+
+      .deploy-button svg {
+        width: 16px;
+        height: 16px;
+      }
+    `,
   ];
 
   async connectedCallback() {
@@ -199,6 +229,15 @@ export class ObViewServices extends DeesElement {
     }));
     return html`
       <ob-sectionheading>Services</ob-sectionheading>
+      <div class="page-actions">
+        <button class="deploy-button" @click=${() => { this.currentView = 'create'; }}>
+          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <line x1="12" y1="5" x2="12" y2="19"></line>
+            <line x1="5" y1="12" x2="19" y2="12"></line>
+          </svg>
+          Deploy Service
+        </button>
+      </div>
       <sz-services-list-view
         .services=${mappedServices}
         @service-click=${(e: CustomEvent) => {