MrDiderot/mischlabs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix SSO banner: force horizontal layout with smaller elements

Browse Source 
Use higher specificity selectors to override base card styles.
Smaller icon, font sizes, and tighter padding for compact banner.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Kroonk
2026-04-13 21:46:47 +02:00
parent 6d9dca95f0
commit 9254e9d631
2 changed files with 25 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MischLabs - Services</title> <title>MischLabs - Services</title>
<link rel="stylesheet" href="style.css?v=2"> <link rel="stylesheet" href="style.css?v=3">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">

29
style.css
View File

@@ -127,20 +127,39 @@ main {
} }
/* ===== Banner Card (Auth) ===== */ /* ===== Banner Card (Auth) ===== */
.card-banner { .card.card-banner {
flex-direction: row; flex-direction: row !important;
align-items: center; align-items: center;
gap: 1rem; gap: 1rem;
padding: 0.5rem 1.5rem; padding: 0.75rem 1.5rem;
margin-bottom: 1.25rem; margin-bottom: 1.25rem;
animation: fadeInUp 0.5s ease backwards; animation: fadeInUp 0.5s ease backwards;
} }
.card-banner .card-content { .card.card-banner .card-icon {
width: 36px;
height: 36px;
border-radius: 8px;
}
.card.card-banner .card-icon svg {
width: 18px;
height: 18px;
}
.card.card-banner .card-content {
flex: 1; flex: 1;
} }
.card-banner .card-domain { .card.card-banner .card-content h2 {
font-size: 0.95rem;
}
.card.card-banner .card-content p {
font-size: 0.75rem;
}
.card.card-banner .card-domain {
border-top: none; border-top: none;
padding-top: 0; padding-top: 0;
border-left: 1px solid var(--border); border-left: 1px solid var(--border);