marcoallegretti/likwid
1
0
Fork 0
mirror of https://codeberg.org/likwid/likwid.git synced 2026-02-09 21:13:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

ui: improve demo page mobile spacing

Browse source
This commit is contained in:
Marco Allegretti 2026-02-04 01:01:19 +01:00
parent fa65505eec
commit e517f1d331
1 changed files with 66 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

66
frontend/src/pages/demo.astro
View file

@ -261,12 +261,24 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
padding: 0 2rem; padding: 0 2rem;
} }
@media (max-width: 640px) {
.demo-page {
padding: 0 1rem;
}
}
.page-header { .page-header {
text-align: center; text-align: center;
padding: 3rem 0 3.5rem; padding: 3rem 0 3.5rem;
border-bottom: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border);
} }
@media (max-width: 640px) {
.page-header {
padding: 2.25rem 0 2.5rem;
}
}
.page-label { .page-label {
display: inline-block; display: inline-block;
font-size: 0.6875rem; font-size: 0.6875rem;
@ -287,6 +299,12 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
letter-spacing: -0.02em; letter-spacing: -0.02em;
} }
@media (max-width: 640px) {
.page-header h1 {
font-size: 1.85rem;
}
}
.lead { .lead {
font-size: 1.25rem; font-size: 1.25rem;
color: var(--color-text-muted); color: var(--color-text-muted);
@ -295,11 +313,23 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
line-height: 1.6; line-height: 1.6;
} }
@media (max-width: 640px) {
.lead {
font-size: 1.05rem;
}
}
.demo-start { .demo-start {
padding: 3rem 0; padding: 3rem 0;
border-bottom: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border);
} }
@media (max-width: 640px) {
.demo-start {
padding: 2.25rem 0;
}
}
.demo-start h2 { .demo-start h2 {
font-size: 1.75rem; font-size: 1.75rem;
text-align: center; text-align: center;
@ -355,6 +385,12 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
border-bottom: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border);
} }
@media (max-width: 640px) {
.demo-intro {
padding: 2.25rem 0;
}
}
.intro-content h2 { .intro-content h2 {
font-size: 1.75rem; font-size: 1.75rem;
margin-bottom: 1rem; margin-bottom: 1rem;
@ -392,6 +428,12 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
border-bottom: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border);
} }
@media (max-width: 640px) {
.demo-communities {
padding: 2.25rem 0;
}
}
.demo-communities h2 { .demo-communities h2 {
font-size: 1.75rem; font-size: 1.75rem;
text-align: center; text-align: center;
@ -472,6 +514,12 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
border-bottom: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border);
} }
@media (max-width: 640px) {
.demo-access {
padding: 2.25rem 0;
}
}
.demo-access h2 { .demo-access h2 {
font-size: 1.75rem; font-size: 1.75rem;
text-align: center; text-align: center;
@ -607,6 +655,12 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
border-bottom: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border);
} }
@media (max-width: 640px) {
.demo-journey {
padding: 2.25rem 0;
}
}
.demo-journey h2 { .demo-journey h2 {
font-size: 1.75rem; font-size: 1.75rem;
text-align: center; text-align: center;
@ -658,6 +712,12 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
border-bottom: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border);
} }
@media (max-width: 640px) {
.demo-cta {
padding: 3rem 0;
}
}
.demo-cta h2 { .demo-cta h2 {
font-size: 2rem; font-size: 2rem;
margin-bottom: 1rem; margin-bottom: 1rem;
@ -680,6 +740,12 @@ const nextQuery = nextParam ? `&next=${encodeURIComponent(nextParam)}` : '';
padding: 3rem 0; padding: 3rem 0;
} }
@media (max-width: 640px) {
.demo-next {
padding: 2.25rem 0;
}
}
.demo-next h2 { .demo-next h2 {
font-size: 1.75rem; font-size: 1.75rem;
text-align: center; text-align: center;