feat(open-source): Add MyTimetable website link (#202)

compsci-adl · Oct 10, 2024 · 32bceff · 32bceff
1 parent 9862c95
commit 32bceff
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 11 deletions.
diff --git a/src/app/open-source/ProjectCard.tsx b/src/app/open-source/ProjectCard.tsx
@@ -4,7 +4,7 @@ import Tag from '@/components/Tag';
 import { TECH_COLORS } from '@/constants/colours';
 import type { Project } from '@/data/projects';
 import Image from 'next/image';
-import { FaGithub } from 'react-icons/fa';
+import { FaGithub, FaExternalLinkAlt } from 'react-icons/fa';
 
 export default function ProjectCard({ project }: { project: Project }) {
     return (
@@ -31,16 +31,35 @@ export default function ProjectCard({ project }: { project: Project }) {
                             <Tag key={i} name={tech} backgroundColor={TECH_COLORS[tech]} />
                         ))}
                     </div>
-                    <Button
-                        colour="orange"
-                        href={project.githubLink}
-                        width="w-full"
-                        size="small"
-                        targetBlank={true}
-                    >
-                        <FaGithub className="mr-2 inline-block text-xl md:text-2xl" />
-                        View on GitHub
-                    </Button>
+                    <div className="flex w-full flex-col gap-4 lg-xl:flex-row">
+                        <div className="flex-1">
+                            <Button
+                                colour="orange"
+                                href={project.githubLink}
+                                width="w-full"
+                                size="small"
+                                targetBlank={true}
+                            >
+                                <FaGithub className="mr-2 inline-block text-xl md:text-2xl" />
+                                View on GitHub
+                            </Button>
+                        </div>
+
+                        {project.websiteLink && (
+                            <div className="flex-1">
+                                <Button
+                                    colour="purple"
+                                    href={project.websiteLink}
+                                    width="w-full"
+                                    size="small"
+                                    targetBlank={true}
+                                >
+                                    <FaExternalLinkAlt className="mr-2 inline-block text-xl md:text-2xl" />
+                                    Visit now
+                                </Button>
+                            </div>
+                        )}
+                    </div>
                 </div>
             </div>
         </FancyRectangle>

diff --git a/src/data/projects.ts b/src/data/projects.ts
@@ -5,6 +5,7 @@ export interface Project {
     description: string;
     image: string;
     githubLink: string;
+    websiteLink?: string;
     techStacks: TechStack[];
 }
 
@@ -45,6 +46,7 @@ export const PROJECTS: Project[] = [
             'An interactive drag-and-drop timetable scheduler to help UofA students optimise their weekly timetable.',
         image: 'mytimetable.png',
         githubLink: 'https://github.com/compsci-adl/mytimetable',
+        websiteLink: 'https://mytimetable.csclub.org.au/',
         techStacks: [
             'TypeScript',
             'React',