Minor updates

Google-Developer-Student-Club-Malaysia · Dec 11, 2023 · a0a38df · a0a38df
1 parent 2af6d75
commit a0a38df
Show file tree

Hide file tree

Showing 22 changed files with 113 additions and 84 deletions.
diff --git a/kitahack-frontend/src/app/app.routes.ts b/kitahack-frontend/src/app/app.routes.ts
@@ -10,22 +10,24 @@ const routes: Routes = [
     children: [
       {
         path: '',
-        loadChildren: () => import('./pages/home/home.module').then(m => m.HomeModule)
+        loadChildren: () =>
+          import('./pages/home/home.module').then((m) => m.HomeModule),
       },
       {
         path: 'event',
-        loadChildren: () => import('./pages/event/event.module').then(m => m.EventModule)
-      }
-    ]
+        loadChildren: () =>
+          import('./pages/event/event.module').then((m) => m.EventModule),
+      },
+    ],
   },
   {
     path: '**',
     redirectTo: '',
-  }
+  },
 ];
 
 @NgModule({
-  imports: [RouterModule.forRoot(routes)],
-  exports: [RouterModule]
+  imports: [RouterModule.forRoot(routes, { anchorScrolling: 'enabled' })],
+  exports: [RouterModule],
 })
 export class AppRoutingModule {}
diff --git a/kitahack-frontend/src/app/components/attaches/attaches.component.html b/kitahack-frontend/src/app/components/attaches/attaches.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <a href="{{value.file.url}}" target="_blank" rel="noopener noreferral" type="button" class="w-full h-full ">
     <div class="flex justify-center p-2 py-10 my-auto text-gray-900 transition duration-500 border-4 shadow-lg dark:text-white bg-gray-50 dark:bg-gray-600 rounded-xl border-r-google-red-500 border-l-google-blue-500 border-t-google-green-500 border-b-google-yellow-500 hover:text-white hover:font-bold hover:bg-gradient-to-r via-google-yellow-500 to-google-red-500 from-google-blue-500 ">
       <div class="me-2">

diff --git a/kitahack-frontend/src/app/components/check-list/check-list.component.html b/kitahack-frontend/src/app/components/check-list/check-list.component.html
@@ -1,5 +1,4 @@
-<section class="my-5">
-
+<section class="mt-5">
   <div *ngFor="let item of value" class="flex items-center mb-2">
     <input [checked]="item.checked" id="default-checkbox" type="checkbox" value="" class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600" disabled>
     <label for="default-checkbox" class="text-sm font-medium text-gray-900 ms-2 dark:text-gray-300">

diff --git a/kitahack-frontend/src/app/components/code/code.component.html b/kitahack-frontend/src/app/components/code/code.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <pre class="line-numbers language-{{value.language}}">
 <code #codeEle class="language-{{value.language}} match-braces" data-prismjs-copy="copy">{{ value.code.trim() }}</code>
   </pre>

diff --git a/kitahack-frontend/src/app/components/delimiter/delimiter.component.html b/kitahack-frontend/src/app/components/delimiter/delimiter.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <div class="flex justify-center gap-4">
     <div class="w-2 h-2 rounded-full bg-google-red-500"></div>
     <div class="w-2 h-2 rounded-full bg-google-blue-500"></div>

diff --git a/kitahack-frontend/src/app/components/header/header.component.html b/kitahack-frontend/src/app/components/header/header.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <h1 [ngClass]="getHeaderLevel()" class="font-bold !font-[GoogleSans-Bold]">
     {{ value.text }}
   </h1>

diff --git a/kitahack-frontend/src/app/components/image/image.component.html b/kitahack-frontend/src/app/components/image/image.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <div [ngClass]="withBackground ? 'py-5 bg-gray-400' : ''">
     <img src="{{url}}" alt="{{caption}}" [ngClass]="{
       'p-5 rounded-md border-2 border-gray-600': withBorder,

diff --git a/kitahack-frontend/src/app/components/link-tool/link-tool.component.html b/kitahack-frontend/src/app/components/link-tool/link-tool.component.html
@@ -1,5 +1,5 @@
-<section class="my-5 text-center">
-  <a href="{{ link !== undefined ? link : '#' }}" target="_blank" rel="noreferral noopener" class="px-3 py-2 duration-200 rounded-md hover:bg-google-blue-500/10 text-google-blue-500">
+<section class="px-3 py-2 mt-5 text-center duration-200 rounded-md hover:bg-google-blue-500/10 text-google-blue-500">
+  <a href="{{ link !== undefined ? link : '#' }}" target="_blank" rel="noreferral noopener">
     {{ title !== undefined ? title : "Title not available" }}
   </a>
 </section>
