feat(website/i18n): footer navigation

This commit is contained in:
Elian Doran 2025-10-25 18:18:47 +03:00
parent 30480b2c23
commit f4796f0f9e
No known key found for this signature in database
4 changed files with 26 additions and 20 deletions

View File

@ -5,17 +5,25 @@ footer {
color: var(--muted-color); color: var(--muted-color);
font-size: 0.8em; font-size: 0.8em;
.content-wrapper { .row {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
flex-direction: column-reverse; flex-direction: column-reverse;
gap: 2em; gap: 2em;
margin-bottom: 1em;
@media (min-width: 720px) { @media (min-width: 720px) {
flex-direction: row; flex-direction: row;
} }
} }
nav.languages {
flex-grow: 1;
justify-content: center;
display: flex;
gap: 1em;
}
} }
.social-buttons { .social-buttons {

View File

@ -5,18 +5,28 @@ import githubDiscussionsIcon from "../assets/boxicons/bx-discussion.svg?raw";
import matrixIcon from "../assets/boxicons/bx-message-dots.svg?raw"; import matrixIcon from "../assets/boxicons/bx-message-dots.svg?raw";
import redditIcon from "../assets/boxicons/bx-reddit.svg?raw"; import redditIcon from "../assets/boxicons/bx-reddit.svg?raw";
import { Link } from "./Button.js"; import { Link } from "./Button.js";
import { t } from "../i18n"; import { LOCALES, t } from "../i18n";
export default function Footer() { export default function Footer() {
return ( return (
<footer> <footer>
<div class="content-wrapper"> <div class="content-wrapper">
<div class="footer-text"> <div class="row">
© 2024-2025 <Link href="https://github.com/eliandoran" openExternally>Elian Doran</Link>{t("footer.copyright_and_the")}<Link href="https://github.com/TriliumNext/Trilium/graphs/contributors" openExternally>{t("footer.copyright_community")}</Link>.<br /> <div class="footer-text">
© 2017-2024 <Link href="https://github.com/zadam" openExternally>zadam</Link>. © 2024-2025 <Link href="https://github.com/eliandoran" openExternally>Elian Doran</Link>{t("footer.copyright_and_the")}<Link href="https://github.com/TriliumNext/Trilium/graphs/contributors" openExternally>{t("footer.copyright_community")}</Link>.<br />
© 2017-2024 <Link href="https://github.com/zadam" openExternally>zadam</Link>.
</div>
<SocialButtons />
</div> </div>
<SocialButtons /> <div class="row">
<nav class="languages">
{LOCALES.map(locale => (
<Link href={"/" + locale.id + "/"}>{locale.name}</Link>
))}
</nav>
</div>
</div> </div>
</footer> </footer>
) )

View File

@ -17,7 +17,7 @@ export const LOCALES: Locale[] = [
{ id: "pl", name: "Polski" }, { id: "pl", name: "Polski" },
{ id: "es", name: "Español" }, { id: "es", name: "Español" },
{ id: "ar", name: "اَلْعَرَبِيَّةُ", rtl: true }, { id: "ar", name: "اَلْعَرَبِيَّةُ", rtl: true },
]; ].toSorted((a, b) => a.name.localeCompare(b.name));
i18next i18next
.use(HttpApi) .use(HttpApi)

View File

@ -7,7 +7,6 @@ import { NotFound } from './pages/_404.jsx';
import Footer from './components/Footer.js'; import Footer from './components/Footer.js';
import GetStarted from './pages/GetStarted/get-started.js'; import GetStarted from './pages/GetStarted/get-started.js';
import SupportUs from './pages/SupportUs/SupportUs.js'; import SupportUs from './pages/SupportUs/SupportUs.js';
import { LOCALES } from './i18n';
export function App(props: {repoStargazersCount: number}) { export function App(props: {repoStargazersCount: number}) {
return ( return (
@ -36,17 +35,6 @@ export async function prerender(data) {
// This ensures the GitHub API is not called on every page load in the client. // This ensures the GitHub API is not called on every page load in the client.
const stargazersCount = await getRepoStargazersCount(); const stargazersCount = await getRepoStargazersCount();
const result = await ssr(<App repoStargazersCount={stargazersCount} {...data} />); return await ssr(<App repoStargazersCount={stargazersCount} {...data} />);
console.log("Got links ", result.links);
const links: string[] = [];
for (const locale of LOCALES) {
for (const link of result.links?.values() ?? []) {
links.push(locale.id + link);
}
}
return {
...result,
links
};
} }