asset include

https://github.com/C9Glax/tranga/pull/355#issuecomment-2764253691

.github/workflows/docker-image-vite-react-ts.yml

@@ -35,7 +35,7 @@ jobs:
       - name: Build and push Website
         uses: docker/build-push-action@v6.7.0
         with:
-          context: ./Website
+          context: .
           file: ./Dockerfile
           #platforms: linux/amd64,linux/arm64,linux/riscv64,linux/ppc64le,linux/s390x,linux/386,linux/mips64le,linux/mips64,linux/arm/v7,linux/arm/v6
           platforms: linux/amd64

Dockerfile

@@ -1,4 +1,17 @@
-FROM nginx:alpine3.17-slim
-COPY . /usr/share/nginx/html
+# Build stage
+FROM node:20-alpine AS builder
+
+WORKDIR /app
+COPY . /app
+RUN npm install
+RUN npm run build
+
+# Serve stage
+FROM nginx:alpine3.17-slim
+
+# Copy built files from Vite's dist folder
+COPY --from=builder /app/Website/dist /usr/share/nginx/html
+COPY --from=builder /app/Website/media /usr/share/nginx/html/media
+
 EXPOSE 80
 CMD ["nginx", "-g", "daemon off;"]

Website/modules/Settings.tsx

@@ -57,7 +57,7 @@ export default function Settings({ backendConnected, apiUri, frontendSettings, s
     return (
         <div id="Settings">
             <div onClick={() => setShowSettings(true)}>
-                <img id="Settings-Cogwheel" src="../../media/settings-cogwheel.svg" alt="settings-cogwheel" />
+                <img id="Settings-Cogwheel" src="../media/settings-cogwheel.svg" alt="settings-cogwheel" />
             </div>
             {showSettings
                 ? <div className="popup" id="SettingsPopUp">

Website/styles/footer.css

@@ -18,7 +18,7 @@ footer {
     flex-grow: 1;
     text-align: right;
     margin-right: 20px;
-    cursor: url("Website/media/blahaj.png"), grab;
+    cursor: url("../media/blahaj.png"), grab;
 }
 
 footer .statusBadge {