diff --git a/kitahack-frontend/src/app/components/list/list.component.html b/kitahack-frontend/src/app/components/list/list.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <ul *ngIf="style === 'unordered'" class="max-w-md ml-5 space-y-1 text-gray-500 list-disc dark:text-gray-400">
     <li *ngFor="let text of value">
       {{text}}

diff --git a/kitahack-frontend/src/app/components/nested-list/nested-list.component.html b/kitahack-frontend/src/app/components/nested-list/nested-list.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <div *ngIf="style == 'unordered'">
     <ul *ngFor="let element of value" class="max-w-md ml-5 space-y-1 text-gray-500 list-disc dark:text-gray-400">
       <li>{{ element.content }}</li>

diff --git a/kitahack-frontend/src/app/components/paragraph/paragraph.component.html b/kitahack-frontend/src/app/components/paragraph/paragraph.component.html
@@ -1,7 +1,3 @@
-<section class="container px-6 mx-auto">
-  <div class="px-6 text-gray-800 md:px-12 lg:text-left xl:px-52">
-    <section class="my-5">
-      <p>{{ value }}</p>
-    </section>
-  </div>
-</section> 
+<section class="mt-5">
+  <p [innerHTML]="value"></p>
+</section>
diff --git a/kitahack-frontend/src/app/components/personality/personality.component.html b/kitahack-frontend/src/app/components/personality/personality.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <div class="flex flex-col items-center justify-center gap-10 pt-12 sm:flex-row">
     <img class="flex-none object-cover rounded-full aspect-square w-52" src="{{ photo }}" alt="Personality Photo" />
     <div class="flex-auto max-w-xl">

diff --git a/kitahack-frontend/src/app/components/quote/quote.component.html b/kitahack-frontend/src/app/components/quote/quote.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <div class="box-border px-3 py-5 bg-gray-100 rounded-2xl dark:bg-gray-300">
     <div [ngClass]="setAlignment() + ' mt-5 px-5 italic font-[Whisper] text-5xl'">
       {{ value.text }}

diff --git a/kitahack-frontend/src/app/components/table/table.component.html b/kitahack-frontend/src/app/components/table/table.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <div class="relative overflow-x-auto shadow-md sm:rounded-lg">
     <table class="w-full text-sm text-left text-gray-500 rtl:text-right dark:text-gray-400">
       <thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">

diff --git a/kitahack-frontend/src/app/components/warning/warning.component.html b/kitahack-frontend/src/app/components/warning/warning.component.html
@@ -1,4 +1,4 @@
-<section class="my-5">
+<section class="mt-5">
   <div class="space-y-8">
     <!-- <div class="p-4 rounded-lg shadow-lg bg-google-green-500/5 shadow-google-green-500/10">
       <div class="flex">

diff --git a/kitahack-frontend/src/app/layouts/navbar/navbar.component.html b/kitahack-frontend/src/app/layouts/navbar/navbar.component.html
@@ -1,15 +1,15 @@
 <header class="fixed top-0 z-20 w-full bg-white start-0">
   <nav class="flex items-center justify-between p-6 mx-auto max-w-7xl lg:px-8" aria-label="Global">
     <div class="flex lg:flex-1">
-      <a href="#" class="-m-1.5 p-1.5 flex flex-row items-center gap-3 text-gray-700">
+      <a routerLink="/" class="-m-1.5 p-1.5 flex flex-row items-center gap-3 text-gray-700">
         <span class="sr-only">GDSC KitaHack {{ clientPages.length.toString() }}</span>
         <img width="125" height="125" src="assets/img/kitahack.png" />
       </a>
     </div>
     <div class="flex space-x-5 lg:hidden">
       <button (click)="toggleEventNavbar()" type="button" class="-m-2.5 inline-flex items-center justify-center rounded-md p-2.5 text-gray-700">
         <span class="sr-only">Open event menu</span>
