WIP mission statement

.devcontainer/devcontainer.json

@@ -1,22 +1,17 @@
 // For format details, see https://aka.ms/devcontainer.json. For config options, see the
 // README at: https://github.com/devcontainers/templates/tree/main/src/typescript-node
 {
-	"name": "Node.js & TypeScript",
+	"name": "montell-website",
 	// Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
 	"image": "mcr.microsoft.com/devcontainers/typescript-node:1-22-bookworm"
-
 	// Features to add to the dev container. More info: https://containers.dev/features.
 	// "features": {},
-
 	// Use 'forwardPorts' to make a list of ports inside the container available locally.
 	// "forwardPorts": [],
-
 	// Use 'postCreateCommand' to run commands after the container is created.
 	// "postCreateCommand": "yarn install",
-
 	// Configure tool-specific properties.
 	// "customizations": {},
-
 	// Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
 	// "remoteUser": "root"
-}
+}

index.html

@@ -48,13 +48,15 @@
                     echo $GREETING
                 </small>
             </div>
-            <h1 class="letter-spacing">> HI THERE!</h1>
+            <h1 class="letter-spacing">> HEJ DÄR!</h1>
             <p class="letter-spacing">
-                <span class="row-backdrop">We're a software development consultancy that focus on modern web development
-                    and data integrations.<span class="cursor row-backdrop">_</span>
+                <span class="row-backdrop">Zackarias Montell IT är en konsultfirma inom mjukvaruutveckling som fokuserar
+                    på modern webbutveckling och dataintegrationer.
             </p>
+
             <p class="letter-spacing">
-                <span class="row-backdrop">If you need <span class="cursor row-backdrop">_</span>
+                <span class="row-backdrop"> Läs mer om oss
+                    <a href="#links" class="specialLink">här</a>!</span><span class="cursor row-backdrop">_</span>
             </p>
         </div>
         <div id="contact">
@@ -99,14 +101,24 @@
                 </small>
                 <br>
                 <small class="row-backdrop">
-                    echo $EXTERNAL
+                    echo $ABOUT
                 </small>
             </div>
-            <h1 class="letter-spacing">> AUXILIARY</h1>
+            <h1 class="letter-spacing">> OM OSS</h1>
             <p class="letter-spacing">
-                <span class="row-backdrop letter-spacing-big">
-                    <a href="http://omfgdogs.com" target="blank" class="specialLink">OMFGDOGS</a>..</span><span
-                    class="cursor row-backdrop">_</span>
+                <span class="row-backdrop"> Företaget startades 2024 av Zackarias Montell och har sin bas i Eksjö.
+            </p>
+            <h2 class="letter-spacing">> Vår mission</h2>
+            <p class="letter-spacing">
+                <span class="row-backdrop">Att med kundfokus och nära samarbete leverera kvalitativa och
+                    hållbara IT-lösningar. Med över 7 års erfarenhet i branschen arbetar vi värdefokuserat,
+                    lösningsorienterat och med hög integritet.
+            </p>
+            <p class="letter-spacing">
+                <span class="row-backdrop">Det som särskiljer oss är vår förmåga att hantera alla delar av ett projekt –
+                    från databas och backend till frontend och leverans. Vi förstår hur alla delar hänger samman, vilket
+                    gör oss effektiva genom hela utvecklingsprocessen och ger oss möjlighet att leverera lösningar som
+                    verkligen gör skillnad för våra kunder.
             </p>
         </div>
     </div>

pageFiles/style.css

@@ -64,6 +64,7 @@ body {
 }
 
 ;
+
 .menuArea {
     background-color: red;
     position: absolute;
@@ -197,6 +198,11 @@ h1 {
     font-family: ShareTechMono;
 }
 
+h2 {
+    color: #555;
+    font-family: ShareTechMono;
+}
+
 .icon:hover {
     animation-name: transitionToAccent;
     animation-duration: 300ms;
@@ -246,12 +252,13 @@ p {
     margin-right: 0.5em;
 }
 
-.floatLeft{
+.floatLeft {
     float: left;
 }
 
 @keyframes transitionToAccent {
     from {}
+
     to {
         color: #00FF77;
     }
@@ -261,66 +268,79 @@ p {
     from {
         box-shadow: #00FF77 0px -3px 0px 0px inset;
     }
+
     to {
         box-shadow: #00FF77 0px -1.2em 0px 0px inset;
     }
 }
 
 @media (max-width: 400px) {
+
     html,
     body {
         font-size: 0.8em;
     }
+
     #menuButtonIcon>.fa-bars {
         font-size: 16px;
         top: 6.5px;
         left: 8px;
     }
+
     #menuButtonIcon>.fa-times {
         font-size: 16px;
         top: 6.5px;
         left: 8.5px;
     }
+
     .menuEntry {
         font-size: 1.1em;
     }
 }
 
 @media (min-width:400.01px) and (max-width: 600px) {
+
     html,
     body {
         font-size: 1.05em;
     }
+
     #menuButtonIcon>.fa-bars {
         font-size: 16px;
         top: 6.5px;
         left: 8px;
     }
+
     #menuButtonIcon>.fa-times {
         font-size: 16px;
         top: 6.5px;
         left: 8.5px;
     }
+
     .menuEntry {
         font-size: 1.1em;
     }
 }
 
 @media (min-width: 600.01px) {
+
     html,
     body {
         font-size: 1.2em;
     }
+
     #menuButtonIcon>.fa-bars {
         font-size: 16px;
         top: 6.5px;
         left: 8px;
     }
+
     #menuButtonIcon>.fa-times {
         font-size: 16px;
         top: 6.5px;
         left: 8.5px;
     }
+
     .menuEntry {
         font-size: 1.1em;
     }