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: make landing diagrams readable

Browse source
This commit is contained in:
Marco Allegretti 2026-02-02 13:02:29 +01:00
parent dfa8c88c3d
commit c884e9da52
1 changed files with 43 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

46
frontend/src/pages/index.astro
View file

@ -730,10 +730,14 @@ import PublicLayout from '../layouts/PublicLayout.astro';
line-height: 1.6; line-height: 1.6;
} }
.section-how .section-container {
max-width: 1240px;
}
.diagram-grid { .diagram-grid {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); grid-template-columns: 1fr;
gap: 2rem; gap: 1.5rem;
} }
@media (max-width: 900px) { @media (max-width: 900px) {
@ -742,6 +746,29 @@ import PublicLayout from '../layouts/PublicLayout.astro';
} }
} }
.diagram-card {
display: grid;
grid-template-columns: minmax(280px, 1fr) minmax(0, 2fr);
grid-template-areas:
"head diagram"
"foot diagram";
column-gap: 2rem;
row-gap: 0.75rem;
align-items: start;
}
@media (max-width: 900px) {
.diagram-card {
grid-template-columns: 1fr;
grid-template-areas:
"head"
"diagram"
"foot";
column-gap: 0;
row-gap: 0;
}
}
.diagram-header h4 { .diagram-header h4 {
font-size: 1.125rem; font-size: 1.125rem;
margin: 0 0 0.5rem; margin: 0 0 0.5rem;
@ -754,19 +781,32 @@ import PublicLayout from '../layouts/PublicLayout.astro';
line-height: 1.5; line-height: 1.5;
} }
.diagram-header {
grid-area: head;
}
.diagram { .diagram {
grid-area: diagram;
width: 100%; width: 100%;
height: auto; height: auto;
margin-top: 1.25rem; margin-top: 0;
min-width: 0;
} }
.diagram-footer { .diagram-footer {
grid-area: foot;
margin-top: 1.25rem; margin-top: 1.25rem;
color: var(--color-text-muted); color: var(--color-text-muted);
font-size: 0.875rem; font-size: 0.875rem;
line-height: 1.5; line-height: 1.5;
} }
@media (min-width: 901px) {
.diagram-footer {
margin-top: 0.25rem;
}
}
.diagram-link { .diagram-link {
font-weight: 500; font-weight: 500;
} }