refactor(ui) : improve styling, layout and responsive across all components

Rework CSS theme (app.css), navbar layout, dashboard page, machine detail,
catalog pages, and various form/display components for better consistency
and mobile responsiveness.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-09 00:14:32 +01:00
parent 6b5eb7bcd6
commit 5b9c4ca09d
38 changed files with 522 additions and 569 deletions

View File

@@ -50,7 +50,7 @@
<div v-show="!isCollapsed" class="space-y-4">
<!-- Component Info Display - Editable or Read-only -->
<div class="p-4 bg-base-100 border border-gray-200 rounded-lg">
<div class="p-4 bg-base-100 border border-base-200 rounded-lg">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
<div class="form-control">
<label class="label"><span class="label-text font-medium">Nom</span></label>
@@ -111,7 +111,7 @@
<span class="font-medium">{{ constructeur.name }}</span>
<span
v-if="formatConstructeurContact(constructeur)"
class="text-xs text-gray-500"
class="text-xs text-base-content/50"
>
{{ formatConstructeurContact(constructeur) }}
</span>
@@ -220,9 +220,9 @@
@field-blur="updateComponentCustomField"
/>
<div class="mt-4 pt-4 border-t border-gray-200 space-y-3">
<div class="mt-4 pt-4 border-t border-base-200 space-y-3">
<div class="flex items-center justify-between">
<h4 class="font-semibold text-sm text-gray-700">
<h4 class="font-semibold text-sm text-base-content/80">
Documents
</h4>
<span v-if="isEditMode && selectedFiles.length" class="badge badge-outline">
@@ -230,7 +230,7 @@
</span>
</div>
<p v-if="loadingDocuments" class="text-xs text-gray-500">
<p v-if="loadingDocuments" class="text-xs text-base-content/50">
Chargement des documents...
</p>
@@ -254,7 +254,7 @@
<!-- Component Pieces -->
<div v-if="component.pieces && component.pieces.length > 0" class="space-y-2">
<h4 class="font-semibold text-gray-700">
<h4 class="font-semibold text-base-content/80">
Pièces du composant
</h4>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-3">
@@ -272,10 +272,10 @@
<!-- Sub Components -->
<div v-if="childComponents.length > 0" class="space-y-3">
<h4 class="font-semibold text-gray-700">
<h4 class="font-semibold text-base-content/80">
Sous-composants
</h4>
<div class="space-y-3 pl-4 border-l-2 border-gray-200">
<div class="space-y-3 pl-4 border-l-2 border-base-200">
<ComponentItem
v-for="subComponent in childComponents"
:key="subComponent.id"