feat(website): more options link in the hero section

This commit is contained in:
Elian Doran 2025-09-27 00:08:35 +03:00
parent ec8d719d41
commit 7c30bc9c72
No known key found for this signature in database
2 changed files with 23 additions and 1 deletions

View File

@ -63,11 +63,13 @@ section.hero-section > .content-wrapper {
section.hero-section .title-section {
flex-basis: 40%;
color: var(--muted-color);
}
section.hero-section .title-section h1 {
line-height: 1.1;
font-weight: 100;
color: var(--foreground-color);
}
section.hero-section .image,
@ -77,6 +79,22 @@ section.hero-section .image img {
position: relative;
}
section.hero-section .download-wrapper {
display: inline-flex;
flex-direction: column;
}
section.hero-section .download-button {
margin-bottom: 0.25em;
}
section.hero-section .more-download-options {
display: inline-block;
color: var(--brand-1);
font-size: 0.8em;
text-align: center;
}
section:nth-of-type(2n+1) {
background: linear-gradient(135deg, rgba(228, 123, 25, 0.08), rgba(79, 165, 43, 0.08));
}

View File

@ -22,7 +22,11 @@ function HeroSection() {
<div class="title-section">
<h1>Organize your thoughts. Build your personal knowledge base.</h1>
<p>Trilium is an open-source solution for note-taking and organizing a personal knowledge base. Use it locally on your desktop, or sync it with your self-hosted server to keep your notes everywhere you go.</p>
<DownloadButton big />
<div className="download-wrapper">
<DownloadButton big />
<a class="more-download-options" href="./download">more options</a>
</div>
</div>
<figure class="image"><img src="./src/assets/screenshot_desktop_win.png" /></figure>