Technigo · osckli990 · Mar 26, 2025 · Mar 26, 2025 · Mar 26, 2025 · Mar 26, 2025
diff --git a/README.md b/README.md
@@ -1,9 +1 @@
-# Web Accessibility Project
-
-A basic web server template focused on web accessibility practices.
-
-### Installation
-
-1. Fork this repository by clicking the "Fork" button at the top right of the GitHub repository page.
-
-2. Clone your forked repository
+Netlify link: https://js-project-accessibility.netlify.app/
diff --git a/about.html b/about.html
@@ -1,10 +1,164 @@
 <!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>About</title>
-    <link rel="stylesheet" href="css/styles.css" />
-  </head>
-  <body></body>
-</html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <meta
+    name="viewport"
+    content="width=device-width, initial-scale=1.0"
+  />
+  <title>Web Accessebility Quiz</title>
+  <link
+    rel="stylesheet"
+    href="css/styles.css"
+  />
+</head>
+
+<body>
+  <a
+    href="#main-content"
+    class="skip-link"
+    aria-label="skip link"
+  >Skip to main content</a>
+  <header id="header">
+    <div class="header-content">
+      <h1>
+        Web Accessebility Quiz
+      </h1>
+      <nav
+        role="navigation"
+        aria-label="main menu"
+      >
+        <ul>
+          <li>
+            <a
+              href="index.html"
+              class="nav-links"
+            >Home</a>
+          </li>
+          <li>
+            <a
+              href="about.html"
+              class="nav-links"
+            >About</a>
+          </li>
+        </ul>
+      </nav>
+    </div>
+  </header>
+
+  <section
+    id="banner"
+    role="banner"
+  >
+    <img
+      src="assets/hero.jpg"
+      alt=""
+      role="presentation"
+    />
+  </section>
+
+  <main id="main-content">
+    <section
+      id="about"
+      role="feed"
+    >
+      <div class="about-us">
+        <h2>About Us</h2>
+        <p>
+          We are a team dedicated to getting this app done. Our mission is to learn to create a more inclusive world.
+          We believe that everyone deserves equal opportunities, and we strive to learn how to make that a reality
+          through
+          our work.
+        </p>
+        <div class="button-box">
+          <button
+            id="team-button"
+            type="button"
+            class="intro-continue"
+          ><a
+              id="team-link"
+              href="#our-team"
+            >
+              Learn more about our team</a>
+          </button>
+        </div>
+      </div>
+
+      <div
+        id="our-team"
+        class="our-team"
+        hidden
+      >
+
+        <h2>Our Team</h2>
+        <div
+          class="person"
+          id="malin"
+        >
+          <h3>Malin "Mallan" Lundgren</h3>
+          <p>After two months on an air mattress, the quality of life has now increased by about 47%. This is
+            since
+            the furniture, including the bed, from the USA finally arrived. Better sleep = next level coding!</p>
+        </div>
+
+        <div
+          class="person"
+          id="oscar"
+        >
+          <h3>Oscar "Ogge" Kling Liljefors</h3>
+          <p>Without a cat or a dog, Oscar works tirelessly in his search for the smoothest animations. Regardless
+            of the time of day, but preferably in the evening or night. Preferably at night. Really preferably at
+            night.</p>
+        </div>
+
+        <div
+          class="person"
+          id="ulrika"
+        >
+          <h3>Ulrika "Rakka" Einebrant</h3>
+          <p>While wandering around in Visual Studio Code, every now and then some working code comes into place.
+            Don't ask her how. But since chaos is a bit of a natural state, it should probably work out fine.</p>
+        </div>
+
+      </div>
+    </section>
+  </main>
+
+
+  <footer
+    id="footer"
+    role="contentinfo"
+  >
+    <nav
+      class="footer-content"
+      role="navigation"
+      aria-label="footer menu"
+    >
+      <ul>
+        <li>
+          <a
+            href="#"
+            class="nav-links"
+          >Privacy Policy</a>
+        </li>
+        <li>
+          <a
+            href="#"
+            class="nav-links"
+          >Terms of Service</a>
+        </li>
+        <li>
+          <a
+            href="#"
+            class="nav-links"
+          >Contact Us</a>
+        </li>
+      </ul>
+    </nav>
+  </footer>
+  <script src="main.js"></script>
+  <script src="js/accordion.js"></script>
+</body>
+
+</html>
diff --git a/assets/celebrate.jpg b/assets/celebrate.jpg
diff --git a/assets/celebrate2.jpg b/assets/celebrate2.jpg
diff --git a/assets/hero.jpg b/assets/hero.jpg