feat(discovery): more work on discovery plus a few fixes

This commit is contained in:
Hampus Kraft
2026-02-17 15:41:08 +00:00
parent b19e9fb243
commit 302c0d2a0c
137 changed files with 7116 additions and 2047 deletions

View File

@@ -20,11 +20,12 @@
/** @jsxRuntime automatic */
/** @jsxImportSource hono/jsx */
import {Locales} from '@fluxer/constants/src/Locales';
import {FlagSvg} from '@fluxer/marketing/src/components/Flags';
import {HackernewsBanner} from '@fluxer/marketing/src/components/HackernewsBanner';
import {MadeInSwedenBadge} from '@fluxer/marketing/src/components/MadeInSwedenBadge';
import {ArrowRightIcon} from '@fluxer/marketing/src/components/icons/ArrowRightIcon';
import {renderSecondaryButton, renderWithOverlay} from '@fluxer/marketing/src/components/PlatformDownloadButton';
import type {MarketingContext} from '@fluxer/marketing/src/MarketingContext';
import {href} from '@fluxer/marketing/src/UrlUtils';
interface HeroProps {
ctx: MarketingContext;
@@ -41,13 +42,35 @@ export function Hero(props: HeroProps): JSX.Element {
<span class="font-bold text-3xl text-white">Fluxer</span>
</div>
) : null}
<div class="flex flex-wrap justify-center gap-3 pb-2">
<span class="rounded-full bg-white px-4 py-1.5 font-medium text-[#4641D9] text-sm">
{ctx.i18n.getMessage('beta_and_access.public_beta', ctx.locale)}
</span>
<MadeInSwedenBadge ctx={ctx} />
<div class="flex flex-wrap items-center justify-center gap-3 pb-2">
<a
href="https://blog.fluxer.app/how-i-built-fluxer-a-discord-like-chat-app/"
target="_blank"
rel="noopener noreferrer"
class="inline-flex items-center gap-1.5 rounded-full bg-white/10 px-4 py-1.5 font-medium text-sm text-white transition-colors hover:bg-white/20"
>
{ctx.i18n.getMessage('launch.heading', ctx.locale)}
<ArrowRightIcon class="h-3.5 w-3.5" />
</a>
<a
href="https://blog.fluxer.app/roadmap-2026"
target="_blank"
rel="noopener noreferrer"
class="inline-flex items-center gap-1.5 rounded-full bg-white/10 px-4 py-1.5 font-medium text-sm text-white transition-colors hover:bg-white/20"
>
{ctx.i18n.getMessage('launch.view_full_roadmap', ctx.locale)}
<ArrowRightIcon class="h-3.5 w-3.5" />
</a>
</div>
<h1 class="hero">{ctx.i18n.getMessage('general.tagline', ctx.locale)}</h1>
<div class="-mt-4 flex items-center justify-center gap-2 font-medium text-sm text-white/80">
<span>{ctx.i18n.getMessage('beta_and_access.public_beta', ctx.locale)}</span>
<span class="text-white/40">·</span>
<span class="inline-flex items-center gap-1.5">
<FlagSvg locale={Locales.SV_SE} ctx={ctx} class="h-3.5 w-3.5 rounded-sm" />
{ctx.i18n.getMessage('general.made_in_sweden', ctx.locale)}
</span>
</div>
<p class="lead mx-auto max-w-2xl text-white/90">
{ctx.i18n.getMessage('product_positioning.intro', ctx.locale)}
</p>
@@ -105,32 +128,6 @@ export function Hero(props: HeroProps): JSX.Element {
</picture>
</div>
</div>
<div class="mt-10 flex flex-wrap items-center justify-center gap-4 md:mt-12">
<a
href="https://www.producthunt.com/products/fluxer?embed=true&utm_source=badge-featured&utm_medium=badge&utm_campaign=badge-fluxer"
target="_blank"
rel="noopener noreferrer"
>
<img
alt="Fluxer - Open-source Discord-like instant messaging & VoIP platform | Product Hunt"
width="250"
height="54"
src={href(ctx, '/api/badges/product-hunt')}
/>
</a>
<a
href="https://www.producthunt.com/products/fluxer?embed=true&utm_source=badge-top-post-badge&utm_medium=badge&utm_campaign=badge-fluxer"
target="_blank"
rel="noopener noreferrer"
>
<img
alt={ctx.i18n.getMessage('misc_labels.product_hunt_badge_title', ctx.locale)}
width="250"
height="54"
src={href(ctx, '/api/badges/product-hunt-top-post')}
/>
</a>
</div>
</main>
);
}

