Initial commit

YpzarJohn24 · Dec 24, 2023 · a615475 · a615475
commit a615475
Show file tree

Hide file tree

Showing 34 changed files with 801 additions and 0 deletions.
diff --git a/Thumbs.db b/Thumbs.db
diff --git a/assets/css/style.css b/assets/css/style.css
diff --git a/assets/images/Thumbs.db b/assets/images/Thumbs.db
diff --git a/assets/images/about-abs-banner.png b/assets/images/about-abs-banner.png
diff --git a/assets/images/about-banner.png b/assets/images/about-banner.png
diff --git a/assets/images/about-shape.png b/assets/images/about-shape.png
diff --git a/assets/images/facebook.svg b/assets/images/facebook.svg
diff --git a/assets/images/footer-shape-1.png b/assets/images/footer-shape-1.png
diff --git a/assets/images/footer-shape-2.png b/assets/images/footer-shape-2.png
diff --git a/assets/images/footer-shape-3.png b/assets/images/footer-shape-3.png
diff --git a/assets/images/hero-banner.png b/assets/images/hero-banner.png
diff --git a/assets/images/hero-bg.jpg b/assets/images/hero-bg.jpg
diff --git a/assets/images/instagram.svg b/assets/images/instagram.svg
diff --git a/assets/images/logo.png b/assets/images/logo.png
diff --git a/assets/images/nav-before-img.png b/assets/images/nav-before-img.png
diff --git a/assets/images/service-bg.jpg b/assets/images/service-bg.jpg
diff --git a/assets/images/services-1.png b/assets/images/services-1.png
diff --git a/assets/images/services-2.png b/assets/images/services-2.png
diff --git a/assets/images/services-3.png b/assets/images/services-3.png
diff --git a/assets/images/services-4.png b/assets/images/services-4.png
diff --git a/assets/images/services-5.png b/assets/images/services-5.png
diff --git a/assets/images/services-6.png b/assets/images/services-6.png
diff --git a/assets/images/text-bars-dark.png b/assets/images/text-bars-dark.png
diff --git a/assets/images/text-bars-light.png b/assets/images/text-bars-light.png
diff --git a/assets/images/twitter.svg b/assets/images/twitter.svg
diff --git a/assets/images/work-1.jpg b/assets/images/work-1.jpg
diff --git a/assets/images/work-2.jpg b/assets/images/work-2.jpg
diff --git a/assets/images/work-3.jpg b/assets/images/work-3.jpg
diff --git a/assets/js/script.js b/assets/js/script.js
@@ -0,0 +1,11 @@
+"use strict";
+
+// MOBILE NAVBAR TOGGLE
+
+const navbar = document.querySelector("[data-navbar]");
+const navToggler = document.querySelector("[data-nav-toggler]");
+
+navToggler.addEventListener("click", function () {
+  navbar.classList.toggle("active");
+  this.classList.toggle("active");
+});
diff --git a/favicon.svg b/favicon.svg
diff --git a/index.html b/index.html
@@ -0,0 +1,128 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <!-- primary meta tags -->
+    <title>Autofix - Auto Maintenance & Repair Service</title>
+    <meta name="title" content="Autofix - Auto Maintenance & Repair Service" />
+    <meta name="description" content="This is a vehicle repair website" />
+    <!-- favicon -->
+    <link rel="shortcut icon" href="./favicon.svg" type="image/svg+xml" />
+    <!-- google font link -->
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;600;700&family=Mulish&display=swap"
+      rel="stylesheet"
+    />
+
+    <!-- material icon font -->
+    <link
+      rel="stylesheet"
+      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@40,600,0,0"
+    />
+    <!-- custom css link -->
+    <link rel="stylesheet" href="./assets/css/style.css" />
+    <!-- preload images -->
+    <link rel="preload" as="image" href="./assets/images/hero-banner.png" />
+    <link rel="preload" as="image" href="./assets/images/hero-bg.jpg" />
+  </head>
+  <body>
+    <!-- #HEADER -->
+
+    <header class="header">
+      <div class="container">
+        <a href="#" class="logo">
+          <img
+            src="./assets/images/logo.png"
+            width="128"
+            height="63"
+            alt="autofix home"
+          />
+        </a>
+
+        <nav class="navbar" data-navbar>
+          <ul class="navbar-list">
+            <li>
+              <a href="#" class="navbar-link">Home</a>
+            </li>
+            <li>
+              <a href="#" class="navbar-link">About</a>
+            </li>
+            <li>
+              <a href="#" class="navbar-link">Services</a>
+            </li>
+            <li>
+              <a href="#" class="navbar-link">Projects</a>
+            </li>
+            <li>
+              <a href="#" class="navbar-link">Contact</a>
+            </li>
+          </ul>
+        </nav>
+
+        <a href="#" class="btn btn-primary">
+          <span class="span">Get a Quote</span>
+          <span class="material-symbols-rounded">arrow_forward</span>
+        </a>
+
+        <button
+          class="nav-toggle-btn"
+          aria-label="toggle menu"
+          data-nav-toggler
+        >
+          <span class="nav-toggle-icon icon-1"></span>
+          <span class="nav-toggle-icon icon-2"></span>
+          <span class="nav-toggle-icon icon-3"></span>
+        </button>
+      </div>
+    </header>
+
+    <main>
+      <article>
+        <!-- #HERO -->
+
+        <section
+          class="hero has-bg-image"
+          aria-label="home"
+          style="background-image: url(./assets/images/hero-bg.jpg)"
+        >
+          <div class="container">
+            <div class="hero-content">
+              <p class="section-subtitle :dark">
+                We have talented engineers & mechanics
+              </p>
+
+              <h1 class="h1 section-title">
+                Auto Maintenance & Repair Service
+              </h1>
+
+              <p class="section-text">
+                Duis aute irure dolor in reprehenderit in voluptate velit esse
+                Excepteur sint occaecat cupidatat non proident.
+              </p>
+
+              <a href="#" class="btn">
+                <span class="span">Our Services</span>
+                <span class="material-symbols-rounded">arrow_forward</span>
+              </a>
+            </div>
+
+            <figure class="hero-banner" style="--width: 1228; --height: 789">
+              <img
+                src="./assets/images/hero-banner.png"
+                width="1228"
+                height="789"
+                alt="red motor vehicle"
+                class="move-anim"
+              />
+            </figure>
+          </div>
+        </section>
+      </article>
+    </main>
+    <!-- custom js link -->
+    <script src="./assets/js/script.js"></script>
+  </body>
+</html>
diff --git a/index.txt b/index.txt
@@ -0,0 +1,151 @@
+Autofix - Auto Maintenance & Repair Service
+
+This is a vehicle repair html template made by codewithsadee
+
+
+
+#---------- HEADER ----------#
+
+alt = autofix home
+
+Home
+About
+Services
+Projects
+Contact
+
+Get a Quote
+<span class="material-symbols-rounded">arrow_forward</span>
+
+aria-label = toggle menu
+
+
+#---------- HERO ----------#
+
+We have talented engineers & mechanics
+
+Auto Maintenance & Repair Service
+
+Duis aute irure dolor in reprehenderit in voluptate velit esse Excepteur sint occaecat cupidatat non proident.
+
+Our Services
+<span class="material-symbols-rounded">arrow_forward</span>
+
+alt = red motor vehicle
+
+
+
+#---------- SERVICE ----------#
+
+Our services
+We Provide Great Services For your Vehicle
+
+alt = Engine Repair
+Engine Repair
+Autem velaum iure reare aenderit rui in ea roluptate esse ruam moles
+
+Read more
+
+alt = Brake Repair
+Brake Repair
+
+alt = Tire Repair
+Tire Repair
+
+alt = Battery Repair
+Battery Repair
+
+alt = Red Car
+
+alt = Steering Repair
+Steering Repair
+
+View All Services
+<span class="material-symbols-rounded">arrow_forward</span>
+
+
+
+#---------- ABOUT ----------#
+
+alt = vehicle repire equipments
+
+About Us
+
+We’re Commited to Meet the quality
+
+Quis autem vel eum iure reprehenderit qui in ea volu velit esse quam nihil molestiae consequatur, vel illum eui dolorem eum fugiat ruo.
+
+Reprehenderit qui in ea volu velit esse quam nihil moe stiae consequatur, vel illum eui.
+
+8K+
+Happy Clients
+
+22+
+Instruments
+
+50+
+Years in market
+
+99%
+Projects completed
+
+
+
+#---------- WORK ----------#
+
+Our Work
+
+Latest projects we have done
+
+alt = Engine Repair
+Auto Repair
+Engine Repair
+
+<span class="material-symbols-rounded">arrow_forward</span>
+
+alt = Car Tyre change
+Car Tyre change
+
+alt = Battery Adjust
+Battery Adjust
+
+
+
+#---------- FOOTER ----------#
+
+alt = autofix home
+
+Rerum necessitatibus saepe eveniet aut et voluptates repudiandae sint et molestiae non recusandae.
+
+alt = facebook
+alt = instagram
+alt = twitter
+
+Opening Hours
+
+Monday – Saturday
+12.00 – 14.45
+
+Sunday – Thursday
+17.30 – 00.00
+
+Friday – Saturday
+
+Contact Info
+
+<span class="material-symbols-rounded">call</span>
++01 2 3456 7890
+
+<span class="material-symbols-rounded">mail</span>
+info@autofix.com
+
+<span class="material-symbols-rounded">location_on</span>
+21 King Street Melbourne, 3000, Australia
+
+alt = Shape
+
+Copyright 2023, All Rights Reserved.
+
+alt = Shape
+
+alt = Red Car
diff --git a/readme-images/desktop.png b/readme-images/desktop.png