floscr/clj-ui-framework
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(card): reduce internal spacing and bump footer button size

Browse Source 
Refactor card to use flex column with gap-based spacing instead of
per-section padding, tightening the space between header, body, and
footer from size-6 to size-3. Add .card-footer .btn override to
render buttons at font-base size.
This commit is contained in:
Florian Schroedl
2026-03-03 17:08:29 +01:00
parent e4ee7b750e
commit 0dd8a9c8bf
4 changed files with 69 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/ui/card.css
View File

@@ -1,18 +1,20 @@
.card {
display: flex;
flex-direction: column;
gap: var(--size-3);
background: var(--bg-1);
color: var(--fg-0);
border: var(--border-0);
border-radius: var(--radius-md);
box-shadow: var(--shadow-0);
overflow: hidden;
padding: var(--size-6);
}
.card-header {
display: flex;
flex-direction: column;
gap: var(--size-1);
padding: var(--size-6);
padding-bottom: 0;
}
.card-header h1,
@@ -31,13 +33,16 @@
}
.card-body {
padding: var(--size-6);
}
.card-footer {
display: flex;
justify-content: flex-end;
gap: var(--size-2);
padding: var(--size-6);
padding-top: 0;
}
.card-footer .btn {
padding: var(--size-2) var(--size-4);
font-size: var(--font-base);
line-height: var(--size-5);
}