improvement(welcome): prominent open-source callout in the page body

Add an accent-tinted 'Free and open source' band between the app preview and the feature grid
— a short line about reading the code / self-hosting / filing an issue, linking to the public
repo. The compact footer link stays. Trilingual.
This commit is contained in:
npeter83 2026-07-02 02:14:27 +02:00
parent d560825685
commit df09b49c0c
4 changed files with 39 additions and 0 deletions

View file

@ -1,6 +1,7 @@
import { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import {
ArrowRight,
Code2,
Expand,
Filter,
@ -64,6 +65,29 @@ export default function Welcome() {
onOpen={open}
/>
{/* Open source Siftlode's code is public; nudge visitors to read it or self-host. The
footer keeps a compact link too. */}
<a
href={REPO_URL}
target="_blank"
rel="noopener noreferrer"
className="group mt-8 flex flex-col items-center gap-x-4 gap-y-2 rounded-2xl border border-accent/25 bg-accent/[0.06] px-5 py-4 text-center sm:flex-row sm:text-left hover:border-accent/50 transition"
>
<span className="grid place-items-center w-10 h-10 rounded-xl bg-accent/15 text-accent shrink-0">
<Code2 className="w-5 h-5" />
</span>
<span className="flex-1">
<span className="block font-semibold">{t("welcome.openSource.title")}</span>
<span className="block text-sm text-muted leading-relaxed">
{t("welcome.openSource.body")}
</span>
</span>
<span className="inline-flex items-center gap-1 text-sm font-medium text-accent whitespace-nowrap">
{t("welcome.openSource.link")}
<ArrowRight className="w-4 h-4 transition group-hover:translate-x-0.5" />
</span>
</a>
{/* Features */}
<section className="mt-14">
<h2 className="text-2xl font-semibold text-center">{t("welcome.features.heading")}</h2>