Update Home and About page

.github/workflows/firebase-hosting-merge.yml

@@ -4,10 +4,8 @@
 name: Deploy to Firebase Hosting on merge
 on:
   release:
-    types: [published]
-  push:
-    branches:
-      - hotfix
+    types: [ published ]
+
 jobs:
   build_and_deploy:
     runs-on: ubuntu-latest

src/components/NavBar.vue

@@ -25,17 +25,15 @@ function toggleState(item) {
           <DisclosureButton
             class="inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-700 hover:text-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white">
             <div class="sr-only">Open main menu</div>
-            <!-- <Bars3Icon v-if="!open" class="block h-6 w-6" aria-hidden="true" /> -->
             <font-awesome-icon v-if="!open" :icon="['fas', 'bars']" class="block h-6 w-6" aria-hidden="true" />
-            <!-- <XMarkIcon v-else class="block h-6 w-6" aria-hidden="true" /> -->
             <font-awesome-icon v-else :icon="['fas', 'xmark']" aria-hidden="true" class="block h-6 w-6" />
           </DisclosureButton>
         </div>
         <div class="flex flex-1 items-center justify-center sm:items-stretch sm:justify-start">
           <div class="flex sm:flex-grow items-center">
-            <img class="block h-8 w-auto lg:hidden" src="/logo.svg" alt="CodeReviewShop" />
-            <img class="hidden h-8 w-auto lg:block" src="/logo.svg" alt="CodeReviewShop" />
-            <h3 class="text-white px-2 font-semibold">Code Review Shop</h3>
+            <RouterLink to="/">
+              <h3 class="text-white px-2 text-lg font-bold">Code Review Shop</h3>
+            </RouterLink>
           </div>
 
           <!-- Default Navbar view -->

src/views/AboutView.vue

@@ -41,16 +41,15 @@ const values = [
 
 <template>
   <div
-    class="h-64 w-full text-center flex flex-col text-white justify-center items-center bg-[url(/aboutImg.jpg)] bg-cover bg-center bg-no-repeat"
-  >
+    class="h-64 w-full text-center flex flex-col text-white justify-center items-center bg-[url(/aboutImg.jpg)] bg-cover bg-center bg-no-repeat">
     <h1 class="text-3xl sm:text-5xl font-semibold p-3">
       The CodeReviewShop Story
     </h1>
     <p class="p-3 italic text-md">Better software is built together</p>
   </div>
   <div class="pt-6 pb-8 px-4 container lg:w-3/4 2xl:w-1/2">
     <div>
-      <h1 class="text-4xl font-mono py-2">Present Day</h1>
+      <h1 class="text-4xl font-mono py-2">Initial State</h1>
       <p class="text-lg">
         CodeReviewShop was originally started to handle the increasing requests
         to assist my colleagues and friends in programing related courses.
@@ -60,6 +59,13 @@ const values = [
         engineering journey.
       </p>
     </div>
+    <div>
+      <h1 class="text-4xl font-mono py-2">Present Day</h1>
+      <p class="text-lg">
+        CodeReviewShop focuses on developing skill workshops to teach students about software development tools and
+        traditional problem solving.
+      </p>
+    </div>
     <div>
       <h1 class="text-4xl font-mono py-2">Prospective Future</h1>
       <p class="text-lg">
@@ -70,15 +76,10 @@ const values = [
     </div>
     <div>
       <h1 class="text-4xl font-mono py-2">Values</h1>
-      <div
-        class="pt-3 grid grid-cols-1 mx-4 sm:grid-cols-2 gap-5 justify-start items-start"
-      >
+      <div class="pt-3 grid grid-cols-1 mx-4 sm:grid-cols-2 gap-5 justify-start items-start">
         <div v-for="item in values">
           <div class="flex text-2xl items-center">
-            <font-awesome-icon
-              :icon="item.icon"
-              :class="['mr-2 ', item.color]"
-            />
+            <font-awesome-icon :icon="item.icon" :class="['mr-2 ', item.color]" />
             <p>{{ item.name }}</p>
           </div>
           <p class="text-lg">{{ item.desc }}</p>

src/views/Home/HomeView.vue

@@ -1,13 +1,17 @@
 <script setup>
 import FeedbackForm from "./FeedbackForm.vue";
 import WelcomeMsgSection from "./WelcomeMsgSection.vue";
+import SessionInfo from "./SessionInfo.vue";
 </script>
 
 <template>
   <div class="py-8 px-2">
     <!-- Welcome msg section -->
     <WelcomeMsgSection />
 
+    <!--Add past workshops sessions -->
+    <SessionInfo />
+
     <!-- insert feedback form -->
     <FeedbackForm />
   </div>

src/views/Home/SessionInfo.vue

@@ -0,0 +1,7 @@
+<script setup></script>
+<template>
+  <div class="text-center">
+    <div class="text-3xl my-6">Upcoming Workshops</div>
+    <div class="text-gray-600">No scheduled workshops yet...</div>
+  </div>
+</template>