yvv/decision
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Design ludique arrondi + mobile responsive + fix IPv6

Browse Source 
- ToolboxVignette: prop bullets[] remplace description, touch targets agrandis
- Design arrondi: border-radius 16px cards, 20px pills, 12px inputs, no borders
- Hover animations: translateY(-3px) + shadow, active states pour touch
- SectionLayout: toolbox accordion mobile, pills scroll horizontal, responsive title/subtitle
- app.vue: MoodSwitcher dans drawer mobile, header responsive, nav touch-friendly
- Dashboard: grille 2-colonnes mobile, connect banner column layout, formula code scroll
- Documents/decisions/mandates/protocols: cards responsive (padding, font-size, gap)
- Login: touch targets 3rem min, iOS zoom prevention, responsive sizing
- Modals: padding responsive sm:p-6
- Protocols: table compact mobile, proto items responsive
- nuxt.config: host 0.0.0.0 pour fix IPv4/IPv6 binding

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Yvv
2026-02-28 23:09:29 +01:00
parent 9b6388a600
commit c7cb22f313
15 changed files with 1730 additions and 1021 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
frontend/app/pages/decisions/index.vue
View File

@@ -200,8 +200,7 @@ function formatDate(dateStr: string): string {
v-for="protocol in protocols.protocols"
:key="protocol.id"
:title="protocol.name"
:description="protocol.description || undefined"
context-label="Decisions"
:bullets="['Applicable aux decisions', protocol.mode_params || 'Configuration standard']"
:actions="[
{ label: 'Voir', icon: 'i-lucide-eye', to: `/protocols/${protocol.id}` },
]"
@@ -219,17 +218,27 @@ function formatDate(dateStr: string): string {
display: flex;
flex-direction: column;
gap: 0.5rem;
padding: 0.875rem 1rem;
padding: 1rem;
background: var(--mood-surface);
border: 1px solid var(--mood-border);
border-radius: 0.5rem;
border-radius: 16px;
cursor: pointer;
transition: all 0.2s ease;
transition: transform 0.12s ease, box-shadow 0.12s ease;
}
@media (min-width: 640px) {
.decision-card {
gap: 0.625rem;
padding: 1.25rem;
}
}
.decision-card:hover {
border-color: var(--mood-accent);
box-shadow: 0 2px 8px var(--mood-shadow);
transform: translateY(-3px);
box-shadow: 0 8px 24px var(--mood-shadow);
}
.decision-card:active {
transform: translateY(0);
}
.decision-card__header {
@@ -245,47 +254,71 @@ function formatDate(dateStr: string): string {
}
.decision-card__title {
font-size: 0.875rem;
font-weight: 600;
font-size: 0.9375rem;
font-weight: 700;
color: var(--mood-text);
line-height: 1.3;
}
@media (min-width: 640px) {
.decision-card__title {
font-size: 1.0625rem;
}
}
.decision-card__description {
margin-top: 0.25rem;
font-size: 0.75rem;
font-size: 0.8125rem;
color: var(--mood-text-muted);
line-height: 1.4;
line-height: 1.5;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
@media (min-width: 640px) {
.decision-card__description {
font-size: 0.875rem;
}
}
.decision-card__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.5rem;
gap: 0.375rem;
}
@media (min-width: 640px) {
.decision-card__meta {
gap: 0.5rem;
}
}
.decision-card__steps {
display: inline-flex;
align-items: center;
gap: 0.25rem;
font-size: 0.6875rem;
font-size: 0.8125rem;
color: var(--mood-text-muted);
}
.decision-card__date {
font-size: 0.6875rem;
font-size: 0.75rem;
color: var(--mood-text-muted);
margin-left: auto;
}
@media (min-width: 640px) {
.decision-card__date {
font-size: 0.8125rem;
}
}
.toolbox-section-title {
font-size: 0.75rem;
font-weight: 600;
font-size: 0.8125rem;
font-weight: 700;
color: var(--mood-text-muted);
text-transform: uppercase;
letter-spacing: 0.04em;
@@ -293,7 +326,7 @@ function formatDate(dateStr: string): string {
}
.toolbox-empty-text {
font-size: 0.75rem;
font-size: 0.8125rem;
color: var(--mood-text-muted);
}
</style>