gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-20 07:08:55 +02:00
Code Issues Actions 19 Packages Projects Releases Wiki Activity

chore(website): improve hero section layout on mobile

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

28
apps/website/src/pages/Home/index.css
View File

@ -1,6 +1,6 @@
section.hero-section {
position: relative;
background: linear-gradient(135deg, var(--light-bg-start), var(--light-bg-end));
background: linear-gradient(135deg, var(--light-bg-start), var(--light-bg-end));
}
section.hero-section.dark {
@ -55,9 +55,9 @@ section.hero-section::before {
section.hero-section > .content-wrapper {
display: flex;
padding: 3em;
align-items: center;
justify-content: center;
flex-direction: column;
min-height: 60vh;
}
@ -74,9 +74,10 @@ section.hero-section .title-section h1 {
section.hero-section .image,
section.hero-section .image img {
position: relative;
width: 100%;
height: auto;
position: relative;
margin-bottom: 0;
}
section.hero-section .download-wrapper {
@ -95,6 +96,27 @@ section.hero-section .more-download-options {
text-align: center;
}
@media (max-width: 719px) {
section.hero-section {
padding-bottom: 0;
}
section.hero-section .content-wrapper {
width: 100%;
}
section.hero-section .title-section {
max-width: 90%;
}
}
@media (min-width: 720px) {
section.hero-section > .content-wrapper {
flex-direction: row;
padding: 3em;
}
}
section:nth-of-type(2n+1) {
background: linear-gradient(135deg, rgba(228, 123, 25, 0.08), rgba(79, 165, 43, 0.08));
}