From f96dbd1a02c2a0ab608a4442bcbb8c50b9249a39 Mon Sep 17 00:00:00 2001 From: Ayodeji_Ayorinde26 Date: Fri, 30 Jan 2026 14:55:29 +0000 Subject: [PATCH 1/2] Update index.html Updated index.html file to align with wireframe layout --- Wireframe/index.html | 43 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 43 insertions(+) diff --git a/Wireframe/index.html b/Wireframe/index.html index 0e014e535..77f7fbe32 100644 --- a/Wireframe/index.html +++ b/Wireframe/index.html @@ -31,3 +31,46 @@

Title

+ + + + +Wireframe Layout + + + +
+
+

WIREFRAME IMPLEMENTATION

+

This is a sample of wireframe implementation

+
+
+

WHAT IS THE PURPOSE OF A README FILE?

+

A README file exists to explain what a project is, why it matters, and how to use it. It’s the first place someone looks when they encounter your repository, dataset, or codebase.

+ +

READ MORE

+
+ +
+
+

WHAT IS THE PURPOSE OF A WIREFRAME?

+

A wireframe exists to map out the structure and functionality of a page or product before any visual design or coding begins. Think of it as the architectural blueprint of a digital experience.

+ +

READ MORE

+
+

WHAT IS A BRANCH IN GIT?

+

A branch in Git is essentially a lightweight, movable pointer to a specific line of development. It lets you work on new features, experiments, or fixes without affecting the main codebase. +

+ +

READ MORE

+
+
+ + + + + From 74412c4ea8aa21353a083b2cfdc385ca19232420 Mon Sep 17 00:00:00 2001 From: Ayodeji_Ayorinde26 Date: Fri, 30 Jan 2026 14:56:18 +0000 Subject: [PATCH 2/2] Update style.css Updated style.css file to align with wireframe layout --- Wireframe/style.css | 50 +++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 50 insertions(+) diff --git a/Wireframe/style.css b/Wireframe/style.css index be835b6c7..d8d1a303e 100644 --- a/Wireframe/style.css +++ b/Wireframe/style.css @@ -87,3 +87,53 @@ article { grid-column: span 3; } } + +body { + margin: 0; + font-family: Arial, sans-serif; +} /* Generic wireframe box */ +.section, +.column { + border: 2px dashed #999; + padding: 20px; + box-sizing: border-box; + display: flex; + flex-direction: column; + justify-content: flex-end; +} /* Single-line spacing */ +h1 { font-weight: bold; } + +p { + line-height: 1; + margin: 4px 0; +} /* Top half layout */ +.top-half { + height: 50vh; + text-align: center; +} /* Title + subtitle block */ +.title-block { + margin-bottom: auto; /* keeps title at the top */ +} +.subtitle { + font-size: 0.9rem; + margin-top: 4px; + color: #555; +} /* Text block under title */ +.top-half .text-block { + text-align: left; + margin: 0 auto; + width: 60%; +} +/* Bottom half layout */ +.bottom-half { + height: 50vh; + display: flex; + /* font-weight: bold; */ +} +.column { + flex: 1; + margin: 10px; + text-align: left; + +} +