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

75
frontend/app/pages/documents/index.vue
View File

@@ -258,8 +258,7 @@ async function createDocument() {
v-for="protocol in protocols.protocols"
:key="protocol.id"
:title="protocol.name"
:description="protocol.description || undefined"
context-label="Documents"
:bullets="['Applicable aux documents', protocol.mode_params || 'Configuration standard']"
:actions="[
{ label: 'Voir', icon: 'i-lucide-eye', to: `/protocols/${protocol.id}` },
]"
@@ -274,8 +273,8 @@ async function createDocument() {
<!-- New document modal -->
<UModal v-model:open="showNewDocModal">
<template #content>
<div class="p-6 space-y-4">
<h3 class="text-lg font-semibold" style="color: var(--mood-text);">
<div class="p-4 sm:p-6 space-y-4">
<h3 class="text-base sm:text-lg font-semibold" style="color: var(--mood-text);">
Nouveau document de reference
</h3>
@@ -363,17 +362,27 @@ async function createDocument() {
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) {
.doc-card {
gap: 0.625rem;
padding: 1.25rem;
}
}
.doc-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);
}
.doc-card:active {
transform: translateY(0);
}
.doc-card__header {
@@ -384,21 +393,33 @@ async function createDocument() {
}
.doc-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) {
.doc-card__title {
font-size: 1.0625rem;
}
}
.doc-card__meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.5rem;
gap: 0.375rem;
}
@media (min-width: 640px) {
.doc-card__meta {
gap: 0.5rem;
}
}
.doc-card__version {
font-size: 0.6875rem;
font-size: 0.8125rem;
font-family: ui-monospace, SFMono-Regular, monospace;
color: var(--mood-text-muted);
}
@@ -407,29 +428,41 @@ async function createDocument() {
display: inline-flex;
align-items: center;
gap: 0.25rem;
font-size: 0.6875rem;
font-size: 0.8125rem;
color: var(--mood-text-muted);
}
.doc-card__date {
font-size: 0.6875rem;
font-size: 0.75rem;
color: var(--mood-text-muted);
margin-left: auto;
}
@media (min-width: 640px) {
.doc-card__date {
font-size: 0.8125rem;
}
}
.doc-card__description {
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: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
@media (min-width: 640px) {
.doc-card__description {
font-size: 0.875rem;
}
}
.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;
@@ -437,7 +470,7 @@ async function createDocument() {
}
.toolbox-empty-text {
font-size: 0.75rem;
font-size: 0.8125rem;
color: var(--mood-text-muted);
}
</style>