-        <svg class="w-6 h-6" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+        <svg class="w-6 h-6" fill="none" st1roke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
           <path stroke-linecap="round" stroke-linejoin="round" d="M16.5 6v.75m0 3v.75m0 3v.75m0 3V18m-9-5.25h5.25M7.5 15h3M3.375 5.25c-.621 0-1.125.504-1.125 1.125v3.026a2.999 2.999 0 010 5.198v3.026c0 .621.504 1.125 1.125 1.125h17.25c.621 0 1.125-.504 1.125-1.125v-3.026a2.999 2.999 0 010-5.198V6.375c0-.621-.504-1.125-1.125-1.125H3.375z"></path>
         </svg>
       </button>
@@ -22,8 +22,8 @@
     </div>
 
     <div class="hidden lg:flex lg:gap-x-12">
-      <a href="#hero" class="text-sm font-semibold leading-6 text-gray-700">Overview</a>
-      <a href="#faqs" class="text-sm font-semibold leading-6 text-gray-700">FAQs</a>
+      <a routerLink="/" fragment="hero" class="text-sm font-semibold leading-6 text-gray-700">Overview</a>
+      <a routerLink="/" fragment="faqs" class="text-sm font-semibold leading-6 text-gray-700">FAQs</a>
 
       <div class="relative">
         <button (click)="toggleEventButton()" type="button" class="flex items-center text-sm font-semibold leading-6 text-gray-700 gap-x-1" aria-expanded="false">
@@ -42,7 +42,7 @@
                 </svg>
               </div>
               <div class="flex-auto">
-                <a [routerLink]="'/event/' + clientPage.id" class="block font-semibold text-gray-700">
+                <a [routerLink]="'/event/' + clientPage.url" class="block font-semibold text-gray-700">
                   {{ clientPage.name }}
                   <span class="absolute inset-0" (click)="toggleEventButton()"></span>
                 </a>
@@ -76,7 +76,7 @@
                 </svg>
               </div>
               <div class="flex-auto">
-                <a href="#hero" class="block font-semibold text-gray-700">
+                <a routerLink="/" fragment="hero" class="block font-semibold text-gray-700">
                   What is KitaHack
                   <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
                 </a>
@@ -92,7 +92,7 @@
                 </svg>
               </div>
               <div class="flex-auto">
-                <a href="#sdg" class="block font-semibold text-gray-700">
+                <a routerLink="/" fragment="sdg" class="block font-semibold text-gray-700">
                   What is Sustainable Development Goals?
                   <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
                 </a>
@@ -108,7 +108,7 @@
                 </svg>
               </div>
               <div class="flex-auto">
-                <a href="#how-to-join" class="block font-semibold text-gray-700">
+                <a routerLink="/" fragment="how-to-join" class="block font-semibold text-gray-700">
                   How to join
                   <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
                 </a>
@@ -124,7 +124,7 @@
                 </svg>
               </div>
               <div class="flex-auto">
-                <a href="#team-formation" class="block font-semibold text-gray-700">
+                <a routerLink="/" fragment="team-formation" class="block font-semibold text-gray-700">
                   Team Formation
                   <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
                 </a>
@@ -140,7 +140,7 @@
                 </svg>
               </div>
               <div class="flex-auto">
-                <a href="#tracks" class="block font-semibold text-gray-700">
+                <a routerLink="/" fragment="tracks" class="block font-semibold text-gray-700">
                   Tracks
                   <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
                 </a>
@@ -156,7 +156,7 @@
                 </svg>
               </div>
               <div class="flex-auto">
-                <a href="#judging-criteria" class="block font-semibold text-gray-700">
+                <a routerLink="/" fragment="judging-criteria" class="block font-semibold text-gray-700">
                   Judging Criteria
                   <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
                 </a>
@@ -172,7 +172,7 @@
                 </svg>
               </div>
               <div class="flex-auto">
-                <a href="#judging-criteria" class="block font-semibold text-gray-700">
+                <a routerLink="/" fragment="submission-criteria" class="block font-semibold text-gray-700">
                   Submission Criteria
                   <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
                 </a>
@@ -188,7 +188,7 @@
                 </svg>
               </div>
               <div class="flex-auto">
-                <a href="#mentors" class="block font-semibold text-gray-700">
+                <a routerLink="/" fragment="mentors" class="block font-semibold text-gray-700">
                   Mentors
                   <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
                 </a>
@@ -204,7 +204,7 @@
                 </svg>
               </div>
               <div class="flex-auto">
