Groupe1/Ressources-relationnel
1
0
Fork 0
Code Issues 1 Pull Requests Actions 3 Packages Projects 1 Releases Wiki Activity

feat: formulaire de suggestions optimisé pour mobile
CI - Intégration continue / quality-and-tests (push) Successful in 3m23s
Details
CD - Déploiement continu / deploy (push) Successful in 3m6s
Details

Browse Source 
Ré-appliqué sur la version avec suivi des suggestions du coéquipier.
- create.blade.php mobile-first : espacements/typo adaptatifs, champs en
  text-base (évite le zoom iOS), boutons empilés pleine largeur, compteur
  de caractères sur la description.
- header : bouton "Proposer une amélioration" accessible sur mobile
  (icône seule < sm) ; lien "Mes suggestions" conservé.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Sam DEPARDIEU
2026-07-08 22:12:33 +02:00
parent 2984b9f410
commit 96b598c6f4
2 changed files with 38 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/suggestions/create.blade.php
+33 -17
View File
@@ -3,12 +3,12 @@
@section('title', 'Proposer une amélioration - (RE)Sources Relationnelles')
@section('content')
<section class="container mx-auto px-4 py-12">
<section class="container mx-auto px-4 py-8 sm:py-12">
<div class="max-w-2xl mx-auto">
<!-- En-tête -->
<div class="mb-8">
<h1 class="text-4xl font-bold text-gray-900 mb-2">💡 Proposer une amélioration</h1>
<p class="text-gray-600">
<div class="mb-6 sm:mb-8">
<h1 class="text-2xl sm:text-4xl font-bold text-gray-900 mb-2">💡 Proposer une amélioration</h1>
<p class="text-sm sm:text-base text-gray-600">
Une idée, une correction, un ajout ? Votre suggestion est directement transmise à
l'équipe sous forme de ticket. Merci de votre contribution !
</p>
@@ -17,7 +17,7 @@
<!-- Message de succès -->
@if (session('success'))
<div class="mb-6 p-4 bg-green-50 border border-green-200 rounded-lg">
<p class="text-green-700 font-semibold">✅ {{ session('success') }}</p>
<p class="text-green-700 font-semibold text-sm sm:text-base">✅ {{ session('success') }}</p>
</div>
@endif
@@ -30,8 +30,8 @@
</div>
@endif
<div class="bg-white rounded-xl border border-gray-200 p-8">
<form action="{{ route('suggestions.store') }}" method="POST" class="space-y-6">
<div class="bg-white rounded-xl border border-gray-200 p-5 sm:p-8">
<form action="{{ route('suggestions.store') }}" method="POST" class="space-y-5 sm:space-y-6">
@csrf
<!-- Type de demande -->
@@ -41,10 +41,10 @@
id="type"
name="type"
required
class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none @error('type') border-red-500 @enderror">
class="w-full px-4 py-3 text-base border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none @error('type') border-red-500 @enderror">
@php($typeChoisi = old('type'))
<option value="Modification" @selected($typeChoisi === 'Modification')>✏️ Modification d'un contenu existant</option>
<option value="Ajout" @selected($typeChoisi === 'Ajout')>➕ Ajout d'un nouveau contenu / fonctionnalité</option>
<option value="Ajout" @selected($typeChoisi === 'Ajout')>➕ Ajout d'un contenu / fonctionnalité</option>
<option value="Correction" @selected($typeChoisi === 'Correction')>🐛 Correction d'une erreur / d'un bug</option>
</select>
@error('type')
@@ -64,7 +64,7 @@
maxlength="120"
value="{{ old('titre') }}"
placeholder="Résumez votre suggestion en une phrase"
class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none @error('titre') border-red-500 @enderror">
class="w-full px-4 py-3 text-base border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none @error('titre') border-red-500 @enderror">
@error('titre')
<p class="text-red-600 text-xs mt-1">{{ $message }}</p>
@enderror
@@ -72,27 +72,30 @@
<!-- Description -->
<div>
<label for="description" class="block text-sm font-bold mb-2 text-gray-700">Description détaillée</label>
<div class="flex items-baseline justify-between mb-2">
<label for="description" class="block text-sm font-bold text-gray-700">Description détaillée</label>
<span id="desc-count" class="text-xs text-gray-400 tabular-nums">0 / 5000</span>
</div>
<textarea
id="description"
name="description"
required
minlength="10"
maxlength="5000"
rows="8"
rows="6"
placeholder="Décrivez précisément votre proposition : quoi, où, pourquoi…"
class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none @error('description') border-red-500 @enderror">{{ old('description') }}</textarea>
class="w-full px-4 py-3 text-base border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none @error('description') border-red-500 @enderror">{{ old('description') }}</textarea>
@error('description')
<p class="text-red-600 text-xs mt-1">{{ $message }}</p>
@enderror
</div>
<!-- Boutons -->
<div class="flex gap-4 pt-2">
<button type="submit" class="px-8 py-3 gradient-niagara text-white font-bold rounded-lg hover:shadow-lg transition-smooth duration-200">
<!-- Boutons : empilés pleine largeur sur mobile, en ligne sur desktop -->
<div class="flex flex-col sm:flex-row gap-3 pt-2">
<button type="submit" class="w-full sm:w-auto px-8 py-3 gradient-niagara text-white font-bold rounded-lg hover:shadow-lg transition-smooth duration-200 text-center">
📨 Envoyer ma suggestion
</button>
<a href="{{ route('home') }}" class="px-8 py-3 bg-gray-200 text-gray-900 font-bold rounded-lg hover:bg-gray-300 transition-smooth duration-200">
<a href="{{ route('home') }}" class="w-full sm:w-auto px-8 py-3 bg-gray-200 text-gray-900 font-bold rounded-lg hover:bg-gray-300 transition-smooth duration-200 text-center">
Annuler
</a>
</div>
@@ -105,3 +108,16 @@
</div>
</section>
@endsection
@push('scripts')
<script>
(function () {
const ta = document.getElementById('description');
const compteur = document.getElementById('desc-count');
if (!ta || !compteur) return;
const maj = () => { compteur.textContent = ta.value.length + ' / 5000'; };
ta.addEventListener('input', maj);
maj();
})();
</script>
@endpush