feedback implemented

templates/internal/resources-samples.php

@@ -0,0 +1,58 @@
+<?php
+
+$resource_samples = [
+  [
+    "title" => "Student Timetable",
+    "description" => "Example of a Weekly College Schedule (First Year, Semester 1).",
+    "image" => "sample-timetable"
+  ],
+  [
+    "title" => "Sample Budget",
+    "description" => "Approximate amounts you will make and spend on a monthly basis.",
+    "image" => "sample-budget"
+  ],
+  [
+    "title" => "Sample Contacts",
+    "description" => "Example of important phone numbers to have.",
+    "image" => "sample-contacts"
+  ]
+]
+
+
+
+?>
+
+<article>
+
+  <div class="flex flex-col bg-white">
+
+    <div class="py-4 px-2 bg-white text-cadet-900">
+      <div class="max-w-7xl mx-auto space-y-4">
+
+        <?php foreach ($resource_samples as $resource) { ?>
+          <div class="px-2">
+
+            <h3 class="text-xl font-medium mb-4"><?= $resource['title'] ?></h3>
+            <p><?= $resource['description'] ?></p>
+
+            <div class="modalOpen px-4 py-2 mt-4 bg-cadet-500 text-black text-center">View <?= $resource['title'] ?></div>
+
+            <!-- The Modal -->
+            <div class="modal overflow-scroll no-scrollbar">
+              <span class="modalClose"><i class="bi bi-x-circle-fill"></i></span>
+              <div class="modal-content pt-16 pb-24">
+                <img src="<?= get_template_directory_uri(); ?>/assets/images/resources/<?= $resource['image'] ?>.png" alt="Modal Image">
+              </div>
+            </div>
+
+            <div class="w-full h-0.5 bg-blue-500 mt-4"></div>
+
+          </div>
+        <?php } ?>
+
+      </div>
+    </div>
+
+  </div>
+
+</article>