From d47a4412f050dc8d44f968567f35e2e76b5fa008 Mon Sep 17 00:00:00 2001 From: TNB Date: Tue, 7 Jul 2026 09:51:34 -0400 Subject: [PATCH] Center component boxes, remove 'Manufacturing' from subtitle, improve single-page PDF layout --- TallyFlow/TallyFlow-Architecture-Diagram.html | 209 +++++++++--------- 1 file changed, 110 insertions(+), 99 deletions(-) diff --git a/TallyFlow/TallyFlow-Architecture-Diagram.html b/TallyFlow/TallyFlow-Architecture-Diagram.html index f68b82c..2209d9e 100644 --- a/TallyFlow/TallyFlow-Architecture-Diagram.html +++ b/TallyFlow/TallyFlow-Architecture-Diagram.html @@ -11,35 +11,46 @@ font-family: 'JetBrains Mono', monospace; background: #020617; min-height: 100vh; - padding: 2rem; + padding: 1.5rem 2rem; color: white; } - .container { max-width: 1200px; margin: 0 auto; } - .header { margin-bottom: 2rem; text-align: center; } - .header-row { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-bottom: 0.5rem; } + .container { max-width: 1180px; margin: 0 auto; } + .header { margin-bottom: 1.25rem; text-align: center; } + .header-row { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-bottom: 0.4rem; } .pulse-dot { width: 12px; height: 12px; background: #22d3ee; border-radius: 50%; animation: pulse 2s infinite; } @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } } - h1 { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.025em; } + h1 { font-size: 1.55rem; font-weight: 700; letter-spacing: -0.025em; } .subtitle { color: #94a3b8; font-size: 0.875rem; } .diagram-container { background: rgba(15, 23, 42, 0.5); border-radius: 1rem; border: 1px solid #1e293b; - padding: 1.5rem; overflow-x: auto; + padding: 1.25rem; overflow-x: auto; + margin-bottom: 1.5rem; + } + svg { width: 100%; min-width: 1050px; display: block; } + .components-row { + display: flex; + justify-content: center; + gap: 1rem; + flex-wrap: wrap; + margin-bottom: 1.5rem; } - svg { width: 100%; min-width: 1000px; display: block; } .cards { - display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); - gap: 1rem; margin-top: 2rem; + display: grid; + grid-template-columns: repeat(5, minmax(0, 1fr)); + gap: 1rem; + max-width: 1180px; + margin: 0 auto; } .card { background: rgba(15, 23, 42, 0.5); border-radius: 0.75rem; border: 1px solid #1e293b; - padding: 1.25rem; + padding: 1.1rem; } - .card-header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; } + .card-header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.6rem; } .card-dot { width: 8px; height: 8px; border-radius: 50%; } .card-dot.cyan { background: #22d3ee; } .card-dot.emerald { background: #34d399; } @@ -48,8 +59,8 @@ .card-dot.orange { background: #fb923c; } .card h3 { font-size: 0.875rem; font-weight: 600; } .card ul { list-style: none; color: #94a3b8; font-size: 0.75rem; } - .card li { margin-bottom: 0.375rem; } - .footer { text-align: center; margin-top: 1.5rem; color: #475569; font-size: 0.75rem; } + .card li { margin-bottom: 0.35rem; } + .footer { text-align: center; margin-top: 1.25rem; color: #475569; font-size: 0.75rem; } @@ -59,11 +70,11 @@

TallyFlow Architecture

-

Manufacturing Asset Tracking & RFID Workflow Platform

+

Asset Tracking & RFID Workflow Platform

- + @@ -80,121 +91,122 @@ - - TallyFlow Core (Central Hub) + + TallyFlow Core (Central Hub) - - Core Web UI - Vue.js 2 - Uses Core API + + Core Web UI + Vue.js 2 + Uses Core API - - Core Backend - Go (REST API) - REST + WebSocket + + Core Backend + Go (REST API) + REST + WebSocket - - MongoDB - Assets • Tags • Photos • Zones - (owned by Core Backend) + + MongoDB + Assets • Tags • Photos • Zones + (owned by Core Backend) - - Auth Service - Login + SSO support + + Auth Service + Login + SSO support - Core API Layer — single integration point for all components + Core API Layer — single integration point for all components - - - Assets - (Mobile) - Flutter - Seek & Find • Inventory - Enrollment + + + Assets + (Mobile) + Flutter + Seek & Find • Inventory + Enrollment - - - Print - Flutter + Rust - Zebra ZPL • RFID - Print UI + API • Registers assets + + + Print + Flutter + Rust + Zebra ZPL • RFID + Print UI + API • Registers assets - - Capture - (PhotoTag) - Native App - Photo + Barcode QC + + Capture + (PhotoTag) + Native App + Photo + Barcode QC - - IoT - Rust - Fixed Readers • Sensors - MQTT / HTTP • ERP integration + + IoT + Rust + Fixed Readers • Sensors + MQTT / HTTP • ERP integration - - API Sync + + API Sync - - - Print Jobs + Asset Reg + + + Print Jobs + Asset Reg - - Photos + Metadata + + Photos + Metadata - - Events (optional) + + Events (optional) - - + + - + - Legend + Legend - - Core (Go + Vue.js + MongoDB) + + Core (Go + Vue.js + MongoDB) - - Assets (Flutter) + + Assets (Flutter) - - Print (Flutter/Rust + UI) + + Print (Flutter/Rust + UI) - - Capture (Native) + + Capture (Native) - - IoT (Rust) + + IoT (Rust) - - Optional flow + + Optional flow
-
+ +

Core (Central)

    -
  • • Go backend (center) + Vue.js Web UI (left)
    • -
  • • Auth Service: Login + SSO support
    • -
  • • Owns MongoDB (assets, tags, photos, zones)
    • +
  • • Go backend + Vue.js Web UI
    • +
  • • Auth Service: Login + SSO
    • +
  • • Owns MongoDB
  • • Single API integration point
@@ -204,9 +216,9 @@

Assets (Mobile)

@@ -217,9 +229,9 @@
@@ -228,9 +240,9 @@

Capture

@@ -241,16 +253,15 @@

- TallyFlow • Manufacturing Asset Tracking & RFID Workflow Platform + TallyFlow • Asset Tracking & RFID Workflow Platform