Used 'Prettier - Code formatter' to format the

code in 'Wireframe/index.html' and 'Wireframe/style.css'.

Author: JorvanW

Wireframe/index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
@@ -13,33 +13,63 @@ <h1>Wireframe Task</h1>
     </header>
     <main>
       <article id="readme-article">
-        <img src="https://user-images.githubusercontent.com/6750572/90517585-e483a280-e165-11ea-8945-3d289eeeaa1d.png" alt="README file example" />
+        <img
+          src="https://user-images.githubusercontent.com/6750572/90517585-e483a280-e165-11ea-8945-3d289eeeaa1d.png"
+          alt="README file example"
+        />
         <h2>README file</h2>
         <p>
-          ReadME file is a plain text document that is used as a user manual or official document for a project. 
-          This file is useful because it helps communicate important information to those using or collaborating on the project. 
+          ReadME file is a plain text document that is used as a user manual or
+          official document for a project. This file is useful because it helps
+          communicate important information to those using or collaborating on
+          the project.
         </p>
-        <a href="https://www.makeareadme.com" target="_blank" rel="noopener noreferrer">Make a Readme</a>
+        <a
+          href="https://www.makeareadme.com"
+          target="_blank"
+          rel="noopener noreferrer"
+          >Make a Readme</a
+        >
       </article>
       <article id="wireframe-article">
-        <img src="https://cdn-images.visual-paradigm.com/handbooks/agile-handbook/wireframe/02-newspaper-site-wireframe-example.png" alt="Website wireframe example" />
+        <img
+          src="https://cdn-images.visual-paradigm.com/handbooks/agile-handbook/wireframe/02-newspaper-site-wireframe-example.png"
+          alt="Website wireframe example"
+        />
         <h2>Wireframe</h2>
         <p>
-         A wireframe is a minimal skeletal blueprint of a website or app interface. It is important in order to plan a project in advance.
+          A wireframe is a minimal skeletal blueprint of a website or app
+          interface. It is important in order to plan a project in advance.
         </p>
-        <a href="https://balsamiq.com/blog/what-are-wireframes/" target="_blank" rel="noopener noreferrer">What are Wireframes?</a>
+        <a
+          href="https://balsamiq.com/blog/what-are-wireframes/"
+          target="_blank"
+          rel="noopener noreferrer"
+          >What are Wireframes?</a
+        >
       </article>
-      <article id="git-branch-article">    
-        <img id="git-branch-image" src="https://phoenixnap.com/kb/wp-content/uploads/2023/11/git-workflow-example.png" alt="Git branch workflow diagram" />
+      <article id="git-branch-article">
+        <img
+          id="git-branch-image"
+          src="https://phoenixnap.com/kb/wp-content/uploads/2023/11/git-workflow-example.png"
+          alt="Git branch workflow diagram"
+        />
         <h2>Git Branch</h2>
         <p>
-         In Git, a branch is an identical copy of a project's code which is then used to make changes on without having any effect on the main original project.
+          In Git, a branch is an identical copy of a project's code which is
+          then used to make changes on without having any effect on the main
+          original project.
         </p>
-        <a href="https://www.w3schools.com/GIT/git_branch.asp?remote=github" target="_blank" rel="noopener noreferrer">What is a Git Branch?</a>
+        <a
+          href="https://www.w3schools.com/GIT/git_branch.asp?remote=github"
+          target="_blank"
+          rel="noopener noreferrer"
+          >What is a Git Branch?</a
+        >
       </article>
     </main>
     <footer>
-      <p>London | May-2026 | Jorvan White | Wireframe Task </p>
+      <p>London | May-2026 | Jorvan White | Wireframe Task</p>
     </footer>
   </body>
 </html>

Wireframe/style.css

@@ -24,16 +24,13 @@ As well as useful links to learn more */
   --line: 1px solid;
   --container: 1280px;
 }
-
 h1 {
   display: flex;
   justify-content: center;
 }
-
 #git-branch-image {
   height: 107%;
 }
-
 #git-branch-article h2 {
   margin-top: 55px;
 }