Palettes variees, logo stamp croque, search/date modernises

- Palettes : Chagrine bleu lavande + ambre + rose ancien (moins aquatique),
  Grave ocre rouge + ardoise (plus lumineux), Zen vert franc + sienne + canard
  (pas de pastels glauques), Peps secondary indigo
- Logo : icone dans stamp carre rotate(-10deg), separe du texte, hover -16deg
- Login : logo stamp rotate -10deg, subtitle epure
- Search : UInput/USelect remplaces par champs custom accent-soft + icone
- Dates : icone clock + opacity 0.7
- Badges : UBadge remplace par pills custom uppercase accent

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Yvv
2026-03-01 03:27:11 +01:00
parent c7cb22f313
commit 8dc0dfd452
7 changed files with 452 additions and 182 deletions

View File

@@ -90,8 +90,12 @@ function isActive(to: string) {
<UIcon name="i-lucide-menu" class="text-xl" />
</button>
<NuxtLink to="/" class="app-header__logo">
<UIcon name="i-lucide-gavel" class="app-header__logo-icon" />
<span class="app-header__logo-g">ğ</span><span class="app-header__logo-paren">(</span><span class="app-header__logo-word">Decision</span><span class="app-header__logo-paren">)</span>
<span class="app-header__logo-stamp">
<UIcon name="i-lucide-gavel" class="app-header__logo-icon" />
</span>
<span class="app-header__logo-text">
<span class="app-header__logo-g">ğ</span><span class="app-header__logo-paren">(</span><span class="app-header__logo-word">Decision</span><span class="app-header__logo-paren">)</span>
</span>
</NuxtLink>
</div>
@@ -266,15 +270,38 @@ function isActive(to: string) {
text-decoration: none;
display: flex;
align-items: center;
gap: 0.5rem;
gap: 0.75rem;
}
.app-header__logo-stamp {
display: flex;
align-items: center;
justify-content: center;
width: 2rem;
height: 2rem;
background: var(--mood-accent);
color: var(--mood-accent-text);
border-radius: 8px;
transform: rotate(-10deg);
transition: transform 0.2s ease;
flex-shrink: 0;
}
.app-header__logo:hover .app-header__logo-stamp {
transform: rotate(-16deg) scale(1.08);
}
.app-header__logo-icon {
font-size: 1.375rem;
color: var(--mood-accent);
font-size: 1.125rem;
transform: scaleX(-1);
}
.app-header__logo-text {
display: flex;
align-items: baseline;
gap: 0;
}
.app-header__logo-g {
font-size: 1.5rem;
font-weight: 800;