-                <a href="#chapters" class="block font-semibold text-gray-700">
+                <a routerLink="/" fragment="chapters" class="block font-semibold text-gray-700">
                   Chapters
                   <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
                 </a>
@@ -215,7 +215,7 @@
             </div>
           </div>
           <div class="sticky bottom-0 flex flex-row w-full text-center bg-gray-50">
-            <a href="https://gdsc.community.dev/events/details/developer-student-clubs-monash-university-malaysia-presents-kitahack-2024-kickoff-session/" target="_blank" rel="noopener noreferrer" class="w-full p-3 text-base font-semibold leading-7 text-gray-700 hover:bg-gray-100">Register Here</a>
+            <a routerLink="/https://forms.gle/YCZZj5EQg5vS61y78" target="_blank" rel="noopener noreferrer" class="w-full p-3 text-base font-semibold leading-7 text-gray-700 hover:bg-gray-100">Register Here</a>
           </div>
         </div>
       </div>
@@ -245,7 +245,7 @@
                   </svg>
                 </div>
                 <div class="flex-auto">
-                  <a [routerLink]="'/event/' + clientPage.id" class="block font-semibold text-gray-700">
+                  <a (click)="toggleEventNavbar()" [routerLink]="'/event/' + clientPage.url" class="block font-semibold text-gray-700">
                     {{ clientPage.name }}
                     <span class="absolute inset-0" (click)="toggleEventButton()"></span>
                   </a>
@@ -288,7 +288,7 @@
                   </svg>
                 </div>
                 <div class="flex-auto">
-                  <a href="#hero" class="block font-semibold text-gray-700">
+                  <a routerLink="/" fragment="hero" class="block font-semibold text-gray-700">
                     What is KitaHack
                     <span class="absolute inset-0" (click)="toggleMoreNavbar()"></span>
                   </a>
@@ -304,9 +304,9 @@
                   </svg>
                 </div>
                 <div class="flex-auto">
-                  <a href="#sdg" class="block font-semibold text-gray-700">
+                  <a routerLink="/" fragment="sdg" class="block font-semibold text-gray-700">
                     What is Sustainable Development Goals?
-                    <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
+                    <span class="absolute inset-0" (click)="toggleMoreNavbar()"></span>
                   </a>
                   <p class="mt-1 text-gray-600">
                     Join to preserve the environment!
@@ -320,7 +320,7 @@
                   </svg>
                 </div>
                 <div class="flex-auto">
-                  <a href="#how-to-join" class="block font-semibold text-gray-700">
+                  <a routerLink="/" fragment="how-to-join" class="block font-semibold text-gray-700">
                     How to join
                     <span class="absolute inset-0" (click)="toggleMoreNavbar()"></span>
                   </a>
@@ -336,7 +336,7 @@
                   </svg>
                 </div>
                 <div class="flex-auto">
-                  <a href="#team-formation" class="block font-semibold text-gray-700">
+                  <a routerLink="/" fragment="team-formation" class="block font-semibold text-gray-700">
                     Team Formation
                     <span class="absolute inset-0" (click)="toggleMoreNavbar()"></span>
                   </a>
@@ -352,7 +352,7 @@
                   </svg>
                 </div>
                 <div class="flex-auto">
-                  <a href="#tracks" class="block font-semibold text-gray-700">
+                  <a routerLink="/" fragment="tracks" class="block font-semibold text-gray-700">
                     Tracks
                     <span class="absolute inset-0" (click)="toggleMoreNavbar()"></span>
                   </a>
@@ -368,7 +368,7 @@
                   </svg>
                 </div>
                 <div class="flex-auto">
-                  <a href="#judging-criteria" class="block font-semibold text-gray-700">
+                  <a routerLink="/" fragment="judging-criteria" class="block font-semibold text-gray-700">
                     Judging Criteria
                     <span class="absolute inset-0" (click)="toggleMoreNavbar()"></span>
                   </a>
@@ -384,9 +384,9 @@
                   </svg>
                 </div>
                 <div class="flex-auto">
-                  <a href="#judging-criteria" class="block font-semibold text-gray-700">
+                  <a routerLink="/" fragment="submission-criteria" class="block font-semibold text-gray-700">
                     Submission Criteria
-                    <span class="absolute inset-0" (click)="toggleMoreButton()"></span>
+                    <span class="absolute inset-0" (click)="toggleMoreNavbar()"></span>
                   </a>
                   <p class="mt-1 text-gray-600">
                     You can only submit your project once
