feat: added sponsors to the footer

hackerspace-ntnu · Jan 19, 2024 · 98372da · 98372da
1 parent eda6b94
commit 98372da
Show file tree

Hide file tree

Showing 10 changed files with 377 additions and 12 deletions.
diff --git a/messages/en.json b/messages/en.json
@@ -15,6 +15,15 @@
     "profile": "Profile",
     "signIn": "Sign in",
     "links": "Links",
-    "socialMedia": "Social media"
+    "socialMedia": "Social media",
+    "visitOurSlack": "Visit our Slack",
+    "visitOurFacebook": "Visit our Facebook",
+    "visitOurGithub": "Visit our Github",
+    "visitOurInstagram": "Visit our Instagram",
+    "NTNUIDI": "NTNU Department of Computer Science",
+    "NTNUIDIURL": "https://www.ntnu.edu/idi",
+    "NTNUKiD": "The working life network KID",
+    "copyright": "Copyright",
+    "allRightsReserved": "All rights reserved"
   }
 }
diff --git a/messages/no.json b/messages/no.json
@@ -15,6 +15,14 @@
     "profile": "Profil",
     "signIn": "Logg inn",
     "links": "Lenker",
-    "socialMedia": "Sosiale medier"
+    "socialMedia": "Sosiale medier",
+    "visitOurSlack": "Besøk vår Slack",
+    "visitOurFacebook": "Besøk vår Facebook",
+    "visitOurGithub": "Besøk vår Github",
+    "visitOurInstagram": "Besøk vår Instagram",
+    "NTNUIDI": "NTNU Institutt for datateknologi og informatikk",
+    "NTNUIDIURL": "https://www.ntnu.no/idi",
+    "copyright": "Opphavsrett",
+    "allRightsReserved": "Alle rettigheter reservert"
   }
 }
