fix discord button, remove empty sponsors, fix links

WISVCH · Jan 12, 2024 · 3be8e9a · 3be8e9a
1 parent ec1a4cf
commit 3be8e9a
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 46 deletions.
diff --git a/data/sponsors.json b/data/sponsors.json
@@ -14,15 +14,5 @@
                 "title": "X TU Delft"
             }
         ]
-    },
-    {
-        "type": "primary",
-        "title": "Primary",
-        "items": []
-    },
-    {
-        "type": "secondary",
-        "title": "Supporting",
-        "items": []
     }
 ]
diff --git a/src/components/header/index.tsx b/src/components/header/index.tsx
@@ -26,10 +26,10 @@ export const Header: FunctionalComponent = () => (
                 {/* TODO: uncomment when tickets are online */}
                 {/* <button>Tickets</button> */}
                 {/* <button class={style.secondary}>Join Discord</button> */}
-                <button href="https://discord.gg/rB2ucUaFnc" target="_blank">
+                <a href="https://discord.gg/rB2ucUaFnc" target="_blank">
                     <Icon icon={faDiscord} pad />
                     Join Discord
-                </button>
+                </a>
             </div>
         </div>
 

diff --git a/src/components/header/style.scss b/src/components/header/style.scss
@@ -33,14 +33,19 @@
         margin-top: 60px;
     }
 
-    button {
+    a {
         border-radius: 10px;
         border: 1px solid $background-color;
         background-color: $primary-color;
         color: $background-color;
         font-size: 18px;
         padding: 10px 15px;
         width: 200px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        text-decoration: none;
+        margin-bottom: 16px;
 
         &:hover {
             background-color: $primary-color-darker;

diff --git a/src/components/sponsors/index.tsx b/src/components/sponsors/index.tsx
@@ -11,7 +11,7 @@ import * as style from "./style.scss";
  * Renders the sponsors section.
  */
 export const Sponsors: FunctionalComponent = () => (
-    <section class={style.sponsors}>
+    <section class={style.sponsors} id='sponsors'>
         <h2>Sponsors</h2>
         {sponsorData.map((sponsor: SponsorCategory) => sponsorItem(sponsor))}
     </section>
@@ -26,41 +26,43 @@ export const sponsorItem = (category: SponsorCategory) => {
 
     return (
         <Fragment>
-            <h3>{category.title}</h3>
-            <ul class={style.sponsorlist}>
-                {sponsors.map((sponsor: Sponsor) => (
-                    <li key={sponsor.logoKey} data-type={category.type}>
-
-                        <a
-                            href={sponsor.url}
-                            target="_blank"
-                            rel="noopener"
-                            title={sponsor.title}
-                        >
+            <div>
+                {/* <h3>{category.title}</h3> */}
+                <ul class={style.sponsorlist}>
+                    {sponsors.map((sponsor: Sponsor) => (
+                        <li key={sponsor.logoKey} data-type={category.type}>
 
-                            <div class={style.topbar}>
-                                <hr/>
-                            </div>
-
-                            <div class={style.img}>
-                                <img
-                                    src={sponsorLogoMap[
-                                        sponsor.logoKey
-                                    ].toString()}
-                                    alt={sponsor.title}
-                                />
-
-                            </div>                        
-                            <p>{sponsor.title}</p>           
+                            <a
+                                href={sponsor.url}
+                                target="_blank"
+                                rel="noopener"
+                                title={sponsor.title}
+                            >
 
-                            <div class={style.bottombar}>
-                                <hr/>
-                            </div>
+                                <div class={style.topbar}>
+                                    <hr />
+                                </div>
 
-                        </a>                 
-                    </li>
-                ))}
-            </ul>
+                                <div class={style.img}>
+                                    <img
+                                        src={sponsorLogoMap[
+                                            sponsor.logoKey
+                                        ].toString()}
+                                        alt={sponsor.title}
+                                    />
+
+                                </div>
+                                <p>{sponsor.title}</p>
+
+                                <div class={style.bottombar}>
+                                    <hr />
+                                </div>
+
+                            </a>
+                        </li>
+                    ))}
+                </ul>
+            </div>
         </Fragment>
     );
 };