diff --git a/demo/nginx.yaml b/demo/nginx.yaml index a8d1c32..a40cb62 100644 --- a/demo/nginx.yaml +++ b/demo/nginx.yaml @@ -5,12 +5,586 @@ metadata: namespace: demo spec: accessModes: - - ReadWriteMany + - ReadWriteMany resources: requests: storage: 8M storageClassName: cephfs-hyper --- +apiVersion: v1 +kind: ConfigMap +metadata: + name: demo-site-html + namespace: demo +data: + index.html: | + + + + + + UNDERCLOUD // TRIOPTIMUM + + + +
+
+ +
+
+ UNDERCLOUD + // + TRIOPTIMUM NODE +
+ +
+ +
+
+
+

ORBITAL INFRASTRUCTURE INTERFACE

+

+ Welcome to the Undercloud experimental systems layer. +

+

+ A strange lattice of services, ghost processes and machine dreams. + TriOptimum-certified aesthetics. Undercloud-engineered resilience. + No comfort layer. No soft edges. Only signal. +

+ + +
+ +
+
FACILITY TELEMETRY
+
+
+ cluster_state + OPERATIONAL +
+
+ uplink + DUAL STACK +
+
+ reactor_noise + ELEVATED +
+
+ human_factor + UNSTABLE +
+
+
+
+ +
+
+
CORE SYSTEMS
+
    +
  • Kubernetes control mesh
  • +
  • Distributed storage substrate
  • +
  • Ingress perimeter gateways
  • +
  • Identity and access vaults
  • +
  • Monitoring, logging, archive traces
  • +
+
+ +
+
ENVIRONMENT NOTES
+

+ This station was not designed for beauty. It acquired beauty + accidentally, through redundancy, persistence and the glow of + machines still running long after anyone expected them to. +

+
+
+ +
+
NETWORK TOPOLOGY SUMMARY
+
+

> resolving undercloud fabric...

+

> ingress gateways online

+

> east-west traffic nominal

+

> ipv6 preferred

+

> legacy ipv4 tolerated

+

> anomalous whispers detected in lower transit layers

+
+
+ +
+
+
TRIOPTIMUM DIRECTIVE
+
+ Build systems that feel like forgotten stations at the edge of + mapped space: durable, haunted, luminous, and slightly hostile to + the uninitiated. +
+
+ +
+
UNDERCLOUD PRINCIPLES
+
    +
  • Prefer transparency over convenience
  • +
  • Prefer resilience over elegance
  • +
  • Prefer working IPv6 over almost-working IPv4
  • +
  • Prefer weirdness over blandness
  • +
