Center sign-in card content while keeping text left-aligned

The card's content (title, intro, form) hugged the left edge instead of
sitting centered within the wider card. Make .auth-card a centered
flex column so each element centers as a block, while individual
elements keep their own text-align: left. The eyebrow label stays
pinned to the left edge via align-self. The title's two-line layout is
unaffected.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
odweta
2026-09-10 18:17:46 +02:00
co-authored by Copilot App
parent 2cae35bd05
commit 26827904db
+4
View File
@@ -33,6 +33,9 @@ body {
}
.auth-card {
display: flex;
flex-direction: column;
align-items: center;
width: min(100%, 760px);
padding: clamp(1.75rem, 4vw, 3.25rem) clamp(1.75rem, 6vw, 4.5rem);
background: var(--paper);
@@ -42,6 +45,7 @@ body {
}
.eyebrow {
align-self: flex-start;
margin: 0 0 0.75rem;
color: var(--blue);
font-size: 0.75rem;