Meta Tour — Architecture Overview

Section 1

System architecture

The complete layered structure of the Meta Tour application. Flask serves Jinja2 templates backed by static JS modules. Click any node for details.

User

browser

Core · Application

Flask Application (app.py)

56 routes · Jinja2 templates · Static prototype · No database (mock data)

renders templates

Layer 1 · Templates

HTML Templates

37 pages across 14 directories · Jinja2 inheritance from base.html

Layer 2 · Assets

Static Assets

1 CSS file · 14 JS modules · Light/dark theme system

Layer 3 · Structure

Sidebar & Navigation

base.html · 8 collapsible sidebar sections · Responsive layout

Current phase: Meta Tour is a fully-featured UI prototype. All routes are registered and return rendered templates with mock data. The architecture is structured for a straightforward database integration layer — replacing MOCK_STATS with SQLAlchemy models and real queries is the primary path to production.

Section 2

Module map

All 20 functional modules across the application. Each card shows the module's scope and key pages. Click any card for full detail.

Section 3

Navigation flows

Four key user journeys through the system — from first action to completion. Click any step to see detail in the panel.

Section 4

Page inventory

Every registered route in app.py, grouped by module. 56 routes total across 20 modules.

Section 5

Integration points

How modules connect and reference one another. These are the cross-module links built into the UI. Click any card for detail.

Section 6

Summary

At a glance — the full scope of the Meta Tour prototype.

System statistics

37

Templates

56

Routes

14

JS Modules

20

Modules

8

Sidebar Sections

14

Template Dirs

Technology stack

Flask — Python web framework, Jinja2 templating

Tailwind CSS — utility-first CSS via CDN

Custom CSS — CSS variables, light/dark theme

Vanilla JS — 14 focused modules, no framework

Heroicons — SVG icon set throughout

No database — prototype phase, mock data only

No auth — ready for Flask-Login integration

Sidebar navigation structure

Dashboard1 link — main dashboard

Product Management1 link — Products

Sales & Operations8 links — Quotes, Bookings, Groups, Vouchers, Voucher Stock, Customers, Suppliers, Operations, Agents

Transportation5 links — Dashboard, Flights, Fleet, Transfers, Car Rentals, Drivers

Finance3 links — Invoices, Payments, Accounting

Analytics2 links — Reports, Report Builder

Communications3 links — Communications, Documents, Calendar

Administration2 links — Settings, Audit Log

    Meta Tour — Architecture Overview v1.0 — March 2026  ·  Metalogix Solutions
  