Docker buid issue

fuse-starter-v20.0.0/Dockerfile

@@ -1,69 +1,34 @@
 # ===============================
-# Stage 1: Build Angular 18 app
+# Stage 1: Build Angular app
 # ===============================
 FROM node:18-alpine AS builder
 
-# Set working directory
+WORKDIR /app
-WORKDIR /project
 
-# Install Angular CLI 18
+# Copy package files and install dependencies
-RUN npm install -g @angular/cli@18.0.2
-
-# Copy package files
 COPY package*.json ./
-
-# Install dependencies
 RUN npm ci --legacy-peer-deps
 
-# Copy all source files
+# Copy source and build
 COPY . .
-
+RUN npm run build
-# Build for production (output goes to dist/fuse)
-RUN ng build --configuration production
 
 # ===============================
 # Stage 2: Serve with Nginx
 # ===============================
 FROM nginx:alpine
 
-# Copy built files from builder (note: dist/fuse, not dist/fuse-angular)
+# Copy built files
-COPY --from=builder /project/dist/fuse/browser /usr/share/nginx/html
+COPY --from=builder /app/dist/fuse/browser /usr/share/nginx/html
 
-# Create Nginx configuration
+# Simple nginx config for Angular SPA
-RUN echo 'server { \
+RUN echo 'server { \n\
-    listen 80; \
+    listen 80; \n\
-    server_name localhost; \
+    root /usr/share/nginx/html; \n\
-    root /usr/share/nginx/html; \
+    index index.html; \n\
-    index index.html; \
+    location / { \n\
-    \
+        try_files $uri $uri/ /index.html; \n\
-    # Enable gzip compression \
+    } \n\
-    gzip on; \
-    gzip_types text/css application/javascript application/json image/svg+xml; \
-    gzip_comp_level 6; \
-    \
-    # Angular routing - serve index.html for all routes \
-    location / { \
-        try_files $uri $uri/ /index.html; \
-    } \
-    \
-    # Proxy API requests to backend \
-    location /api/ { \
-        proxy_pass http://backend:5000/; \
-        proxy_http_version 1.1; \
-        proxy_set_header Upgrade $http_upgrade; \
-        proxy_set_header Connection "upgrade"; \
-        proxy_set_header Host $host; \
-        proxy_cache_bypass $http_upgrade; \
-        proxy_set_header X-Real-IP $remote_addr; \
-        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; \
-        proxy_set_header X-Forwarded-Proto $scheme; \
-    } \
-    \
-    # Cache static assets \
-    location ~* \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ { \
-        expires 1y; \
-        add_header Cache-Control "public, immutable"; \
-    } \
 }' > /etc/nginx/conf.d/default.conf
 
 EXPOSE 80

fuse-starter-v20.0.0/angular.json

@@ -46,6 +46,14 @@
                         },
                         "styles": [
                           "@angular/material/prebuilt-themes/azure-blue.css",
+                          "node_modules/material-icons/iconfont/material-icons.css",
+                          "node_modules/@fontsource/roboto/300.css",
+                          "node_modules/@fontsource/roboto/400.css",
+                          "node_modules/@fontsource/roboto/500.css",
+                          "node_modules/@fontsource/ibm-plex-mono/400.css",
+                          "node_modules/@fontsource/ibm-plex-mono/500.css",
+                          "node_modules/@fontsource/ibm-plex-mono/600.css",
+                          "node_modules/@fontsource/ibm-plex-mono/400-italic.css",
                           "src/@fuse/styles/tailwind.scss",
                           "src/@fuse/styles/themes.scss",
                           "src/styles/vendors.scss",
@@ -108,6 +116,10 @@
                         ],
                         "styles": [
                           "@angular/material/prebuilt-themes/azure-blue.css",
+                          "node_modules/material-icons/iconfont/material-icons.css",
+                          "node_modules/@fontsource/roboto/300.css",
+                          "node_modules/@fontsource/roboto/400.css",
+                          "node_modules/@fontsource/roboto/500.css",
                           "src/styles/styles.scss"
                         ],
                         "scripts": []
@@ -119,4 +131,4 @@
     "cli": {
       "analytics": false
     }
-}
+}

fuse-starter-v20.0.0/package-lock.json

@@ -20,12 +20,15 @@
         "@angular/platform-browser": "18.0.1",
         "@angular/platform-browser-dynamic": "18.0.1",
         "@angular/router": "18.0.1",
+        "@fontsource/ibm-plex-mono": "^5.2.7",
+        "@fontsource/roboto": "^5.2.8",
         "@ngneat/transloco": "6.0.4",
         "apexcharts": "3.49.1",
         "crypto-js": "4.2.0",
         "highlight.js": "11.9.0",
         "lodash-es": "4.17.21",
         "luxon": "3.4.4",
+        "material-icons": "^1.13.14",
         "ng-apexcharts": "1.10.0",
         "ngx-quill": "26.0.1",
         "perfect-scrollbar": "1.5.5",
@@ -2933,6 +2936,24 @@
         "node": ">=12"
       }
     },
