Nîmes Citoyenne

{user ? (

{userPoints} points

) : ( )}

{showAccessibilityMenu && (

Accessibilité

)}

Propositions citoyennes

{showMap && (

Carte interactive des propositions

)}

setSearchQuery(e.target.value)} />

{propositions .filter( (prop) => (filterCategory === "all" || prop.categorie.toLowerCase() === filterCategory) && (prop.titre.toLowerCase().includes(searchQuery.toLowerCase()) || prop.description .toLowerCase() .includes(searchQuery.toLowerCase())), ) .map((prop) => (

{prop.titre}

{prop.status}

{prop.description}

{prop.localisation}

{prop.budget}

{prop.categorie}

{prop.commentaires.length > 0 && (

Derniers commentaires

{prop.commentaires.map((com) => (

{com.auteur}:{" "} {com.texte}

))}

)}

))}

{showBudget && (

Budget Participatif

Budget total disponible: 500 000€

225 000€ alloués

{propositions.map((prop) => (

{prop.titre}

{prop.budget}

))}

)} {showSignalement && (

Signaler un problème

<div className="mb-4">
                <label className="block mb-2">Photo du problème</label>
                <input type="file" accept="image/*" className="w-full" />
              </div>
              <div className="mb-4">
                <label className="block mb-2">Localisation</label>
                <input
                  type="text"
                  placeholder="Adresse"
                  className="w-full p-2 border rounded"
                />
              </div>
              <div className="flex justify-end gap-4">
                <button
                  onClick={() => setShowSignalement(false)}
                  className="px-4 py-2 text-gray-600"
                >
                  Annuler
                </button>
                <button className="px-4 py-2 bg-[#E5172D] text-white rounded">
                  Envoyer le signalement
                </button>
              </div>
            </div>
          </div>
        )}
      </main>

<footer className="bg-gray-800 text-white mt-12 py-8">
        <div className="container mx-auto px-4">
          <div className="flex flex-col md:flex-row justify-between items-center">
            <div className="text-center md:text-left mb-4 md:mb-0">
              <img
                src="/logo-nimes.png"
                alt="Logo Ville de Nîmes"
                className="h-12 mb-2"
              />
              <p className="font-roboto">© 2025 Ville de Nîmes</p>
            </div>
            <div className="flex gap-6">
              <a href="#" className="hover:text-[#E5172D]">
                <i className="fab fa-facebook text-xl"></i>
              </a>
              <a href="#" className="hover:text-[#E5172D]">
                <i className="fab fa-twitter text-xl"></i>
              </a>
              <a href="#" className="hover:text-[#E5172D]">
                <i className="fab fa-instagram text-xl"></i>
              </a>
            </div>
          </div>
        </div>
      </footer>

{showLoginModal && (
        <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center">
          <div className="bg-white p-6 rounded-lg w-[400px]">
            <h3 className="text-xl mb-4 font-roboto">Connexion</h3>
            <input
              type="email"
              placeholder="Email"
              className="w-full p-2 border rounded mb-4"
            />
            <input
              type="password"
              placeholder="Mot de passe"
              className="w-full p-2 border rounded mb-4"
            />
            <div className="flex justify-end gap-4">
              <button
                onClick={() => setShowLoginModal(false)}
                className="px-4 py-2 text-gray-600"
              >
                Annuler
              </button>
              <button className="px-4 py-2 bg-[#E5172D] text-white rounded">
                Se connecter
              </button>
            </div>
          </div>
        </div>
      )}

{showNewProposalModal && (
        <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center">
          <div className="bg-white p-6 rounded-lg w-[600px]">
            <h3 className="text-xl mb-4 font-roboto">Nouvelle proposition</h3>
            <input
              type="text"
              placeholder="Titre"
              className="w-full p-2 border rounded mb-4"
            />
            <textarea
              placeholder="Description"
              className="w-full p-2 border rounded mb-4 h-32"
            />
            <select className="w-full p-2 border rounded mb-4">
              <option value="">Sélectionner une catégorie</option>
              <option value="environnement">Environnement</option>
              <option value="transport">Transport</option>
              <option value="culture">Culture</option>
              <option value="securite">Sécurité</option>
            </select>
            <div className="flex justify-end gap-4">
              <button
                onClick={() => setShowNewProposalModal(false)}
                className="px-4 py-2 text-gray-600"
              >
                Annuler
              </button>
              <button className="px-4 py-2 bg-[#E5172D] text-white rounded">
                Publier
              </button>
            </div>
          </div>
        </div>
      )}
    </div>
  );
}</article></body></html>