feat: ✨ use port 80

Dockerfile

@@ -1,5 +1,7 @@
 FROM denoland/deno:latest
 
+ENV PORT=80
+
 COPY . /app/
 WORKDIR /app
 

fresh.config.ts

@@ -1,3 +1,7 @@
 import { defineConfig } from "$fresh/server.ts";
 
-export default defineConfig({});
+const port = Number(Deno.env.get("PORT")) || 8000;
+
+export default defineConfig({
+    port: port,
+});

static/styles.scss

@@ -84,13 +84,13 @@ header {
 .hero {
   position: relative;
   text-align: center;
-  height: 562px; 
+  height: 562px;
   overflow: hidden;
 
   img {
     width: 100%;
     height: 562px;
-    object-fit: cover; 
+    object-fit: cover;
     object-position: center;
     display: block;
   }
@@ -118,14 +118,13 @@ header {
 
   button {
     @media (max-width: 768px) {
-      flex-direction: column; 
+      flex-direction: column;
       margin-left: 0;
       margin-right: 0;
-    }  
+    }
   }
 }
 
-
 /* infos Section */
 
 .info-container {
@@ -145,40 +144,40 @@ header {
       grid-template-columns: 1fr;
       margin: 0px;
       width: 100%;
-    }  
+    }
 
     .info {
       margin: 0 10px;
       text-align: center;
-    
+
       img {
         width: 100%;
         height: auto;
       }
-    
+
       p {
         margin-top: 10px;
       }
     }
   }
 }
 
-
 .button-row {
   display: flex;
   flex-wrap: wrap; /* Ermöglicht das Umwickeln der Buttons auf kleineren Bildschirmen */
-  justify-content: space-between; 
-  margin-left: 25%; 
+  justify-content: space-between;
+  margin-left: 25%;
   margin-right: 25%;
   margin-top: 50px;
 
   button {
     flex: 1 1 auto; /* Ermöglicht den Buttons, sich gleichmäßig anzupassen */
-    margin-left: 50px; 
+    margin-left: 50px;
     margin-right: 50px;
   }
-
-  @media (max-width: 768px) { /* Anpassung für Bildschirme mit max. 768px Breite */
+
+  @media (max-width: 768px) {
+    /* Anpassung für Bildschirme mit max. 768px Breite */
     flex-direction: column; /* Stellt sicher, dass die Buttons untereinander angeordnet sind */
     margin-left: 0;
     margin-right: 0;
@@ -187,12 +186,12 @@ header {
 }
 
 .red-button {
-  flex: 1; 
-  margin: 20px 100px; 
-  background-color: #d50f20; 
-  color: white; 
-  border: none; 
-  border-radius: 5px; 
+  flex: 1;
+  margin: 20px 100px;
+  background-color: #d50f20;
+  color: white;
+  border: none;
+  border-radius: 5px;
   padding: 10px 20px;
   font-size: 16px;
   height: 55px;
@@ -205,8 +204,8 @@ header {
 }
 
 .navbar-toggler {
-  border: 1px solid #fff; 
-  background-color: $navbar-bg-color; 
+  border: 1px solid #fff;
+  background-color: $navbar-bg-color;
   .navbar-toggler-icon {
     background-image: none;
   }
@@ -216,11 +215,11 @@ header {
   position: relative;
   bottom: 0;
   width: 100%;
-  background-color: #003B63; /* Hintergrundfarbe für den Footer */
+  background-color: #003b63; /* Hintergrundfarbe für den Footer */
   padding: 20px 0; /* Abstand im Footer */
-  
+
   .container {
     text-align: center;
     color: #fff;
   }
-}
+}