Initial commit

src/app/public/pages/home/home.component.html

@@ -0,0 +1,85 @@
+<!-- Section image plein écran -->
+<section class="relative h-screen w-full overflow-hidden">
+  <img
+    src="/img/background.png"
+    alt="Image de fond"
+    class="absolute w-full h-full object-cover"
+  >
+  <div class="flex justify-between">
+    <div class="relative">
+      <h1 class="text-white text-6xl md:text-8xl font-bold mb-32">Développeur web</h1>
+    </div>
+    <div class="relative">
+      <h1 class="text-white text-6xl md:text-8xl font-bold mb-32">Johan Leroy</h1>
+    </div>
+  </div>
+</section>
+
+<!-- Section liste des projets -->
+<section id="projets" class="min-h-screen bg-[#181818] py-20 px-4 md:px-8">
+  <div class="max-w-6xl mx-auto">
+    <h2 class="text-3xl md:text-4xl font-bold mb-12 text-white text-center">Mes Projets</h2>
+
+    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+      <!-- Projet 1 -->
+      <div class="bg-gray-100 rounded-lg overflow-hidden shadow-lg transition-transform duration-300 hover:scale-105">
+        <img src="https://via.placeholder.com/600x400" alt="Projet 1" class="w-full h-48 object-cover">
+        <div class="p-6">
+          <h3 class="text-xl font-bold mb-2">Projet 1</h3>
+          <p class="text-gray-700 mb-4">Description du projet 1. Voici quelques détails sur ce projet et les technologies utilisées.</p>
+          <a href="#" class="text-blue-600 font-medium hover:underline">Voir plus</a>
+        </div>
+      </div>
+
+      <!-- Projet 2 -->
+      <div class="bg-gray-100 rounded-lg overflow-hidden shadow-lg transition-transform duration-300 hover:scale-105">
+        <img src="https://via.placeholder.com/600x400" alt="Projet 2" class="w-full h-48 object-cover">
+        <div class="p-6">
+          <h3 class="text-xl font-bold mb-2">Projet 2</h3>
+          <p class="text-gray-700 mb-4">Description du projet 2. Voici quelques détails sur ce projet et les technologies utilisées.</p>
+          <a href="#" class="text-blue-600 font-medium hover:underline">Voir plus</a>
+        </div>
+      </div>
+
+      <!-- Projet 3 -->
+      <div class="bg-gray-100 rounded-lg overflow-hidden shadow-lg transition-transform duration-300 hover:scale-105">
+        <img src="https://via.placeholder.com/600x400" alt="Projet 3" class="w-full h-48 object-cover">
+        <div class="p-6">
+          <h3 class="text-xl font-bold mb-2">Projet 3</h3>
+          <p class="text-gray-700 mb-4">Description du projet 3. Voici quelques détails sur ce projet et les technologies utilisées.</p>
+          <a href="#" class="text-blue-600 font-medium hover:underline">Voir plus</a>
+        </div>
+      </div>
+
+      <!-- Projet 4 -->
+      <div class="bg-gray-100 rounded-lg overflow-hidden shadow-lg transition-transform duration-300 hover:scale-105">
+        <img src="https://via.placeholder.com/600x400" alt="Projet 4" class="w-full h-48 object-cover">
+        <div class="p-6">
+          <h3 class="text-xl font-bold mb-2">Projet 4</h3>
+          <p class="text-gray-700 mb-4">Description du projet 4. Voici quelques détails sur ce projet et les technologies utilisées.</p>
+          <a href="#" class="text-blue-600 font-medium hover:underline">Voir plus</a>
+        </div>
+      </div>
+
+      <!-- Projet 5 -->
+      <div class="bg-gray-100 rounded-lg overflow-hidden shadow-lg transition-transform duration-300 hover:scale-105">
+        <img src="https://via.placeholder.com/600x400" alt="Projet 5" class="w-full h-48 object-cover">
+        <div class="p-6">
+          <h3 class="text-xl font-bold mb-2">Projet 5</h3>
+          <p class="text-gray-700 mb-4">Description du projet 5. Voici quelques détails sur ce projet et les technologies utilisées.</p>
+          <a href="#" class="text-blue-600 font-medium hover:underline">Voir plus</a>
+        </div>
+      </div>
+
+      <!-- Projet 6 -->
+      <div class="bg-gray-100 rounded-lg overflow-hidden shadow-lg transition-transform duration-300 hover:scale-105">
+        <img src="https://via.placeholder.com/600x400" alt="Projet 6" class="w-full h-48 object-cover">
+        <div class="p-6">
+          <h3 class="text-xl font-bold mb-2">Projet 6</h3>
+          <p class="text-gray-700 mb-4">Description du projet 6. Voici quelques détails sur ce projet et les technologies utilisées.</p>
+          <a href="#" class="text-blue-600 font-medium hover:underline">Voir plus</a>
+        </div>
+      </div>
+    </div>
+  </div>
+</section>

src/app/public/pages/home/home.component.ts

@@ -0,0 +1,13 @@
+import {Component} from '@angular/core';
+
+@Component({
+  selector: 'app-home',
+  imports: [],
+  templateUrl: './home.component.html',
+  styleUrl: './home.component.css'
+})
+export class HomeComponent {
+
+
+
+}

src/app/public/pages/not-found/not-found.component.html

@@ -0,0 +1 @@
+<p>not-found works!</p>

src/app/public/pages/not-found/not-found.component.ts

@@ -0,0 +1,19 @@
+import {Component, OnInit} from '@angular/core';
+import {Title} from '@angular/platform-browser';
+
+@Component({
+  selector: 'app-not-found',
+  imports: [],
+  templateUrl: './not-found.component.html',
+  styleUrl: './not-found.component.css'
+})
+export class NotFoundComponent implements OnInit {
+
+  constructor(private title: Title) {
+  }
+
+  ngOnInit(): void {
+    this.title.setTitle('404 - YouVideo');
+  }
+
+}

src/app/public/public-layout/public-layout.component.html

@@ -0,0 +1 @@
+<router-outlet />

src/app/public/public-layout/public-layout.component.ts

@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import {RouterOutlet} from '@angular/router';
+
+@Component({
+  selector: 'app-public-layout',
+  imports: [
+    RouterOutlet
+  ],
+  templateUrl: './public-layout.component.html',
+  styleUrl: './public-layout.component.css'
+})
+export class PublicLayoutComponent {
+
+}

src/app/public/public-routing.module.ts

@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+import {NotFoundComponent} from './pages/not-found/not-found.component';
+import {PublicLayoutComponent} from './public-layout/public-layout.component';
+import {HomeComponent} from './pages/home/home.component';
+
+const routes: Routes = [
+  { path: '', component: PublicLayoutComponent, children: [
+      { path: '',  component: HomeComponent },
+    ]
+  },
+  { path: '**', component: NotFoundComponent },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class PublicRoutingModule { }

src/app/public/public.module.ts

@@ -0,0 +1,14 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { PublicRoutingModule } from './public-routing.module';
+
+
+@NgModule({
+  declarations: [],
+  imports: [
+    CommonModule,
+    PublicRoutingModule
+  ]
+})
+export class PublicModule { }