diff --git a/prettier.config.js b/prettier.config.js
@@ -6,7 +6,6 @@ const config = {
   useTabs: false,
   jsxSingleQuote: true,
   importOrder: [
-    '^react$',
     '^[./]',
     '^@/(lib|styles)/(.*)$',
     '^@/hooks/(.*)$',

diff --git a/src/components/assets/sponsors/IDILogo.tsx b/src/components/assets/sponsors/IDILogo.tsx
diff --git a/src/components/assets/sponsors/KiDLogo.tsx b/src/components/assets/sponsors/KiDLogo.tsx
@@ -0,0 +1,82 @@
+import { cx } from '@/lib/utils';
+
+function KiDLogo({
+  className,
+  title,
+  ...rest
+}: {
+  className?: string;
+  title: string;
+}) {
+  return (
+    <svg
+      className={cx('text-black dark:text-white', className)}
+      width='100%'
+      height='100%'
+      viewBox='0 0 782 139'
+      xmlns='http://www.w3.org/2000/svg'
+      aria-describedby='kidlogo'
+      {...rest}
+    >
+      <title id='kidlogo'>{title}</title>
+      <path
+        d='M535.6,6.2c-0.3,0.7 -0.7,4.2 -1.1,7.8c-0.3,3.6 -1.9,19.3 -3.5,35c-7.3,70 -8.1,78.3 -7.2,79.2c0.5,0.5 6.4,0.7 13.2,0.6c9.7,-0.2 12.4,-0.6 13,-1.8c0.4,-0.8 1.5,-8.1 2.3,-16.1c1.3,-12.9 1.8,-15.1 4.2,-18.7c1.5,-2.3 3.1,-4.2 3.4,-4.2c0.7,0 12.1,36.6 12.1,38.7c0,0.6 0.7,1.4 1.6,1.7c2.4,0.9 28.2,0.7 28.8,-0.2c0.3,-0.5 -4.2,-16 -10,-34.6c-5.7,-18.6 -10.4,-34.7 -10.4,-35.8c0,-1.1 7.3,-12.7 16.1,-25.7c8.9,-13 16.2,-24.3 16.3,-25.1c0.1,-1.3 -2.1,-1.5 -14.4,-1.5l-14.5,0l-13,20.9c-7.1,11.5 -13.1,20.2 -13.3,19.3c-0.2,-0.9 0.6,-10 1.7,-20.3c1.2,-10.2 1.8,-19 1.5,-19.5c-0.9,-1.5 -26.4,-1.1 -26.8,0.3Z'
+        fill='#144e9d'
+      />
+      <path
+        d='M696.7,5.7c-0.3,0.5 -0.8,3.9 -1.2,7.8c-0.3,3.8 -1,10.4 -1.6,14.5c-0.5,4.1 -1.8,16.7 -2.9,28c-1.1,11.3 -3.1,31.3 -4.5,44.5c-1.3,13.2 -2.5,25 -2.5,26.3l0,2.4l24.3,-0.4c23.2,-0.4 24.5,-0.5 31,-3c9.3,-3.5 14.1,-7.1 19.2,-14.2c7.8,-11 10,-20.8 13.9,-62.6c0.5,-5.6 -1.3,-17.6 -3.5,-23.5c-3.8,-10.1 -13,-17.1 -25.4,-19.4c-6.6,-1.2 -46.1,-1.5 -46.8,-0.4Zm39.2,24.1c8.5,4.3 9.7,10.5 7.1,36.5c-2.2,22 -3.8,28.3 -8.3,33.4c-4,4.6 -8.2,6.3 -15.2,6.3l-5.5,0l-0,-3.3c-0,-1.7 1.1,-13.1 2.4,-25.2c1.3,-12.1 3,-27.6 3.6,-34.5c0.7,-6.9 1.7,-13.1 2.3,-13.8c1.4,-1.8 9.7,-1.5 13.6,0.6Z'
+        fill='#144e9d'
+      />
+      <path
+        d='M648,6.8c-8.8,3.9 -11.9,13.9 -6.2,20.3c7,7.8 21.5,2.8 22.9,-7.8c0.7,-5 -1.6,-9.7 -5.7,-11.8c-3,-1.5 -8.3,-1.9 -11,-0.7Z'
+        fill='#144e9d'
+      />
+      <path
+        d='M350.6,13.2c-0.5,2.2 -6.6,92.2 -6.6,96c0,1.4 0.8,1.8 3.4,1.8l3.4,0l1.4,-26.8l5.8,-6.3c3.2,-3.5 6.1,-6.1 6.4,-5.8c0.3,0.3 4.6,9.1 9.6,19.5l8.9,18.9l8,0.6l-6.5,-14.3c-3.6,-7.9 -8.4,-18.3 -10.6,-23.1l-4,-8.8l8.3,-9.2c4.5,-5.1 9.8,-10.9 11.8,-13l3.5,-3.7l-9.9,-0l-14.9,16.6c-8.1,9.1 -14.9,16.4 -15.1,16.2c-0.2,-0.2 0.5,-11.8 1.6,-25.8c1,-14 1.8,-27.6 1.9,-30.3c0,-4.6 -0.1,-4.7 -3,-4.7c-2.3,-0 -3.1,0.5 -3.4,2.2Z'
+        fill='currentColor'
+      />
+      <path
+        d='M134.6,24.2c-0.4,2.9 -0.7,7.3 -0.9,9.8l-0.2,4.5l-4.2,0.3c-4.2,0.3 -4.3,0.4 -4.3,3.8c-0,3.3 0.1,3.4 4.1,3.4l4.1,0l-0.6,6.7c-1.8,20 -3.6,51 -3.1,53.5c1.3,5.6 8.3,8.3 14.9,5.8c2,-0.7 2.6,-1.6 2.6,-4c-0,-2.9 -0.2,-3 -4.5,-3c-6.8,0 -6.9,-0.3 -5,-27.3c0.9,-12.8 1.8,-25.1 2.1,-27.5l0.5,-4.2l10.9,0l-0,-6.9l-5.2,-0.3l-5.3,-0.3l0.3,-8c0.2,-4.4 0.5,-8.8 0.8,-9.8c0.4,-1.4 -0.1,-1.7 -3,-1.7c-3.4,0 -3.5,0 -4,5.2Z'
+        fill='currentColor'
+      />
+      <path
+        d='M165.6,24.2c-0.4,2.9 -0.7,7.3 -0.9,9.8l-0.2,4.5l-4.2,0.3c-4.2,0.3 -4.3,0.4 -4.3,3.8c0,3.3 0.1,3.4 4.1,3.4l4.1,0l-0.6,6.7c-1.8,20 -3.6,51 -3.1,53.5c1.3,5.6 8.3,8.3 14.9,5.8c2,-0.7 2.6,-1.6 2.6,-4c0,-2.9 -0.2,-3 -4.5,-3c-6.8,0 -6.9,-0.3 -5,-27.3c0.9,-12.8 1.8,-25.1 2.1,-27.5l0.5,-4.2l10.9,0l0,-6.9l-5.2,-0.3l-5.3,-0.3l0.3,-8c0.2,-4.4 0.5,-8.8 0.8,-9.8c0.4,-1.4 -0.1,-1.7 -3,-1.7c-3.4,0 -3.5,0 -4,5.2Z'
+        fill='currentColor'
+      />
+      <path
+        d='M470.6,24.2c-0.4,2.9 -0.7,7.3 -0.9,9.8l-0.2,4.5l-4.2,0.3c-4.2,0.3 -4.3,0.4 -4.3,3.8c-0,3.3 0.1,3.4 4.1,3.4l4.1,0l-0.6,6.7c-1.8,20 -3.6,51 -3.1,53.5c1.3,5.6 8.3,8.3 14.9,5.8c2,-0.7 2.6,-1.6 2.6,-4c-0,-2.9 -0.2,-3 -4.5,-3c-6.8,0 -6.9,-0.3 -5,-27.3c0.9,-12.8 1.8,-25.1 2.1,-27.5l0.5,-4.2l10.9,0l-0,-6.9l-5.2,-0.3l-5.3,-0.3l0.3,-8c0.2,-4.4 0.5,-8.8 0.8,-9.8c0.4,-1.4 -0.1,-1.7 -3,-1.7c-3.4,0 -3.5,0 -4,5.2Z'
+        fill='currentColor'
+      />
+      <path
+        d='M23.5,38.6c-1.6,0.8 -5,3.4 -7.4,5.7l-4.3,4.2l0.6,-4.8l0.7,-4.7l-3.5,-0c-2,-0 -3.6,0.1 -3.6,0.2c0,0.2 -1.1,16 -2.5,35.3c-1.4,19.2 -2.5,35.3 -2.5,35.7c0,0.5 1.6,0.8 3.5,0.8c3,-0 3.5,-0.3 3.5,-2.3c0,-9.3 3.3,-44.2 4.6,-48.5c3.9,-13.5 18.5,-20.4 26.8,-12.7c4.5,4.2 4.9,8.6 3.2,32.9c-0.9,12.2 -1.6,24 -1.6,26.4c-0,4 0.1,4.2 3,4.2c2.5,-0 3,-0.4 3.4,-3.3c1.2,-8.1 3.7,-52.2 3.1,-55.7c-0.9,-5.2 -5.8,-11.8 -10,-13.6c-4.5,-1.9 -13.2,-1.8 -17,0.2Z'
+        fill='currentColor'
+      />
+      <path
+        d='M81.3,40c-2.8,1.6 -6.3,4.4 -7.6,6.2c-14.4,19.2 -13.8,52.8 1,63.2c3.5,2.4 5.4,3 11.5,3.3c6.5,0.4 7.9,0.2 12.7,-2.4c6.3,-3.2 10,-7.4 13.5,-15.6l2.6,-5.7l-4,0c-3.6,0 -4.1,0.3 -5.5,3.7c-3.2,7.7 -9.6,12.3 -17,12.3c-11.7,0 -18.5,-10.2 -17.6,-26.3c0.1,-1.6 1.9,-1.7 22.6,-1.7l22.5,0l0,-7.8c0,-20.8 -8.3,-32.2 -23.5,-32.2c-4.8,0 -7,0.6 -11.2,3Zm17.3,5.9c6.6,3 10.4,10.2 10.4,19.8l0,4.3l-19,0c-10.4,0 -19,-0.2 -19,-0.4c0,-0.2 0.9,-3.3 2,-6.9c1.4,-4.6 3.3,-8 6.6,-11.6c6.3,-7 11.7,-8.5 19,-5.2Z'
+        fill='currentColor'
+      />
+      <path
+        d='M261.3,40c-2.8,1.6 -6.3,4.4 -7.6,6.2c-14.4,19.2 -13.8,52.8 1,63.2c3.5,2.4 5.4,3 11.5,3.3c6.5,0.4 7.9,0.2 12.7,-2.4c6.3,-3.2 10,-7.4 13.5,-15.6l2.6,-5.7l-4,0c-3.6,0 -4.1,0.3 -5.5,3.7c-3.2,7.7 -9.6,12.3 -17,12.3c-11.7,0 -18.5,-10.2 -17.6,-26.3c0.1,-1.6 1.9,-1.7 22.6,-1.7l22.5,0l-0,-7.8c-0,-20.8 -8.3,-32.2 -23.5,-32.2c-4.8,0 -7,0.6 -11.2,3Zm17.3,5.9c6.6,3 10.4,10.2 10.4,19.8l-0,4.3l-19,0c-10.4,0 -19,-0.2 -19,-0.4c-0,-0.2 0.9,-3.3 2,-6.9c1.4,-4.6 3.3,-8 6.6,-11.6c6.3,-7 11.7,-8.5 19,-5.2Z'
+        fill='currentColor'
+      />
+      <path
+        d='M330,38.1c-3.5,1.4 -6.9,4.8 -9.1,9.1c-1.1,2.1 -2,3.8 -2.2,3.8c-0.1,0 0,-2.7 0.1,-6l0.4,-6l-6.8,0l-2.2,33.2c-2.8,41.9 -2.9,38.8 0.8,38.8c3.5,0 3.4,0.4 5,-23.5c1.3,-20 2.3,-25.3 5.8,-31.8c2.8,-5.3 9,-9.7 13.5,-9.7c2.3,0 2.7,-0.4 2.7,-2.9c0,-1.6 0.3,-3.6 0.6,-4.5c0.5,-1.3 -0.1,-1.6 -2.7,-1.5c-1.9,-0 -4.5,0.5 -5.9,1Z'
+        fill='currentColor'
+      />
+      <path
+        d='M417.3,40c-2.8,1.6 -6.3,4.4 -7.6,6.2c-14.4,19.2 -13.8,52.8 1,63.2c3.5,2.4 5.4,3 11.5,3.3c6.5,0.4 7.9,0.2 12.7,-2.4c6.3,-3.2 10,-7.4 13.5,-15.6l2.6,-5.7l-4,0c-3.6,0 -4.1,0.3 -5.5,3.7c-3.2,7.7 -9.6,12.3 -17,12.3c-11.7,0 -18.5,-10.2 -17.6,-26.3c0.1,-1.6 1.9,-1.7 22.6,-1.7l22.5,0l0,-7.8c0,-20.8 -8.3,-32.2 -23.5,-32.2c-4.8,0 -7,0.6 -11.2,3Zm17.3,5.9c6.6,3 10.4,10.2 10.4,19.8l0,4.3l-19,0c-10.4,0 -19,-0.2 -19,-0.4c0,-0.2 0.9,-3.3 2,-6.9c1.4,-4.6 3.3,-8 6.6,-11.6c6.3,-7 11.7,-8.5 19,-5.2Z'
+        fill='currentColor'
+      />
+      <path
+        d='M187.5,41.7c0.4,1.6 4,17 8.1,34.3c4.2,17.3 7.7,32.3 8,33.2c0.4,1.3 1.6,1.8 4.4,1.8c3.7,0 3.9,-0.2 5.8,-5.3c1.1,-2.8 7.2,-18.9 13.6,-35.5c6.4,-16.7 11.6,-30.6 11.6,-30.8c0,-0.2 -1.7,-0.4 -3.7,-0.4l-3.8,-0l-10.9,29.6c-6,16.2 -11.2,29.7 -11.6,29.9c-0.3,0.2 -3.7,-13.1 -7.6,-29.5l-6.9,-30l-3.9,-0c-3.7,-0 -3.8,0.1 -3.1,2.7Z'
+        fill='currentColor'
+      />
+      <path
+        d='M635.5,44.2c-1.6,12.1 -8.3,83.3 -7.9,84c0.3,0.4 6.1,0.8 13,0.8c12,0 12.5,-0.1 13.3,-2.3c0.6,-1.7 9.2,-82.6 9.1,-86c0,-0.4 -6,-0.7 -13.4,-0.7l-13.5,0l-0.6,4.2Z'
+        fill='#144e9d'
+      />
+    </svg>
+  );
+}
+
+export { KiDLogo };
diff --git a/src/components/assets/sponsors/kid.svg b/src/components/assets/sponsors/kid.svg
diff --git a/src/components/layout/Footer.tsx b/src/components/layout/Footer.tsx
@@ -3,14 +3,20 @@ import ExternalLink from 'next/link';
 
 import { Link } from '@/lib/navigation';
 
+import { Facebook } from '@/components/assets/icons/Facebook';
+import { Github } from '@/components/assets/icons/Github';
+import { Instagram } from '@/components/assets/icons/Instagram';
+import { Slack } from '@/components/assets/icons/Slack';
+import { IDILogo } from '@/components/assets/sponsors/IDILogo';
+import { KiDLogo } from '@/components/assets/sponsors/KiDLogo';
 import { LogoLink } from '@/components/layout/LogoLink';
 import { Button } from '@/components/ui/Button';
 
 function Footer() {
   const t = useTranslations('layout');
   const year = new Date().getFullYear();
   return (
-    <footer className='z-10 flex w-full justify-center border-b border-border/40 bg-background/95 px-11 py-10 md:px-16 lg:px-24'>
+    <footer className='z-10 flex w-full justify-center border-t border-border/40 bg-background/95 px-11 py-10 md:px-16 lg:px-24'>
       <div className='w-full max-w-screen-2xl text-sm'>
         <div className='xs:grid-cols-2 grid grid-cols-1 gap-x-4 gap-y-12 sm:grid-cols-3 lg:grid-cols-4'>
           <div>
@@ -53,16 +59,72 @@ function Footer() {
           </div>
           <div>
             <h4>{t('socialMedia')}</h4>
-            <ul>
+            <ul className='flex flex-row text-foreground/80'>
               <li>
-                <Button asChild variant='ghost' size='icon'>
-                  <ExternalLink href='https://hackerspace-ntnu.slack.com/'></ExternalLink>
+                <Button asChild variant='ghost' size='sm-icon'>
+                  <ExternalLink
+                    href='https://hackerspace-ntnu.slack.com/'
+                    prefetch={false}
+                    aria-label={t('visitOurSlack')}
+                  >
+                    <Slack className='h-4 w-4' />
+                  </ExternalLink>
+                </Button>
+              </li>
+              <li>
+                <Button asChild variant='ghost' size='sm-icon'>
+                  <ExternalLink
+                    href='https://www.facebook.com/hackerspacentnu'
+                    prefetch={false}
+                    aria-label={t('visitOurFacebook')}
+                  >
+                    <Facebook className='h-4 w-4' />
+                  </ExternalLink>
+                </Button>
+              </li>
+              <li>
+                <Button asChild variant='ghost' size='sm-icon'>
+                  <ExternalLink
+                    href='https://github.com/hackerspace-ntnu/'
+                    prefetch={false}
+                    aria-label={t('visitOurGithub')}
+                  >
+                    <Github className='h-4 w-4' />
+                  </ExternalLink>
+                </Button>
+              </li>
+              <li>
+                <Button asChild variant='ghost' size='sm-icon'>
+                  <ExternalLink
+                    href='https://www.instagram.com/hackerspacentnu/'
+                    prefetch={false}
+                    aria-label={t('visitOurInstagram')}
+                  >
+                    <Instagram className='h-4 w-4' />
+                  </ExternalLink>
                 </Button>
               </li>
-              <li></li>
             </ul>
           </div>
         </div>
+        <nav className='py-20'>
+          <ul className='flex flex-col justify-center gap-6 sm:flex-row md:gap-10 lg:gap-20 xl:gap-40'>
+            <li>
+              <ExternalLink href={t('NTNUIDIURL')} prefetch={false}>
+                <IDILogo className='p-6' title={t('NTNUIDI')} />
+              </ExternalLink>
+            </li>
+            <li>
+              <ExternalLink href='https://www.ntnu.no/ie/kid/' prefetch={false}>
+                <KiDLogo className='p-6' title={t('NTNUKiD')} />
+              </ExternalLink>
+            </li>
+          </ul>
+        </nav>
+        <p className='text-center'>
+          {t('copyright')} &copy; {year}, Hackerspace NTNU.{' '}
+          {t('allRightsReserved')}.
+        </p>
       </div>
     </footer>
   );

diff --git a/src/components/settings/DarkModeMenu.tsx b/src/components/settings/DarkModeMenu.tsx
@@ -1,5 +1,8 @@
 'use client';
 
+import { Moon, Sun } from 'lucide-react';
+import { useTheme } from 'next-themes';
+
 import * as React from 'react';
 
 import { Button } from '@/components/ui/Button';
@@ -9,8 +12,6 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from '@/components/ui/DropdownMenu';
-import { Moon, Sun } from 'lucide-react';
-import { useTheme } from 'next-themes';
 
 type DarkModeMenuProps = {
   toggleTheme: string;

diff --git a/src/components/settings/ProfileMenu.tsx b/src/components/settings/ProfileMenu.tsx
@@ -1,7 +1,6 @@
 'use client';
 
 import { User } from 'lucide-react';
-
 import * as React from 'react';
 
 import { Button } from '@/components/ui/Button';

diff --git a/src/components/ui/Button.tsx b/src/components/ui/Button.tsx
@@ -1,5 +1,4 @@
 import { Slot } from '@radix-ui/react-slot';
-
 import * as React from 'react';
 
 import { type VariantProps, cva } from '@/lib/utils';
@@ -24,6 +23,7 @@ const buttonVariants = cva({
       sm: 'h-9 rounded-md px-3',
       lg: 'h-11 rounded-md px-8',
       icon: 'h-10 w-10',
+      'sm-icon': 'h-8 w-8',
       none: '',
     },
   },