Add images and improve article layout

Author: codebyra

Wireframe/images/branch.png.png Wireframe/images/branch.pngWireframe/images/branch.png.png renamed to Wireframe/images/branch.png

@@ -14,7 +14,7 @@ <h1>Web Development Concepts</h1>
 
 <main>
   <article>
-    <img src="placeholder.svg" alt="README file illustration" />
+    <img src="images/readme.png" alt="README documentation example" />
 
 
 <h2>What is a README File?</h2>
@@ -32,7 +32,7 @@ <h2>What is a README File?</h2>
   </article>
 
   <article>
-    <img src="placeholder.svg" alt="Wireframe sketch" />
+    <img src="images/wireframe-topic.png" alt="Website wireframe layout sketch" />
 
 <h2>What is a Wireframe?</h2>
 
@@ -49,7 +49,7 @@ <h2>What is a Wireframe?</h2>
   </article>
 
   <article>
-    <img src="placeholder.svg" alt="Git branch workflow" />
+    <img src="images/branch.png" alt="Git branching workflow diagram" />
 
 <h2>What is a Git Branch?</h2>
 

Wireframe/images/readme.png

@@ -102,3 +102,9 @@ footer {
   border-top: 1px solid black;
   padding: 10px;
 }
+article img {
+  width: 100%;
+  height: 250px;
+  object-fit: contain;
+}
+