Leahnaya/sendou.ink
1
0
Fork 0
mirror of https://github.com/Sendouc/sendou.ink.git synced 2026-04-04 16:55:03 -05:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Add temp top banner to advertise season finale

Browse Source
This commit is contained in:
Kalle 2023-12-02 15:38:45 +02:00
parent ea0424c26c
commit 4e63eb0022
2 changed files with 40 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
app/features/front-page/routes/index.tsx
View File

@ -53,6 +53,7 @@ export default function FrontPage() {
Log-in is temporarily disabled due to problems with the Discord API
</div>
)}
<TopBanner />
<div className="front__nav-items-container">
<div className="front__nav-item round">
<LanguageChanger plain>
@ -112,6 +113,29 @@ export default function FrontPage() {
);
}
// TODO: make into a dynamic feature
function TopBanner() {
const eventInThePast = new Date() > new Date("2023-12-03T22:00:00Z");
if (eventInThePast) return null;
return (
<div className="front__top-banner">
SendouQ Season 1 Finale tournament featuring Jackpot, FTWin, Starburst,
Alliance Rogue and more top level teams! Catch the action{" "}
<a
href="https://www.twitch.tv/iplsplatoon"
className="front__top-banner__link"
target="_blank"
rel="noopener noreferrer"
>
via IPL
</a>{" "}
on Sunday 3rd @ 10AM PST / 1PM EST / 6PM GMT
</div>
);
}
function LogInButton() {
const data = useRootLoaderData();
const { t } = useTranslation(["common"]);

16
app/styles/front.css
View File

@ -1,3 +1,19 @@
.front__top-banner {
border-radius: var(--rounded);
background: linear-gradient(to right, #4568dc, #b06ab3);
font-weight: var(--bold);
color: var(--button-text);
font-size: var(--fonts-sm);
padding-block: var(--s-1);
padding-inline: var(--s-2);
text-align: center;
}
.front__top-banner__link {
color: var(--button-text);
text-decoration: underline;
}
.front__nav-items-container {
display: flex;
margin: 0 auto;