CodeYourFuture · tasleemadedokun · Jan 25, 2026 · Jan 25, 2026 · Jan 25, 2026 · Jan 25, 2026
diff --git a/Wireframe/gitbranch.png b/Wireframe/gitbranch.png
diff --git a/Wireframe/index.html b/Wireframe/index.html
@@ -1,33 +1,55 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Wireframe</title>
-    <link rel="stylesheet" href="style.css" />
-  </head>
-  <body>
-    <header>
-      <h1>Wireframe</h1>
+
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Wireframe</title>
+  <link rel="stylesheet" href="style.css" />
+</head>
+
+<body>
+  <header>
+    <h1><strong>A Wireframe web page</strong> </h1>
+
+    <p>
+      This is a web page that shows the importance and function of the Wireframe,README file,and a branch of git.
+    </p>
+  </header>
+  <main>
+    <article>
+      <img src="./readme.png" alt="" />
+      <h2>README FILE</h2>
       <p>
-        This is the default, provided code and no changes have been made yet.
+        A README file explains what a project is, how it works, and how to use it.
+
       </p>
-    </header>
-    <main>
-      <article>
-        <img src="placeholder.svg" alt="" />
-        <h2>Title</h2>
-        <p>
-          Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam,
-          voluptates. Quisquam, voluptates.
-        </p>
-        <a href="">Read more</a>
-      </article>
-    </main>
-    <footer>
+      <a href="https://www.reddit.com/r/learnprogramming/comments/vxfku6/how_to_write_a_readme/" target="_blank">Read more</a>
+    </article>
+
+    <article>
+      <img src="./wireframe2.png" alt="" />
+      <h2>Wireframe</h2>
       <p>
-        This is the default, provided code and no changes have been made yet.
-      </p>
-    </footer>
-  </body>
-</html>
+        A wireframe is a visual blueprint of a webpage or application.</p>
+
+      <a href="https://www.figma.com/resource-library/what-is-wireframing/" target="_blank">Read more</a>
+    </article>
+
+    <article>
+      <img src="./gitbranch.png" alt="" />
+      <h2>Git branch</h2>
+      <p>
+        A Git branch is a separate version of the codebase.
+            </p>
+      <a href="https://www.w3schools.com/git/git_branch.asp" target="_blank">Read more</a>
+    </article>
+  </main>
+  <footer>
+    <p>
+    TASLEEM ADEDOKUN COPYRIGHT 2026
+    </p>
+  </footer>
+</body>
+
+</html>
diff --git a/Wireframe/readme.png b/Wireframe/readme.png
diff --git a/Wireframe/style.css b/Wireframe/style.css
@@ -17,8 +17,8 @@ As well as useful links to learn more */
  https://scrimba.com/learn-css-variables-c026
 ====== Design Palette ====== */
 :root {
-  --paper: oklch(7 0 0);
-  --ink: color-mix(in oklab, var(--color) 5%, black);
+  --paper:rgb(94, 228, 41);
+  --ink: color-mix(in oklab, var(--color)5%,black);
   --font: 100%/1.5 system-ui;
   --space: clamp(6px, 6px + 2vw, 15px);
   --line: 1px solid;
@@ -28,7 +28,7 @@ As well as useful links to learn more */
  General rules for basic HTML elements in any context */
 body {
   background: var(--paper);
-  color: var(--ink);
+  color: var(rgb(216, 192, 192));
   font: var(--font);
 }
 a {
@@ -48,11 +48,22 @@ https://www.w3.org/WAI/tutorials/page-structure/regions/
 main {
   max-width: var(--container);
   margin: 0 auto calc(var(--space) * 4) auto;
+  margin-bottom: calc(var(--space)*8);
+  padding-bottom: auto;
+
 }
 footer {
-  position: fixed;
+
   bottom: 0;
   text-align: center;
+  padding: var(--space);
+  background: whitesmoke;
+  border-top: var(--line);
+  position: fixed;
+  width: 100%;
+  margin: auto;
+
+
 }
 /* ====== Articles Grid Layout ====
 Setting the rules for how articles are placed in the main element.

diff --git a/Wireframe/wireframe2.png b/Wireframe/wireframe2.png