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

ajout du systeme de layout

Browse Source
This commit is contained in:
Sam DEPARDIEU
2026-03-23 22:33:33 +01:00
parent fb1f8b26a2
commit eb9d1f496b
9 changed files with 197 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/css/style.css
+18 -3
View File
@@ -1,6 +1,21 @@
/* Couleurs officielles du cahier des charges */
.bg-niagara { background-color: #06989e; }
.text-niagara { color: #06989e; }
.border-niagara { border-color: #06989e; }
.bg-candlelight { background-color: #fce117; }
.bg-candlelight { background-color: #fce117; }
/* Améliorations de style */
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
}
.transition-smooth {
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.glow-niagara {
box-shadow: 0 0 20px rgba(6, 152, 158, 0.3);
}
.gradient-niagara {
background: linear-gradient(135deg, #06989e 0%, #048a91 100%);
}
.gradient-light {
background: linear-gradient(135deg, #f8f9fa 0%, #f0f1f3 100%);
}
resources/views/app.blade.php
+50
View File
@@ -0,0 +1,50 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@yield('title', '(RE)Sources Relationnelles - Ministère des Solidarités et de la Santé')</title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
/* Couleurs officielles du cahier des charges */
.bg-niagara { background-color: #06989e; }
.text-niagara { color: #06989e; }
.border-niagara { border-color: #06989e; }
.bg-candlelight { background-color: #fce117; }
/* Améliorations de style */
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
}
.transition-smooth {
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.glow-niagara {
box-shadow: 0 0 20px rgba(6, 152, 158, 0.3);
}
.gradient-niagara {
background: linear-gradient(135deg, #06989e 0%, #048a91 100%);
}
.gradient-light {
background: linear-gradient(135deg, #f8f9fa 0%, #f0f1f3 100%);
}
</style>
@stack('styles')
</head>
<body class="bg-white text-gray-900 font-sans leading-relaxed">
<a href="#main-content" class="sr-only focus:not-sr-only aria-label font-bold p-4 bg-niagara text-white block text-center z-50">
Aller au contenu principal
</a>
@include('layout.header')
<main id="main-content">
@yield('content')
</main>
@include('layout.footer')
@stack('scripts')
</body>
</html>
resources/views/connexion/login.blade.php
+32
View File
@@ -0,0 +1,32 @@
@extends('app')
@section('title', 'Connexion - (RE)Sources Relationnelles')
@section('content')
<section class="container mx-auto px-4 py-16">
<div class="max-w-md mx-auto bg-white rounded-xl border border-gray-200 p-8">
<h1 class="text-2xl font-bold mb-6 text-center text-niagara">Connexion</h1>
<form action="#" method="POST" class="space-y-4">
@csrf
<div>
<label for="email" class="block text-sm font-bold mb-2 text-gray-700">Email</label>
<input type="email" id="email" name="email" required class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none">
</div>
<div>
<label for="password" class="block text-sm font-bold mb-2 text-gray-700">Mot de passe</label>
<input type="password" id="password" name="password" required class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none">
</div>
<button type="submit" class="w-full py-3 gradient-niagara text-white font-bold rounded-lg hover:shadow-lg transition-smooth duration-200">
Se connecter
</button>
</form>
<p class="text-center mt-6 text-gray-600">
Pas encore inscrit? <a href="{{ route('register') }}" class="text-niagara font-bold hover:underline">S'inscrire</a>
</p>
</div>
</section>
@endsection
resources/views/connexion/register.blade.php
+42
View File
@@ -0,0 +1,42 @@
@extends('app')
@section('title', 'S\'inscrire - (RE)Sources Relationnelles')
@section('content')
<section class="container mx-auto px-4 py-16">
<div class="max-w-md mx-auto bg-white rounded-xl border border-gray-200 p-8">
<h1 class="text-2xl font-bold mb-6 text-center text-niagara">S'inscrire</h1>
<form action="#" method="POST" class="space-y-4">
@csrf
<div>
<label for="name" class="block text-sm font-bold mb-2 text-gray-700">Nom</label>
<input type="text" id="name" name="name" required class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none">
</div>
<div>
<label for="email" class="block text-sm font-bold mb-2 text-gray-700">Email</label>
<input type="email" id="email" name="email" required class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none">
</div>
<div>
<label for="password" class="block text-sm font-bold mb-2 text-gray-700">Mot de passe</label>
<input type="password" id="password" name="password" required class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none">
</div>
<div>
<label for="password_confirmation" class="block text-sm font-bold mb-2 text-gray-700">Confirmer le mot de passe</label>
<input type="password" id="password_confirmation" name="password_confirmation" required class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-niagara outline-none">
</div>
<button type="submit" class="w-full py-3 gradient-niagara text-white font-bold rounded-lg hover:shadow-lg transition-smooth duration-200">
S'inscrire
</button>
</form>
<p class="text-center mt-6 text-gray-600">
Déjà inscrit? <a href="{{ route('login') }}" class="text-niagara font-bold hover:underline">Se connecter</a>
</p>
</div>
</section>
@endsection
resources/views/layout/head.blade.php
+32
View File
@@ -0,0 +1,32 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>(RE)Sources Relationnelles - Ministère des Solidarités et de la Santé</title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
/* Couleurs officielles du cahier des charges */
.bg-niagara { background-color: #06989e; }
.text-niagara { color: #06989e; }
.border-niagara { border-color: #06989e; }
.bg-candlelight { background-color: #fce117; }
/* Améliorations de style */
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
}
.transition-smooth {
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.glow-niagara {
box-shadow: 0 0 20px rgba(6, 152, 158, 0.3);
}
.gradient-niagara {
background: linear-gradient(135deg, #06989e 0%, #048a91 100%);
}
.gradient-light {
background: linear-gradient(135deg, #f8f9fa 0%, #f0f1f3 100%);
}
</style>
</head>
resources/views/layout/header.blade.php
+2 -2
View File
@@ -23,10 +23,10 @@
</div>
<nav class="flex items-center gap-2 whitespace-nowrap">
<a href="/login" class="px-5 py-2.5 text-sm font-bold text-niagara border-2 border-niagara rounded-lg hover:bg-niagara hover:text-white transition-smooth duration-200">
<a href="{{ route('login') }}" class="px-5 py-2.5 text-sm font-bold text-niagara border-2 border-niagara rounded-lg hover:bg-niagara hover:text-white transition-smooth duration-200">
Connexion
</a>
<a href="/register" class="px-5 py-2.5 text-sm font-bold bg-candlelight text-gray-900 rounded-lg shadow-md hover:shadow-lg hover:-translate-y-0.5 transition-smooth duration-200">
<a href="{{ route('register') }}" class="px-5 py-2.5 text-sm font-bold bg-candlelight text-gray-900 rounded-lg shadow-md hover:shadow-lg hover:-translate-y-0.5 transition-smooth duration-200">
S'inscrire
</a>
</nav>
resources/views/resources.blade.php
+6 -24
View File
@@ -1,23 +1,9 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Catalogue - (RE)Sources Relationnelles</title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
.bg-niagara { background-color: #06989e; }
.text-niagara { color: #06989e; }
.border-niagara { border-color: #06989e; }
.bg-candlelight { background-color: #fce117; }
.transition-smooth { transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
</style>
</head>
<body class="bg-gray-50 text-gray-900 font-sans">
@extends('app')
@include('layout.header')
@section('title', 'Ressources - (RE)Sources Relationnelles')
<main class="container mx-auto px-4 py-12">
@section('content')
<section class="container mx-auto px-4 py-12">
<div class="text-center mb-12">
<h1 class="text-4xl font-extrabold mb-4">Catalogue des <span class="text-niagara">Ressources</span></h1>
<p class="text-gray-600 max-w-2xl mx-auto">Accédez à des outils et conseils pour renforcer vos liens. Filtrez les ressources selon vos besoins.</p>
@@ -123,9 +109,5 @@
</div>
</div>
</main>
@include('layout.footer')
</body>
</html>
</section>
@endsection
resources/views/welcome.blade.php
+5 -45
View File
@@ -1,44 +1,8 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>(RE)Sources Relationnelles - Ministère des Solidarités et de la Santé</title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
/* Couleurs officielles du cahier des charges */
.bg-niagara { background-color: #06989e; }
.text-niagara { color: #06989e; }
.border-niagara { border-color: #06989e; }
.bg-candlelight { background-color: #fce117; }
/* Améliorations de style */
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
}
.transition-smooth {
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.glow-niagara {
box-shadow: 0 0 20px rgba(6, 152, 158, 0.3);
}
.gradient-niagara {
background: linear-gradient(135deg, #06989e 0%, #048a91 100%);
}
.gradient-light {
background: linear-gradient(135deg, #f8f9fa 0%, #f0f1f3 100%);
}
</style>
</head>
<body class="bg-white text-gray-900 font-sans leading-relaxed">
@extends('app')
<a href="#main-content" class="sr-only focus:not-sr-only aria-label font-bold p-4 bg-niagara text-white block text-center z-50">
Aller au contenu principal
</a>
@section('title', '(RE)Sources Relationnelles - Accueil')
@include('layout.header')
<main id="main-content">
@section('content')
<section class="py-16 md:py-28 gradient-light">
<div class="container mx-auto px-4 flex flex-col md:flex-row items-center gap-12">
<div class="md:w-1/2 text-center md:text-left">
@@ -49,7 +13,7 @@
La plateforme citoyenne dédiée à la qualité des liens : famille, amis, couple ou collègues.
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center md:justify-start">
<a href="/resources" class="px-8 py-4 gradient-niagara text-white rounded-lg font-bold text-lg hover:shadow-lg hover:-translate-y-1 transition-smooth duration-200 inline-block">
<a href="{{ route('resources.index') }}" class="px-8 py-4 gradient-niagara text-white rounded-lg font-bold text-lg hover:shadow-lg hover:-translate-y-1 transition-smooth duration-200 inline-block">
Explorer les ressources
</a>
<button class="px-8 py-4 bg-white border-2 border-gray-300 rounded-lg font-bold text-lg text-gray-900 hover:border-niagara hover:text-niagara transition-smooth duration-200">
@@ -95,8 +59,4 @@
</div>
</div>
</section>
</main>
@include('layout.footer')
</body>
</html>
@endsection
routes/web.php
+10 -2
View File
@@ -4,8 +4,16 @@ use Illuminate\Support\Facades\Route;
Route::get('/', function () {
return view('welcome');
});
})->name('home');
Route::get('/resources', function () {
return view('resources');
});
})->name('resources.index');
Route::get('/login', function () {
return view('auth.login');
})->name('login');
Route::get('/register', function () {
return view('auth.register');
})->name('register');