-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Get things mostly production ready (#17)
* Tracking * Frontpage with articles * Initial article content supporrt
- Loading branch information
Showing
28 changed files
with
1,422 additions
and
604 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,53 +1,66 @@ | ||
| --- | ||
| // Props for the Box component | ||
| interface Props { | ||
| itemCenter?: boolean; | ||
| title?: string; | ||
| titleColor?: string; | ||
| date?: string; | ||
| dateColor?: string; | ||
| text?: string; | ||
| button?:{ | ||
| textColor?: string; | ||
| button?: { | ||
| text: string; | ||
| link: string; | ||
| color?: string; | ||
| border?: boolean; | ||
| } | ||
| }; | ||
| backgroundColor?: string; | ||
| } | ||
| const { title, date, text, button, backgroundColor = 'bg-white' } = Astro.props; | ||
| const borderProps = button?.border ? 'border-white border' : ''; | ||
| const { | ||
| itemCenter = false, | ||
| title, | ||
| titleColor = "text-white", | ||
| date, | ||
| dateColor = "text-white", | ||
| text, | ||
| textColor = "text-white", | ||
| button, | ||
| backgroundColor = "bg-white", | ||
| } = Astro.props; | ||
| const itemCenterProps = itemCenter ? "items-center" : "items-start"; | ||
| const borderProps = button?.border ? "border-white border" : ""; | ||
| --- | ||
|
|
||
| <!-- <div class={`${backgroundColor} p-4 rounded-xl flex flex-col space-y-2 sm:max-w-xs`}> | ||
| {title && <h2 class="text-xl font-bold text-white">{title}</h2>} | ||
| {date && <p class="text-white">{date}</p>} | ||
| {text && <p class="text-white">{text}</p>} | ||
| <a href={button?.link} class={`${button?.color} ${borderProps} inline-block text-white px-4 py-2 rounded-full content-center`}> | ||
| {button?.text} | ||
| </a> | ||
| </div> --> | ||
|
|
||
| <div class={`${backgroundColor} p-4 rounded-xl flex flex-col space-y-2 sm:max-w-xs`}> | ||
| {title && ( | ||
| <div class="flex flex-col items-start space-y-2"> | ||
| <h2 class="text-xl font-bold text-white">{title}</h2> | ||
| {date && <p class="text-white">{date}</p>} | ||
| {text && <p class="text-white">{text}</p>} | ||
| {button && ( | ||
| <a href={button.link} class={`${button?.color} ${borderProps} inline-block text-white px-4 py-2 rounded-full content-center`}> | ||
| {button.text} | ||
| </a> | ||
| )} | ||
| </div> | ||
| )} | ||
| <div class={`${backgroundColor} p-4 rounded-xl flex flex-col space-y-2 `}> | ||
| { | ||
| title && ( | ||
| <div class={`flex flex-col ${itemCenterProps} space-y-2`}> | ||
| <h2 class={`text-2xl font-bold ${titleColor}`}>{title}</h2> | ||
| {date && <p class={`${dateColor}`}>{date}</p>} | ||
| {text && <p class={`${textColor}`}>{text}</p>} | ||
| {button && ( | ||
| <a | ||
| href={button.link} | ||
| class={`${button?.color} ${borderProps} inline-block text-white px-4 py-2 rounded-full content-center`}> | ||
| {button.text} | ||
| </a> | ||
| )} | ||
| </div> | ||
| ) | ||
| } | ||
|
|
||
| {text && !title && ( | ||
| <div class="flex items-center justify-between w-full"> | ||
| <p class="text-white">{text}</p> | ||
| {button && ( | ||
| <a href={button.link} class={`${button?.color} ${borderProps} inline-block text-white px-4 py-2 rounded-full content-center`}> | ||
| {button.text} | ||
| </a> | ||
| )} | ||
| </div> | ||
| )} | ||
| </div> | ||
| { | ||
| text && !title && ( | ||
| <div class="flex items-center justify-between w-full"> | ||
| <p class={`${textColor}`}>{text}</p> | ||
| {button && ( | ||
| <a | ||
| href={button.link} | ||
| class={`${button?.color} ${borderProps} inline-block text-white px-4 py-2 rounded-full content-center`}> | ||
| {button.text} | ||
| </a> | ||
| )} | ||
| </div> | ||
| ) | ||
| } | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,74 +1,61 @@ | ||
| --- | ||
| import BrandSnapchat from "./icons/BrandSnapchat.astro"; | ||
| import BrandDiscord from "./icons/BrandDiscord.astro"; | ||
| import BrandFacebook from "./icons/BrandFacebook.astro"; | ||
| import BrandTwitter from "./icons/BrandTwitter.astro"; | ||
| import BrandInstagram from "./icons/BrandInstagram.astro"; | ||
| import BrandTwitch from "./icons/BrandTwitch.astro"; | ||
| import BrandYoutube from "./icons/BrandYoutube.astro"; | ||
| --- | ||
|
|
||
| <footer | ||
| class="flex flex-col gap-5 items-center mx-auto sm:flex-col sm:items-start max-w-7xl px-5 py-5 w-full" | ||
| > | ||
| <div class="sm:flex sm:flex-row sm:gap-10"> | ||
| class="flex flex-col gap-5 items-center mx-auto sm:flex-col sm:items-start max-w-7xl px-5 py-5 w-full"> | ||
| <div class="sm:flex gap-10"> | ||
| <div> | ||
|
|
||
| <a href="/" class="flex gap-x-4 items-center"> | ||
| <a href="/" class="flex items-center"> | ||
| <img | ||
| src="/images/tglogo-color.png" | ||
| alt="The Gathering logo" | ||
| width={150} | ||
| class="aspect-thumbnail object-cover sm:w-72" | ||
| src="/images/tglogo-color.png" | ||
| alt="The Gathering logo" | ||
| width={150} | ||
| class="aspect-thumbnail object-cover min-w-full" | ||
| /> | ||
| </a> | ||
| <div class="flex flex-row gap-4 justify-center pt-2"> | ||
| <a href="/" class="flex gap-x-4 items-center"> | ||
| <img | ||
| src="/images/icons/twitter.png" | ||
| alt="The Gathering logo" | ||
| width={24} | ||
| class="aspect-thumbnail object-cover" | ||
| /> | ||
| </a> | ||
| <div class="flex flex-row gap-2 justify-center p-2"> | ||
| <a href="https://www.facebook.com/gatheringorg"> | ||
| <BrandFacebook /> | ||
| </a> | ||
| <a href="https://twitter.com/gatheringorg"> | ||
| <BrandTwitter /> | ||
| </a> | ||
| <a href="https://discord.gg/gathering"> | ||
| <BrandDiscord /> | ||
| </a> | ||
| <a href="https://www.instagram.com/gatheringorg"> | ||
| <BrandInstagram /> | ||
| </a> | ||
| <a href="/" class="flex gap-x-4 items-center"> | ||
| <img | ||
| src="/images/icons/instagram.png" | ||
| alt="The Gathering logo" | ||
| width={24} | ||
| class="aspect-thumbnail object-cover" | ||
| /> | ||
| <a href="https://www.snapchat.com/add/gatheringorg"> | ||
| <BrandSnapchat /> | ||
| </a> | ||
| <a href="/" class="flex gap-x-4 items-center"> | ||
| <img | ||
| src="/images/icons/facebook.png" | ||
| alt="The Gathering logo" | ||
| width={24} | ||
| class="aspect-thumbnail object-cover" | ||
| /> | ||
| <a href="https://www.twitch.tv/team/thegathering"> | ||
| <BrandTwitch /> | ||
| </a> | ||
| <a href="/" class="flex gap-x-4 items-center"> | ||
| <img | ||
| src="/images/icons/discord.png" | ||
| alt="The Gathering logo" | ||
| width={24} | ||
| class="aspect-thumbnail object-cover" | ||
| /> | ||
| <a href="https://www.youtube.com/@gatheringorg"> | ||
| <BrandYoutube /> | ||
| </a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div class="sm:flex sm:gap-10"> | ||
| <ul class="text-white flex flex-col gap-2 items-center sm:items-start"> | ||
| <li><a href="#" class="">Tickets</a></li> | ||
| <li><a href="#" class="">Schedule</a></li> | ||
| <li><a href="#" class="">Competitions</a></li> | ||
| <li><a href="/news" class="">News</a></li> | ||
| <li><a href="/faq" class="">FAQ</a></li> | ||
| <li><a href="/about" class="">About the Gathering</a></li> | ||
| </ul> | ||
| <ul class="text-white size flex flex-col gap-2 items-center sm:items-start"> | ||
| <div class="sm:flex sm:gap-10"> | ||
| <ul | ||
| class="text-white size flex flex-col gap-2 items-center sm:items-start"> | ||
| <li><a href="https://archive.gathering.org/" class="">Archives</a></li> | ||
| <li><a href="https://tech.gathering.org/" class="">Tech Blog</a></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| <div class="flex justify-center w-full"> | ||
| <ul | ||
| class="text-white text-sm flex flex-col sm:flex-row gap-2 items-center sm:items-start"> | ||
| <li>The Gathering 2025 - <a href="https://www.kandu.no/">KANDU</a></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| <div class="flex justify-center w-full"> | ||
| <ul class="text-white text-sm flex flex-col sm:flex-row gap-2 items-center sm:items-start"> | ||
| <li><a href="#" class="">Statement of Availability</a></li> | ||
| <li><a href="#" class="">Admin - Info:Redaksjonen - info[at]tg[dot]no</a></li> | ||
| <li><a href="#" class="">Adjust cookie and data settings</a></li> | ||
| <li>The Gathering 2025 - <a href="https://www.kandu.no/">KANDU</a></li> | ||
| </ul> | ||
| </div> | ||
| </footer> | ||
| </div> | ||
| </footer> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,8 +1,9 @@ | ||
| --- | ||
| type Props = { | ||
| text: string; | ||
| text: string; | ||
| color?: string; | ||
| }; | ||
| const { text } = Astro.props; | ||
| const { text, color = "text-white" } = Astro.props; | ||
| --- | ||
|
|
||
| <h1 class="text-6xl text-white font-bold mb-2">{text}</h1> | ||
| <h1 class=`text-6xl ${color} font-bold mb-2`>{text}</h1> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,8 +1,9 @@ | ||
| --- | ||
| type Props = { | ||
| text: string; | ||
| text: string; | ||
| color?: string; | ||
| }; | ||
| const { text } = Astro.props; | ||
| const { text, color = "text-white" } = Astro.props; | ||
| --- | ||
|
|
||
| <h2 class="text-4xl text-white font-bold mb-2">{text}</h2> | ||
| <h2 class=`text-4xl ${color} font-bold mb-2`>{text}</h2> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.