View File

@@ -1,67 +0,0 @@
/*
* Copyright (C) 2026 Fluxer Contributors
*
* This file is part of Fluxer.
*
* Fluxer is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* Fluxer is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with Fluxer. If not, see <https://www.gnu.org/licenses/>.
*/
/** @jsxRuntime automatic */
/** @jsxImportSource hono/jsx */
import {ArrowRightIcon} from '@fluxer/marketing/src/components/icons/ArrowRightIcon';
import {MarketingButton, MarketingButtonSecondary} from '@fluxer/marketing/src/components/MarketingButton';
import {Section} from '@fluxer/marketing/src/components/Section';
import type {MarketingContext} from '@fluxer/marketing/src/MarketingContext';
interface LaunchBlogSectionProps {
ctx: MarketingContext;
}
export function LaunchBlogSection(props: LaunchBlogSectionProps): JSX.Element {
const {ctx} = props;
return (
<Section
variant="light"
title={ctx.i18n.getMessage('launch.heading', ctx.locale)}
description={ctx.i18n.getMessage('launch.description', ctx.locale)}
>
<div class="mx-auto max-w-4xl">
<div class="flex flex-col items-center justify-center gap-4 sm:flex-row sm:items-stretch">
<MarketingButton
href="https://blog.fluxer.app/how-i-built-fluxer-a-discord-like-chat-app/"
size="large"
target="_blank"
rel="noopener noreferrer"
class="inline-flex items-center gap-2 md:text-xl"
>
{ctx.i18n.getMessage('launch.read_more', ctx.locale)}
<ArrowRightIcon class="h-5 w-5 md:h-6 md:w-6" />
</MarketingButton>
<MarketingButtonSecondary
href="https://blog.fluxer.app/roadmap-2026"
size="large"
target="_blank"
rel="noopener noreferrer"
class="md:text-xl"
>
{ctx.i18n.getMessage('launch.view_full_roadmap', ctx.locale)}
<ArrowRightIcon class="h-5 w-5 md:h-6 md:w-6" />
</MarketingButtonSecondary>
</div>
</div>
</Section>
);
}

View File

@@ -1,40 +0,0 @@
/*
* Copyright (C) 2026 Fluxer Contributors
*
* This file is part of Fluxer.
*
* Fluxer is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* Fluxer is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with Fluxer. If not, see <https://www.gnu.org/licenses/>.
*/
/** @jsxRuntime automatic */
/** @jsxImportSource hono/jsx */
import {Locales} from '@fluxer/constants/src/Locales';
import {FlagSvg} from '@fluxer/marketing/src/components/Flags';
import type {MarketingContext} from '@fluxer/marketing/src/MarketingContext';
interface MadeInSwedenBadgeProps {
ctx: MarketingContext;
}
export function MadeInSwedenBadge(props: MadeInSwedenBadgeProps): JSX.Element {
const {ctx} = props;
return (
<span class="inline-flex items-center gap-2 rounded-full bg-white px-4 py-1.5 font-medium text-[#4641D9] text-sm">
<FlagSvg locale={Locales.SV_SE} ctx={ctx} class="h-4 w-4 rounded-sm" />
<span>{ctx.i18n.getMessage('general.made_in_sweden', ctx.locale)}</span>
</span>
);
}