+
+
+ +
+
NODE STATUS BOARD
+
+
+ identity + ONLINE +
+
+ storage + SYNCED +
+
+ ingress + ROUTING +
+
+ observability + NOISY +
+
+ experimental lab + UNSUPERVISED +
+
+ trioptimum ethics + NOT FOUND +
+
+
+
+ + + + +--- +apiVersion: v1 +kind: ConfigMap +metadata: + name: demo-site-css + namespace: demo +data: + styles.css: | + :root { + --bg: #060816; + --bg2: #0c1026; + --panel: rgba(10, 16, 38, 0.72); + --line: rgba(92, 240, 255, 0.24); + --text: #d7f7ff; + --muted: #89a9b8; + --cyan: #67f0ff; + --magenta: #ff4fd8; + --lime: #b9ff66; + --yellow: #ffd36a; + --red: #ff647c; + --shadow: 0 0 24px rgba(103, 240, 255, 0.08); + } + + * { + box-sizing: border-box; + } + + html, body { + margin: 0; + padding: 0; + background: + radial-gradient(circle at top left, rgba(255, 79, 216, 0.12), transparent 28%), + radial-gradient(circle at top right, rgba(103, 240, 255, 0.10), transparent 24%), + linear-gradient(180deg, var(--bg2), var(--bg)); + color: var(--text); + font-family: "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif; + min-height: 100%; + scroll-behavior: smooth; + } + + body { + position: relative; + overflow-x: hidden; + } + + .scanlines { + position: fixed; + inset: 0; + pointer-events: none; + background: + linear-gradient( + to bottom, + rgba(255,255,255,0.03) 0, + rgba(255,255,255,0.03) 1px, + transparent 1px, + transparent 3px + ); + opacity: 0.12; + z-index: 999; + } + + .noise { + position: fixed; + inset: 0; + pointer-events: none; + background: + repeating-linear-gradient( + 90deg, + rgba(255,255,255,0.015) 0, + rgba(255,255,255,0.015) 1px, + transparent 1px, + transparent 4px + ); + opacity: 0.08; + z-index: 998; + } + + .topbar { + position: sticky; + top: 0; + z-index: 100; + display: flex; + justify-content: space-between; + align-items: center; + gap: 1rem; + padding: 1rem 2rem; + background: rgba(3, 6, 18, 0.75); + backdrop-filter: blur(8px); + border-bottom: 1px solid var(--line); + } + + .brand { + display: flex; + flex-wrap: wrap; + gap: 0.5rem; + align-items: baseline; + letter-spacing: 0.12em; + text-transform: uppercase; + } + + .brand-main { + color: var(--cyan); + font-weight: 800; + } + + .brand-sep { + color: var(--magenta); + font-weight: 700; + } + + .brand-sub { + color: var(--muted); + font-size: 0.9rem; + } + + .nav { + display: flex; + flex-wrap: wrap; + gap: 1rem; + } + + .nav a { + color: var(--text); + text-decoration: none; + font-size: 0.95rem; + opacity: 0.85; + } + + .nav a:hover { + color: var(--cyan); + opacity: 1; + } + + .container { + max-width: 1200px; + margin: 0 auto; + padding: 2rem; + } + + .hero { + display: grid; + grid-template-columns: 1.35fr 0.9fr; + gap: 1.5rem; + align-items: stretch; + margin-bottom: 1.5rem; + } + + .hero-left, + .hero-right, + .panel { + border: 1px solid var(--line); + background: var(--panel); + box-shadow: var(--shadow); + border-radius: 14px; + } + + .hero-left { + padding: 2rem; + position: relative; + overflow: hidden; + } + + .hero-left::before { + content: ""; + position: absolute; + inset: 0; + background: + linear-gradient(120deg, transparent, rgba(103,240,255,0.06), transparent); + transform: translateX(-100%); + animation: sweep 8s linear infinite; + } + + @keyframes sweep { + to { + transform: translateX(100%); + } + } + + .eyebrow { + color: var(--magenta); + text-transform: uppercase; + letter-spacing: 0.16em; + font-size: 0.8rem; + margin-bottom: 1rem; + } + + h1 { + margin: 0 0 1rem 0; + font-size: clamp(2rem, 5vw, 4rem); + line-height: 1.05; + max-width: 12ch; + } + + h1 span { + color: var(--cyan); + text-shadow: 0 0 12px rgba(103, 240, 255, 0.35); + } + + .lead { + color: var(--muted); + font-size: 1.05rem; + line-height: 1.7; + max-width: 68ch; + } + + .cta-row { + display: flex; + flex-wrap: wrap; + gap: 1rem; + margin-top: 2rem; + } + + .btn { + display: inline-block; + padding: 0.9rem 1.2rem; + text-decoration: none; + text-transform: uppercase; + letter-spacing: 0.12em; + font-size: 0.82rem; + border-radius: 10px; + border: 1px solid var(--line); + transition: transform 0.15s ease, box-shadow 0.15s ease; + } + + .btn:hover { + transform: translateY(-2px); + box-shadow: 0 0 16px rgba(103, 240, 255, 0.18); + } + + .btn-primary { + background: rgba(103, 240, 255, 0.12); + color: var(--cyan); + } + + .btn-secondary { + background: rgba(255, 79, 216, 0.10); + color: #ffd4f7; + } + + .panel { + padding: 1.25rem; + margin-bottom: 1.5rem; + } + + .panel-header { + color: var(--lime); + text-transform: uppercase; + letter-spacing: 0.14em; + font-size: 0.8rem; + margin-bottom: 1rem; + border-bottom: 1px solid rgba(185, 255, 102, 0.18); + padding-bottom: 0.6rem; + } + + .telemetry { + display: grid; + gap: 0.75rem; + } + + .metric { + display: flex; + justify-content: space-between; + gap: 1rem; + padding: 0.75rem 0.9rem; + background: rgba(255,255,255,0.02); + border: 1px solid rgba(255,255,255,0.05); + border-radius: 10px; + } + + .label { + color: var(--muted); + font-family: "Courier New", monospace; + } + + .value { + font-weight: 700; + letter-spacing: 0.08em; + } + + .ok { color: var(--lime); } + .warn { color: var(--yellow); } + .crit { color: var(--red); } + + .grid.two { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 1.5rem; + } + + .list { + margin: 0; + padding-left: 1.2rem; + color: var(--muted); + line-height: 1.8; + } + + .terminal { + font-family: "Courier New", monospace; + color: var(--cyan); + background: rgba(0,0,0,0.22); + border: 1px solid rgba(103,240,255,0.12); + border-radius: 10px; + padding: 1rem; + } + + .terminal p { + margin: 0.35rem 0; + } + + blockquote { + margin: 0; + padding-left: 1rem; + border-left: 3px solid var(--magenta); + color: #f2d7ff; + line-height: 1.8; + font-size: 1.05rem; + } + + .status-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); + gap: 1rem; + } + + .status-card { + border: 1px solid rgba(255,255,255,0.06); + background: rgba(255,255,255,0.02); + border-radius: 12px; + padding: 1rem; + display: flex; + flex-direction: column; + gap: 0.7rem; + } + + .status-name { + color: var(--text); + text-transform: lowercase; + letter-spacing: 0.04em; + } + + .status-pill { + align-self: flex-start; + padding: 0.35rem 0.6rem; + border-radius: 999px; + font-size: 0.75rem; + font-weight: 700; + letter-spacing: 0.1em; + background: rgba(255,255,255,0.04); + border: 1px solid currentColor; + } + + .footer { + padding: 2rem; + text-align: center; + color: var(--muted); + text-transform: uppercase; + letter-spacing: 0.12em; + font-size: 0.78rem; + } + + @media (max-width: 900px) { + .hero, + .grid.two { + grid-template-columns: 1fr; + } + + .topbar { + align-items: flex-start; + flex-direction: column; + } + + .container { + padding: 1rem; + } + + .hero-left { + padding: 1.5rem; + } + } +--- +apiVersion: v1 +kind: ConfigMap +metadata: + name: demo-nginx-conf + namespace: demo +data: + default.conf: | + server { + listen 80; + listen [::]:80; + server_name _; + + root /usr/share/nginx/html; + index index.html; + + location / { + try_files $uri $uri/ /index.html; + } + + location = /styles.css { + add_header Cache-Control "public, max-age=3600"; + } + + add_header X-Content-Type-Options nosniff always; + add_header X-Frame-Options SAMEORIGIN always; + add_header Referrer-Policy no-referrer-when-downgrade always; + } +--- apiVersion: apps/v1 kind: Deployment metadata: @@ -30,26 +604,56 @@ spec: labels: app: nginx spec: + initContainers: + - name: install-site + image: busybox:1.36 + command: + - sh + - -c + - | + set -eu + cp /site-html/index.html /workdir/index.html + cp /site-css/styles.css /workdir/styles.css + ls -la /workdir + volumeMounts: + - name: html + mountPath: /workdir + - name: site-html + mountPath: /site-html + - name: site-css + mountPath: /site-css containers: - - name: nginx - image: nginx - imagePullPolicy: IfNotPresent - ports: - - containerPort: 443 - - containerPort: 80 - env: - - name: PUID - value: "1000" - - name: PGID - value: "1000" - volumeMounts: - - mountPath: /usr/share/nginx/html - name: html + - name: nginx + image: nginx:stable + imagePullPolicy: IfNotPresent + ports: + - containerPort: 80 + - containerPort: 443 + env: + - name: PUID + value: "1000" + - name: PGID + value: "1000" + volumeMounts: + - mountPath: /usr/share/nginx/html + name: html + - mountPath: /etc/nginx/conf.d/default.conf + name: nginx-conf + subPath: default.conf volumes: - - name: html - persistentVolumeClaim: - claimName: html - readOnly: false + - name: html + persistentVolumeClaim: + claimName: html + readOnly: false + - name: site-html + configMap: + name: demo-site-html + - name: site-css + configMap: + name: demo-site-css + - name: nginx-conf + configMap: + name: demo-nginx-conf --- apiVersion: v1 kind: Service @@ -61,20 +665,18 @@ metadata: spec: internalTrafficPolicy: Cluster ipFamilies: - - IPv6 - - IPv4 + - IPv6 + - IPv4 ipFamilyPolicy: PreferDualStack - #ipFamilyPolicy: SingleStack ports: - - name: https - port: 443 - protocol: TCP - targetPort: 443 - - name: http - port: 80 - protocol: TCP - targetPort: 80 + - name: https + port: 443 + protocol: TCP + targetPort: 443 + - name: http + port: 80 + protocol: TCP + targetPort: 80 selector: app: nginx - #sessionAffinity: None - type: ClusterIP + type: ClusterIP \ No newline at end of file