gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-21 23:59:02 +02:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

chore(website): further improve layout on mobile

Browse Source
This commit is contained in:
Elian Doran 2025-09-27 11:54:00 +03:00
parent 3ce9c7ba3d
commit 8117586548
No known key found for this signature in database
3 changed files with 32 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
apps/website/src/pages/Donate/Donate.css
View File

@ -5,8 +5,16 @@ section.donate {
section.donate ul { section.donate ul {
list-style-type: none; list-style-type: none;
display: flex; display: flex;
gap: 0 1em; gap: 1em;
padding: 0; padding: 0;
flex-direction: column;
}
@media (min-width: 720px) {
section.donate ul {
gap: 0 1em;
flex-direction: row;
}
} }
section.donate ul a { section.donate ul a {

12
apps/website/src/pages/Download/download.css
View File

@ -36,11 +36,6 @@
.download-server .download-card:first-of-type { --accent-color: var(--brand-1); } .download-server .download-card:first-of-type { --accent-color: var(--brand-1); }
.download-server .download-card:last-of-type { --accent-color: var(--brand-3); } .download-server .download-card:last-of-type { --accent-color: var(--brand-3); }
.download-server {
width: 75%;
margin: auto;
}
.architecture-switch { .architecture-switch {
display: flex; display: flex;
gap: 1em; gap: 1em;
@ -68,3 +63,10 @@
background-color: var(--brand-1); background-color: var(--brand-1);
color: var(--brand-foreground-color); color: var(--brand-foreground-color);
} }
@media (min-width: 720px) {
.download-server {
width: 75%;
margin: auto;
}
}

21
apps/website/src/style.css
View File

@ -31,7 +31,7 @@ body {
} }
main { main {
min-height: calc(100vh - 80px); min-height: calc(100vh - 80px - 90px);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
@ -53,18 +53,21 @@ a {
} }
section { section {
padding: 3em 0; padding: 1em 0;
flex-grow: 1;
display: flex;
justify-content: center; justify-content: center;
align-items: stretch; align-items: stretch;
} }
section.fill {
flex-grow: 1;
display: flex;
}
section h2 { section h2 {
text-align: center; text-align: center;
font-weight: 100; font-weight: 100;
margin-top: 0; margin-top: 0;
margin-bottom: 2em; margin-bottom: 1em;
} }
img { img {
@ -107,6 +110,14 @@ img {
} }
@media (min-width: 720px) { @media (min-width: 720px) {
section {
padding: 3em 0;
}
section h2 {
margin-bottom: 2em;
}
.grid-3-cols { .grid-3-cols {
display: grid; display: grid;
grid-template-columns: 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr;