diff --git a/apps/website2/src/components/Header.css b/apps/website2/src/components/Header.css index 980b2b4af..910248ebc 100644 --- a/apps/website2/src/components/Header.css +++ b/apps/website2/src/components/Header.css @@ -4,15 +4,16 @@ header { top: 0; background: var(--header-background-color); box-shadow: 0 0 6px rgba(0, 0, 0, 0.3); - backdrop-filter: blur(20px); + backdrop-filter: blur(20px); z-index: 1000; + --gap: 1.25em; } header .content-wrapper { display: flex; align-items: center; justify-items: center; - gap: 1em; + gap: var(--gap); } header a.banner { @@ -41,11 +42,12 @@ header nav { flex-grow: 1; display: flex; justify-content: flex-end; - gap: 1em; + gap: var(--gap); } header nav a { text-decoration: none; + color: inherit; } header nav a.active { diff --git a/apps/website2/src/components/Header.tsx b/apps/website2/src/components/Header.tsx index 8793f0eed..0a4009d29 100644 --- a/apps/website2/src/components/Header.tsx +++ b/apps/website2/src/components/Header.tsx @@ -9,7 +9,8 @@ interface HeaderLink { } const HEADER_LINKS: HeaderLink[] = [ - { url: "https://docs.triliumnotes.org/", text: "Documentation", external: true } + { url: "https://docs.triliumnotes.org/", text: "Documentation", external: true }, + { url: "/donate", text: "Support us" } ] export function Header() { diff --git a/apps/website2/src/index.tsx b/apps/website2/src/index.tsx index 1c8c127e2..d7cfa5bf6 100644 --- a/apps/website2/src/index.tsx +++ b/apps/website2/src/index.tsx @@ -6,6 +6,7 @@ import { NotFound } from './pages/_404.jsx'; import './style.css'; import Footer from './components/Footer.js'; import Download from './pages/Download/download.js'; +import Donate from './pages/Donate/Donate.js'; export function App() { return ( @@ -16,6 +17,7 @@ export function App() { +