@@ -400,7 +400,7 @@
                   </svg>
                 </div>
                 <div class="flex-auto">
-                  <a href="#mentors" class="block font-semibold text-gray-700">
+                  <a routerLink="/" fragment="mentors" class="block font-semibold text-gray-700">
                     Mentors
                     <span class="absolute inset-0" (click)="toggleMoreNavbar()"></span>
                   </a>
@@ -416,7 +416,7 @@
                   </svg>
                 </div>
                 <div class="flex-auto">
-                  <a href="#chapters" class="block font-semibold text-gray-700">
+                  <a routerLink="/" fragment="chapters" class="block font-semibold text-gray-700">
                     Chapters
                     <span class="absolute inset-0" (click)="toggleMoreNavbar()"></span>
                   </a>
@@ -426,22 +426,11 @@
                 </div>
               </div>
             </div>
-            <!-- <div class="py-6 space-y-2">
-              <a (click)="toggleMoreNavbar()" href="#hero" class="block px-3 py-2 -mx-3 text-base font-semibold leading-7 text-gray-700 rounded-lg hover:bg-gray-50">Overview</a>
-              <a (click)="toggleMoreNavbar()" href="#what-is-kitahack" class="block px-3 py-2 -mx-3 text-base font-semibold leading-7 text-gray-700 rounded-lg hover:bg-gray-50">What is KitaHack</a>
-              <a (click)="toggleMoreNavbar()" href="#how-to-join" class="block px-3 py-2 -mx-3 text-base font-semibold leading-7 text-gray-700 rounded-lg hover:bg-gray-50">How to join</a>
-              <a (click)="toggleMoreNavbar()" href="#team-formation" class="block px-3 py-2 -mx-3 text-base font-semibold leading-7 text-gray-700 rounded-lg hover:bg-gray-50">Team Formation</a>
-              <a (click)="toggleMoreNavbar()" href="#tracks" class="block px-3 py-2 -mx-3 text-base font-semibold leading-7 text-gray-700 rounded-lg hover:bg-gray-50">Tracks</a>
-              <a (click)="toggleMoreNavbar()" href="#judging-criteria" class="block px-3 py-2 -mx-3 text-base font-semibold leading-7 text-gray-700 rounded-lg hover:bg-gray-50">Judging Criteria</a>
-              <a (click)="toggleMoreNavbar()" href="#mentors" class="block px-3 py-2 -mx-3 text-base font-semibold leading-7 text-gray-700 rounded-lg hover:bg-gray-50">Mentors</a>
-              <a (click)="toggleMoreNavbar()" href="#chapters" class="block px-3 py-2 -mx-3 text-base font-semibold leading-7 text-gray-700 rounded-lg hover:bg-gray-50">Chapters</a>
-              <a (click)="toggleMoreNavbar()" href="#faqs" class="block px-3 py-2 -mx-3 text-base font-semibold leading-7 text-gray-700 rounded-lg hover:bg-gray-50">FAQs</a>
-            </div> -->
           </div>
         </div>
       </div>
       <div class="sticky bottom-0 flex flex-row w-full text-center bg-gray-50">
-        <a href="https://gdsc.community.dev/events/details/developer-student-clubs-monash-university-malaysia-presents-kitahack-2024-kickoff-session/" target="_blank" rel="noopener noreferrer" class="w-full p-3 text-base font-semibold leading-7 text-gray-700 hover:bg-gray-100">Register Here</a>
+        <a routerLink="/https://forms.gle/YCZZj5EQg5vS61y78" target="_blank" rel="noopener noreferrer" class="w-full p-3 text-base font-semibold leading-7 text-gray-700 hover:bg-gray-100">Register Here</a>
       </div>
     </div>
   </div>

diff --git a/kitahack-frontend/src/app/pages/event/event.component.html b/kitahack-frontend/src/app/pages/event/event.component.html
@@ -27,7 +27,7 @@ <h2 class="font-semibold leading-7 text-google-blue-500">
     </div>
 
     <div *ngIf="clientPage === undefined || chapter === undefined || blocks.length <= 0" class="text-center">
-      <img src="/assets/img/google_developers_preloader.gif" alt="Google DevelopersPreloader">
+      <img src="/assets/img/google_developers_preloader.gif" alt="Google Developers Preloader">
     </div>
   </div>
 </section>