+    "node_modules/@fontsource/ibm-plex-mono": {
+      "version": "5.2.7",
+      "resolved": "https://registry.npmjs.org/@fontsource/ibm-plex-mono/-/ibm-plex-mono-5.2.7.tgz",
+      "integrity": "sha512-MKAb8qV+CaiMQn2B0dIi1OV3565NYzp3WN5b4oT6LTkk+F0jR6j0ZN+5BKJiIhffDC3rtBULsYZE65+0018z9w==",
+      "license": "OFL-1.1",
+      "funding": {
+        "url": "https://github.com/sponsors/ayuhito"
+      }
+    },
+    "node_modules/@fontsource/roboto": {
+      "version": "5.2.8",
+      "resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-5.2.8.tgz",
+      "integrity": "sha512-oh9g4Cg3loVMz9MWeKWfDI+ooxxG1aRVetkiKIb2ESS2rrryGecQ/y4pAj4z5A5ebyw450dYRi/c4k/I3UBhHA==",
+      "license": "OFL-1.1",
+      "funding": {
+        "url": "https://github.com/sponsors/ayuhito"
+      }
+    },
     "node_modules/@inquirer/figures": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/@inquirer/figures/-/figures-1.0.2.tgz",
@@ -9440,6 +9461,12 @@
         "node": "^16.14.0 || >=18.0.0"
       }
     },
+    "node_modules/material-icons": {
+      "version": "1.13.14",
+      "resolved": "https://registry.npmjs.org/material-icons/-/material-icons-1.13.14.tgz",
+      "integrity": "sha512-kZOfc7xCC0rAT8Q3DQixYAeT+tBqZnxkseQtp2bxBxz7q5pMAC+wmit7vJn1g/l7wRU+HEPq23gER4iPjGs5Cg==",
+      "license": "Apache-2.0"
+    },
     "node_modules/media-typer": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",

fuse-starter-v20.0.0/package.json

@@ -24,12 +24,15 @@
     "@angular/platform-browser": "18.0.1",
     "@angular/platform-browser-dynamic": "18.0.1",
     "@angular/router": "18.0.1",
+    "@fontsource/ibm-plex-mono": "^5.2.7",
+    "@fontsource/roboto": "^5.2.8",
     "@ngneat/transloco": "6.0.4",
     "apexcharts": "3.49.1",
     "crypto-js": "4.2.0",
     "highlight.js": "11.9.0",
     "lodash-es": "4.17.21",
     "luxon": "3.4.4",
+    "material-icons": "^1.13.14",
     "ng-apexcharts": "1.10.0",
     "ngx-quill": "26.0.1",
     "perfect-scrollbar": "1.5.5",
@@ -66,4 +69,4 @@
     "tailwindcss": "3.4.3",
     "typescript": "5.4.5"
   }
-}
+}

fuse-starter-v20.0.0/src/index.html

@@ -1,7 +1,7 @@
 <!doctype html>
 <html lang="en">
     <head>
-        <title>Fuse Angular - Angular Template and Starter Kit</title>
+        <title>RootXVending</title>
         <meta charset="utf-8" />
         <meta
             name="description"
@@ -22,26 +22,12 @@
         <link rel="icon" type="image/png" href="favicon-16x16.png" />
         <link rel="icon" type="image/png" href="favicon-32x32.png" />
 
-        <!-- Fonts -->
+        <!-- Local Inter font (keep if you have it) -->
         <link href="fonts/inter/inter.css" rel="stylesheet" />
-        <link href="https://fonts.gstatic.com" rel="preconnect" />
-
-        <link
-            href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,400;0,500;0,600;1,400&display=swap"
-            rel="stylesheet"
-        />
-
-        <!-- Icon fonts -->
-        <link
-            href="https://fonts.googleapis.com/icon?family=Material+Icons"
-            rel="stylesheet"
-        />
 
         <!-- Splash screen styles -->
         <link href="styles/splash-screen.css" rel="stylesheet" />
-            <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap" rel="stylesheet">
+    </head>
-        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
-</head>
 
     <body class="mat-typography">
         <!-- Splash screen -->
@@ -57,4 +43,4 @@
         <!-- App root -->
         <app-root></app-root>
     </body>
-</html>
+</html>

fuse-starter-v20.0.0/src/styles/styles.scss

@@ -3,5 +3,34 @@
 /*  @ Styles from this file will override 'vendors.scss' and Fuse's base styles.
 /* ----------------------------------------------------------------------------------------------------- */
 
-html, body { height: 100%; }
+/* Base styles */
-body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
+html, body { 
+  height: 100%; 
+}
+
+body { 
+  margin: 0; 
+  font-family: 'Roboto', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', sans-serif;
+}
+
+/* Monospace font for code blocks */
+code, pre, .monospace {
+  font-family: 'IBM Plex Mono', 'Courier New', monospace;
+}
+
+/* Material Icons */
+.material-icons {
+  font-family: 'Material Icons';
+  font-weight: normal;
+  font-style: normal;
+  font-size: 24px;
+  line-height: 1;
+  letter-spacing: normal;
+  text-transform: none;
+  display: inline-block;
+  white-space: nowrap;
+  word-wrap: normal;
+  direction: ltr;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}