From 1202e882d1663d807aa1f3c94d3654daeb7c8d9c Mon Sep 17 00:00:00 2001
From: D3B1RUM4N <elies1.mek03@gmail.com>
Date: Wed, 4 Dec 2024 21:47:28 +0100
Subject: [PATCH 01/10] style: home css
---
.../form-play-quiz/form-play-quiz.component.html | 4 ++--
.../modules/home/home-page/home-page.component.css | 14 +++-----------
.../home/home-page/home-page.component.html | 8 ++++----
src/app/shared/header/header.component.css | 1 +
src/styles.css | 4 +++-
5 files changed, 13 insertions(+), 18 deletions(-)
diff --git a/src/app/modules/home/form-play-quiz/form-play-quiz.component.html b/src/app/modules/home/form-play-quiz/form-play-quiz.component.html
index bb52d57..f420c5b 100644
--- a/src/app/modules/home/form-play-quiz/form-play-quiz.component.html
+++ b/src/app/modules/home/form-play-quiz/form-play-quiz.component.html
@@ -1,4 +1,4 @@
-<main class="container">
+<div class="container">
<div class="button-header">
<button (click)="createQuiz()">Play a quiz</button>
<button (click)="startQuiz()">Join a quiz</button>
@@ -7,4 +7,4 @@
<app-form-start-quiz *ngIf="showStartQuiz"></app-form-start-quiz>
<app-form-create-quiz *ngIf="showCreateQuiz"></app-form-create-quiz>
</div>
-</main>
+</div>
\ No newline at end of file
diff --git a/src/app/modules/home/home-page/home-page.component.css b/src/app/modules/home/home-page/home-page.component.css
index 43c37cb..572925e 100644
--- a/src/app/modules/home/home-page/home-page.component.css
+++ b/src/app/modules/home/home-page/home-page.component.css
@@ -1,16 +1,8 @@
-@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
-
-.main {
+.question-marks {
display: flex;
height: 90vh;
width: 100vW;
margin: 0;
- padding: 10vh 0 0 0 ;
- background-image: url(../../../../../public/WEB-BACKGROUNDHOME3.png);
- background-size: cover;
- background-position: center;
- background-repeat: no-repeat;
- background-attachment: fixed;
}
button {
@@ -40,6 +32,6 @@ button:hover {
}
.logo {
- height: 20%;
- width: 65%;
+ height: 20vmin;
+ width: 65vmin;
}
\ No newline at end of file
diff --git a/src/app/modules/home/home-page/home-page.component.html b/src/app/modules/home/home-page/home-page.component.html
index 01d3cc1..e9048ef 100644
--- a/src/app/modules/home/home-page/home-page.component.html
+++ b/src/app/modules/home/home-page/home-page.component.html
@@ -1,6 +1,6 @@
-<main class="main">
+<div class="question-marks">
<div class="left-side">
- <img src="LogoApp.png" class="logo"/>
+ <img src="LogoApp.png" class="logo" />
<div class="navigation-button">
<button (click)="quickGame()">Quick game</button>
<button (click)="playQuiz()">Play a quiz</button>
@@ -10,5 +10,5 @@
<div class="right-side">
<app-form-play-quiz *ngIf="showPlayQuiz"></app-form-play-quiz>
<app-my-quiz *ngIf="showMyQuiz"></app-my-quiz>
- </div>
-</main>
+ </div>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/header/header.component.css b/src/app/shared/header/header.component.css
index e05c310..da874bd 100644
--- a/src/app/shared/header/header.component.css
+++ b/src/app/shared/header/header.component.css
@@ -7,6 +7,7 @@
background-color: #F3F3F3;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
position: absolute;
+ top: 0;
display: flex;
/* padding-inline: 1%; */
}
diff --git a/src/styles.css b/src/styles.css
index 1512f9a..5de4c26 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -1,3 +1,5 @@
+@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
+
/* You can add global styles to this file, and also import other style files */
html,
body {
@@ -8,7 +10,7 @@ body {
}
main {
- padding-top: 10vh;
+ margin-top: 10vh;
/* header size */
height: 90vh;
}
--
GitLab
From b74759e6d68af7bd365fae1c0ee395c4e2826034 Mon Sep 17 00:00:00 2001
From: D3B1RUM4N <elies1.mek03@gmail.com>
Date: Wed, 4 Dec 2024 21:55:08 +0100
Subject: [PATCH 02/10] style: fix sizing
---
.../create-custom-quiz/create-custom-quiz.component.css | 4 ----
.../modules/profile/profile-info/profile-info.component.css | 4 ++--
2 files changed, 2 insertions(+), 6 deletions(-)
diff --git a/src/app/modules/profile/create-custom-quiz/create-custom-quiz.component.css b/src/app/modules/profile/create-custom-quiz/create-custom-quiz.component.css
index ba34fb0..b9c0926 100644
--- a/src/app/modules/profile/create-custom-quiz/create-custom-quiz.component.css
+++ b/src/app/modules/profile/create-custom-quiz/create-custom-quiz.component.css
@@ -55,10 +55,6 @@
-webkit-box-sizing: border-box;
}
-/* form {
- height: 100%;
-} */
-
input {
height: 3vmin;
width: calc(90vw/2);
diff --git a/src/app/modules/profile/profile-info/profile-info.component.css b/src/app/modules/profile/profile-info/profile-info.component.css
index 661c6bd..bc58e7f 100644
--- a/src/app/modules/profile/profile-info/profile-info.component.css
+++ b/src/app/modules/profile/profile-info/profile-info.component.css
@@ -3,13 +3,13 @@
display: grid;
grid-auto-flow: column;
grid-template-columns: 40% 40%;
- grid-template-rows: 10% 85%;
+ grid-template-rows: 5% 85%;
grid-gap: 0 7%;
justify-content: center;
align-items: center;
width: 100vw;
- height: 90vh;
+ height: 88%;
}
.grid {
--
GitLab
From 8ea1f4551ed146accc8b416ef6c6c0ea18fff298 Mon Sep 17 00:00:00 2001
From: D3B1RUM4N <elies1.mek03@gmail.com>
Date: Wed, 4 Dec 2024 22:20:28 +0100
Subject: [PATCH 03/10] style: profile css
---
.../profile-info/profile-info.component.css | 37 +++++++++++--------
.../profile-info/profile-info.component.html | 4 +-
src/styles.css | 11 +++++-
3 files changed, 33 insertions(+), 19 deletions(-)
diff --git a/src/app/modules/profile/profile-info/profile-info.component.css b/src/app/modules/profile/profile-info/profile-info.component.css
index bc58e7f..86d8b91 100644
--- a/src/app/modules/profile/profile-info/profile-info.component.css
+++ b/src/app/modules/profile/profile-info/profile-info.component.css
@@ -56,28 +56,33 @@
}
hr {
- width: 106%;
+ width: 100%;
height: 1vmin;
margin: 0;
- margin-left: -6%;
background-color: #F3F3F3;
border: none;
}
-button {
- background-color: #fff;
- /* height: 28vh; */
- /* padding: auto;
- margin: 2vh; */
- border-radius: 10px;
- box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
- display: flex;
- align-items: center;
- justify-content: center;
- /* font-size: 2rem; */
- font-family: sans-serif;
- border: 0;
- color: black;
+.blueButton {
+ vertical-align: middle;
+ height: 3vmin;
+ font-size: 2.5vmin;
+ margin-top: 0.5vmin;
+ margin-bottom: 0.5vmin;
+}
+
+input {
+ height: 3vmin;
+ margin-top: 0.5vmin;
+ margin-bottom: 0.5vmin;
+ /*padding-left: 1vmin;
+ padding-right: 1vmin; */
+
+ border-radius: 5px;
+ border: 0.25vmin solid #DBDBDB;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
}
.profile_info,
diff --git a/src/app/modules/profile/profile-info/profile-info.component.html b/src/app/modules/profile/profile-info/profile-info.component.html
index 9ff6a4e..1baaa75 100644
--- a/src/app/modules/profile/profile-info/profile-info.component.html
+++ b/src/app/modules/profile/profile-info/profile-info.component.html
@@ -23,7 +23,7 @@
<form>
<div class="form-group">
<input type="text" class="form-control" placeholder="Search a quiz..." formControlName="quizName" />
- <button class="btn btn-primary" type="submit">Search</button>
+ <button class="blueButton" type="submit">Search</button>
</div>
</form>
<div class="container">
@@ -31,7 +31,7 @@
<app-quiz-list [quizList]="quizList"></app-quiz-list>
</div>
<div class="new-quiz">
- <button class="btn btn-primary" (click)="newQuiz()">Create a new quiz</button>
+ <button class="blueButton" (click)="newQuiz()">Create a new quiz</button>
</div>
</div>
</div>
diff --git a/src/styles.css b/src/styles.css
index 5de4c26..66c2ea5 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -58,6 +58,9 @@ h1 {
}
.blueButton {
+ display: flex;
+ justify-content: center;
+ align-items: center;
background: #2B73FE;
color: #FFFFFF;
font-weight: bold;
@@ -68,13 +71,18 @@ h1 {
border-style: solid;
height: 100px;
width: 100%;
+ transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.blueButton:hover {
- background: #00B3F4;
+ background: #FFFFFF;
+ color: #2B73FE;
}
.whiteButton {
+ display: flex;
+ justify-content: center;
+ align-items: center;
background: #FFFFFF;
color: #2B73FE;
font-weight: bold;
@@ -85,6 +93,7 @@ h1 {
border-style: solid;
height: 100px;
width: 100%;
+ transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}
.whiteButton:hover {
--
GitLab
From d19c6e12567e7e0e40572f9310913cf1526ab83c Mon Sep 17 00:00:00 2001
From: D3B1RUM4N <elies1.mek03@gmail.com>
Date: Wed, 4 Dec 2024 22:55:41 +0100
Subject: [PATCH 04/10] style: header know where he at
---
src/app/app.component.ts | 8 ++++-
src/app/shared/header/header.component.css | 4 +++
src/app/shared/header/header.component.html | 14 ++++++---
src/app/shared/header/header.component.ts | 34 +++++++++++++++++++--
4 files changed, 53 insertions(+), 7 deletions(-)
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 7ac1d11..8dc304c 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -9,12 +9,18 @@ import { filter } from 'rxjs';
})
export class AppComponent implements OnInit {
playQuiz: boolean = false;
+ homePage: boolean = false;
+ communityPage: boolean = false;
+ profilePage: boolean = false;
- constructor(private router: Router, private route: ActivatedRoute) {}
+ constructor(private router: Router, private route: ActivatedRoute) { }
ngOnInit(): void {
this.router.events.pipe(filter((event) => event instanceof NavigationEnd)).subscribe(() => {
this.playQuiz = this.router.url.includes('play-quiz');
+ this.homePage = this.router.url.includes('home');
+ this.communityPage = this.router.url.includes('community');
+ this.profilePage = this.router.url.includes('profile');
});
}
}
diff --git a/src/app/shared/header/header.component.css b/src/app/shared/header/header.component.css
index da874bd..132e6ac 100644
--- a/src/app/shared/header/header.component.css
+++ b/src/app/shared/header/header.component.css
@@ -25,4 +25,8 @@ button {
button:hover {
color: #00B3F4;
+}
+
+.selected {
+ color: #00B3F4;
}
\ No newline at end of file
diff --git a/src/app/shared/header/header.component.html b/src/app/shared/header/header.component.html
index 0c2d044..b714272 100644
--- a/src/app/shared/header/header.component.html
+++ b/src/app/shared/header/header.component.html
@@ -1,5 +1,11 @@
<div class="header">
- <button [routerLink]="['/']">Home</button>
- <button [routerLink]="['/community']">Communauté</button>
- <button [routerLink]="['/profile']">Profile</button>
-</div>
+ <button (click)="navigate('/')" [ngClass]="{'selected': homePage}">
+ Home
+ </button>
+ <button (click)="navigate('/community')" [ngClass]="{'selected': communityPage}">
+ Communauté
+ </button>
+ <button (click)="navigate('/profile')" [ngClass]="{'selected': profilePage}">
+ Profile
+ </button>
+</div>
\ No newline at end of file
diff --git a/src/app/shared/header/header.component.ts b/src/app/shared/header/header.component.ts
index d61ed7c..55f74eb 100644
--- a/src/app/shared/header/header.component.ts
+++ b/src/app/shared/header/header.component.ts
@@ -1,8 +1,38 @@
-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
+import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
+import { filter } from 'rxjs';
@Component({
selector: 'app-header',
templateUrl: './header.component.html',
styleUrl: './header.component.css',
})
-export class HeaderComponent {}
+export class HeaderComponent {
+ homePage: boolean = false;
+ communityPage: boolean = false;
+ profilePage: boolean = false;
+
+ constructor(private router: Router, private route: ActivatedRoute) { }
+
+ ngOnInit(): void {
+ this.changeSelect();
+ }
+
+ changeSelect(): void {
+ this.router.events.pipe(filter((event) => event instanceof NavigationEnd)).subscribe(() => {
+ this.homePage = this.router.url.includes('home');
+ this.communityPage = this.router.url.includes('community');
+ this.profilePage = this.router.url.includes('profile');
+ });
+ }
+
+ navigate(route: string): void {
+ this.changeSelect();
+ console.log({
+ 'homePage': this.homePage,
+ 'communityPage': this.communityPage,
+ 'profilePage': this.profilePage,
+ });
+ this.router.navigate([route]);
+ }
+}
--
GitLab
From 1fa40b8054dece8ec59ddaa3079ad97b84d28975 Mon Sep 17 00:00:00 2001
From: D3B1RUM4N <elies1.mek03@gmail.com>
Date: Wed, 4 Dec 2024 22:55:55 +0100
Subject: [PATCH 05/10] feat: changed route for header
---
src/app/app-routing.module.ts | 4 ++++
1 file changed, 4 insertions(+)
diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index c919fdb..85cf345 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -9,6 +9,10 @@ import { CreateCustomQuizComponent } from './modules/profile/create-custom-quiz/
const routes: Routes = [
{
path: '',
+ redirectTo: 'home',
+ pathMatch: 'full', // Assurez-vous que pathMatch est défini sur 'full'
+ }, {
+ path: 'home',
component: HomePageComponent,
},
{
--
GitLab
From c67d100b5d3b21dd484b20f82393d5b7c33c0b87 Mon Sep 17 00:00:00 2001
From: mekhinini <elies.mekhinini@etu.unistra.fr>
Date: Thu, 5 Dec 2024 10:13:21 +0100
Subject: [PATCH 06/10] fix: fixed container size in profile
---
.../modules/profile/profile-info/profile-info.component.css | 5 +++++
1 file changed, 5 insertions(+)
diff --git a/src/app/modules/profile/profile-info/profile-info.component.css b/src/app/modules/profile/profile-info/profile-info.component.css
index 86d8b91..67023a4 100644
--- a/src/app/modules/profile/profile-info/profile-info.component.css
+++ b/src/app/modules/profile/profile-info/profile-info.component.css
@@ -41,6 +41,10 @@
border: 1vmin solid #F3F3F3;
}
+.grid .container {
+ height: 94%;
+}
+
.list-wrapper {
/* max-height: 95%; */
overflow-y: auto;
@@ -53,6 +57,7 @@
grid-template-columns: 2fr 1fr;
grid-gap: 0 1%;
width: 100%;
+ height: 10%;
}
hr {
--
GitLab
From 445eeea6ac2a5e92d1b728ae4756b1a1b1852434 Mon Sep 17 00:00:00 2001
From: mekhinini <elies.mekhinini@etu.unistra.fr>
Date: Thu, 5 Dec 2024 17:21:51 +0100
Subject: [PATCH 07/10] style: change input style and size
---
.../profile/profile-info/profile-info.component.css | 13 +------------
.../profile-info/profile-info.component.html | 4 ++--
src/styles.css | 4 ++++
3 files changed, 7 insertions(+), 14 deletions(-)
diff --git a/src/app/modules/profile/profile-info/profile-info.component.css b/src/app/modules/profile/profile-info/profile-info.component.css
index 67023a4..521531e 100644
--- a/src/app/modules/profile/profile-info/profile-info.component.css
+++ b/src/app/modules/profile/profile-info/profile-info.component.css
@@ -42,7 +42,7 @@
}
.grid .container {
- height: 94%;
+ height: 89%;
}
.list-wrapper {
@@ -53,9 +53,6 @@
}
.form-group {
- display: grid;
- grid-template-columns: 2fr 1fr;
- grid-gap: 0 1%;
width: 100%;
height: 10%;
}
@@ -80,14 +77,6 @@ input {
height: 3vmin;
margin-top: 0.5vmin;
margin-bottom: 0.5vmin;
- /*padding-left: 1vmin;
- padding-right: 1vmin; */
-
- border-radius: 5px;
- border: 0.25vmin solid #DBDBDB;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
}
.profile_info,
diff --git a/src/app/modules/profile/profile-info/profile-info.component.html b/src/app/modules/profile/profile-info/profile-info.component.html
index 1baaa75..7d98944 100644
--- a/src/app/modules/profile/profile-info/profile-info.component.html
+++ b/src/app/modules/profile/profile-info/profile-info.component.html
@@ -22,8 +22,8 @@
<!-- <form [formGroup]="form" (ngSubmit)="submitForm()"> -->
<form>
<div class="form-group">
- <input type="text" class="form-control" placeholder="Search a quiz..." formControlName="quizName" />
- <button class="blueButton" type="submit">Search</button>
+ <input type="text" class="inputRecherche" placeholder="Search a quiz..."
+ formControlName="quizName" />
</div>
</form>
<div class="container">
diff --git a/src/styles.css b/src/styles.css
index 66c2ea5..a89156e 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -130,4 +130,8 @@ h1 {
/* margin: 2%; */
padding: 20px;
font-size: 2vmin;
+
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
}
\ No newline at end of file
--
GitLab
From efd65a6ac185613af3109bc081d3ca82c524d09c Mon Sep 17 00:00:00 2001
From: mekhinini <elies.mekhinini@etu.unistra.fr>
Date: Thu, 5 Dec 2024 17:29:01 +0100
Subject: [PATCH 08/10] style: scroll bar general css
---
.../home/my-quiz/my-quiz.component.css | 29 +++++--------------
.../profile-info/profile-info.component.css | 2 +-
.../profile-info/profile-info.component.html | 2 +-
src/styles.css | 14 +++++++++
4 files changed, 24 insertions(+), 23 deletions(-)
diff --git a/src/app/modules/home/my-quiz/my-quiz.component.css b/src/app/modules/home/my-quiz/my-quiz.component.css
index 206c173..58c2d6d 100644
--- a/src/app/modules/home/my-quiz/my-quiz.component.css
+++ b/src/app/modules/home/my-quiz/my-quiz.component.css
@@ -18,7 +18,8 @@
.scrollable-list {
height: 45%;
width: 100%;
- overflow-y: auto; /* Ajoute une scrollbar verticale si nécessaire */
+ overflow-y: auto;
+ /* Ajoute une scrollbar verticale si nécessaire */
border: 4px solid #F3F3F3;
padding: 0;
border-radius: 10px;
@@ -26,31 +27,17 @@
}
-/* Optionnel: Personnalisation de la scrollbar */
-.scrollable-list::-webkit-scrollbar {
- width: 10px;
-}
-
-.scrollable-list::-webkit-scrollbar-thumb {
- background-color: #888;
- border-radius: 5px;
-}
-
-.scrollable-list::-webkit-scrollbar-thumb:hover {
- background-color: #555;
-}
-
input[type="radio"] {
display: none;
}
-.radio-label > h3{
+.radio-label>h3 {
margin: 10px 5px 5px 5px;
}
-.radio-label > p{
+.radio-label>p {
margin: 5px 5px 5px 10px;
-}
+}
/* Style for the custom buttons */
.radio-label {
@@ -67,11 +54,11 @@ input[type="radio"] {
align-items: center;
}
-input[type="radio"] + .radio-label:hover {
+input[type="radio"]+.radio-label:hover {
background-color: #e0e0e0;
-}
+}
-input[type="radio"]:checked + .radio-label {
+input[type="radio"]:checked+.radio-label {
color: #2B73FE;
}
diff --git a/src/app/modules/profile/profile-info/profile-info.component.css b/src/app/modules/profile/profile-info/profile-info.component.css
index 521531e..af925cf 100644
--- a/src/app/modules/profile/profile-info/profile-info.component.css
+++ b/src/app/modules/profile/profile-info/profile-info.component.css
@@ -45,7 +45,7 @@
height: 89%;
}
-.list-wrapper {
+.scrollable-list {
/* max-height: 95%; */
overflow-y: auto;
overflow-x: hidden;
diff --git a/src/app/modules/profile/profile-info/profile-info.component.html b/src/app/modules/profile/profile-info/profile-info.component.html
index 7d98944..fb6f56f 100644
--- a/src/app/modules/profile/profile-info/profile-info.component.html
+++ b/src/app/modules/profile/profile-info/profile-info.component.html
@@ -27,7 +27,7 @@
</div>
</form>
<div class="container">
- <div class="list-wrapper">
+ <div class="scrollable-list">
<app-quiz-list [quizList]="quizList"></app-quiz-list>
</div>
<div class="new-quiz">
diff --git a/src/styles.css b/src/styles.css
index a89156e..34bf365 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -134,4 +134,18 @@ h1 {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
+}
+
+/* scrollable lists */
+.scrollable-list::-webkit-scrollbar {
+ width: 10px;
+}
+
+.scrollable-list::-webkit-scrollbar-thumb {
+ background-color: #888;
+ border-radius: 5px;
+}
+
+.scrollable-list::-webkit-scrollbar-thumb:hover {
+ background-color: #555;
}
\ No newline at end of file
--
GitLab
From 72517f78afbb08205afe9563aea456d2961034ef Mon Sep 17 00:00:00 2001
From: mekhinini <elies.mekhinini@etu.unistra.fr>
Date: Thu, 5 Dec 2024 17:37:03 +0100
Subject: [PATCH 09/10] style: used component list for every list
---
src/app/modules/home/home.module.ts | 5 +-
.../home/my-quiz/my-quiz.component.html | 49 ++-----------------
.../modules/home/my-quiz/my-quiz.component.ts | 25 ++++++++++
3 files changed, 32 insertions(+), 47 deletions(-)
diff --git a/src/app/modules/home/home.module.ts b/src/app/modules/home/home.module.ts
index 375e09f..777ba3d 100644
--- a/src/app/modules/home/home.module.ts
+++ b/src/app/modules/home/home.module.ts
@@ -10,6 +10,7 @@ import { HomePageComponent } from './home-page/home-page.component';
import { BrowserModule } from '@angular/platform-browser';
import { FormPlayQuizComponent } from './form-play-quiz/form-play-quiz.component';
import { MatIconModule } from '@angular/material/icon';
+import { SharedModule } from '../../shared/shared.module';
@NgModule({
declarations: [
@@ -22,6 +23,6 @@ import { MatIconModule } from '@angular/material/icon';
FormPlayQuizComponent,
],
exports: [MultipleChoiceComponent],
- imports: [CommonModule, ReactiveFormsModule, BrowserModule, MatIconModule],
+ imports: [CommonModule, ReactiveFormsModule, BrowserModule, MatIconModule, SharedModule],
})
-export class HomeModule {}
+export class HomeModule { }
diff --git a/src/app/modules/home/my-quiz/my-quiz.component.html b/src/app/modules/home/my-quiz/my-quiz.component.html
index 82a39a1..8871ae4 100644
--- a/src/app/modules/home/my-quiz/my-quiz.component.html
+++ b/src/app/modules/home/my-quiz/my-quiz.component.html
@@ -1,49 +1,8 @@
<div class="container">
<p class="title">My recent quiz</p>
<input type="search" class="inputRecherche">
- <ul class="scrollable-list">
- <li class="listeItem">
- <input type="radio" id="option1" name="options" value="1">
- <label for="option1" class="radio-label">
- <h3>Video games</h3>
- <p>12/20 Questions | Medium</p>
- </label>
- </li>
- <li class="listeItem">
- <input type="radio" id="option2" name="options" value="2">
- <label for="option2" class="radio-label">
- <h3>Video games</h3>
- <p>12/20 Questions | Medium</p>
- </label>
- </li>
- <li class="listeItem">
- <input type="radio" id="option3" name="options" value="3">
- <label for="option3" class="radio-label">
- <h3>Video games</h3>
- <p>12/20 Questions | Medium</p>
- </label>
- </li>
- <li class="listeItem">
- <input type="radio" id="option4" name="options" value="4">
- <label for="option4" class="radio-label">
- <h3>Video games</h3>
- <p>12/20 Questions | Medium</p>
- </label>
- </li>
- <li class="listeItem">
- <input type="radio" id="option5" name="options" value="5">
- <label for="option5" class="radio-label">
- <h3>Video games</h3>
- <p>12/20 Questions | Medium</p>
- </label>
- </li>
- <li class="listeItem">
- <input type="radio" id="option6" name="options" value="6">
- <label for="option6" class="radio-label">
- <h3>Video games</h3>
- <p>12/20 Questions | Medium</p>
- </label>
- </li>
- </ul>
- <input type="submit" value="PLAY" class="blueButton">
+ <div class="scrollable-list">
+ <app-quiz-list [quizList]="quizList"></app-quiz-list>
+ </div>
+ <input type="submit" value="PLAY" class="blueButton">
</div>
\ No newline at end of file
diff --git a/src/app/modules/home/my-quiz/my-quiz.component.ts b/src/app/modules/home/my-quiz/my-quiz.component.ts
index 16d7ec7..ccd58a1 100644
--- a/src/app/modules/home/my-quiz/my-quiz.component.ts
+++ b/src/app/modules/home/my-quiz/my-quiz.component.ts
@@ -1,4 +1,5 @@
import { Component } from '@angular/core';
+import { Router } from '@angular/router';
@Component({
selector: 'app-my-quiz',
@@ -6,5 +7,29 @@ import { Component } from '@angular/core';
styleUrls: ['./my-quiz.component.css', '../../../../styles.css'],
})
export class MyQuizComponent {
+ quizList: any[] = [];
+ constructor(
+ private router: Router
+ ) { }
+
+ ngOnInit(): void {
+ this.quizList = [
+ { title: 'Quiz 1', content: 'Quiz 1 Content' },
+ { title: 'Quiz 2', content: 'Quiz 2 Content' },
+ { title: 'Quiz 3', content: 'Quiz 3 Content' },
+ { title: 'Quiz 4', content: 'Quiz 4 Content' },
+ { title: 'Quiz 5', content: 'Quiz 5 Content' },
+ { title: 'Quiz 6', content: 'Quiz 6 Content' },
+ { title: 'Quiz 7', content: 'Quiz 7 Content' },
+ { title: 'Quiz 8', content: 'Quiz 8 Content' },
+ { title: 'Quiz 9', content: 'Quiz 9 Content' },
+ { title: 'Quiz 10', content: 'Quiz 10 Content' },
+ { title: 'Quiz 11', content: 'Quiz 11 Content' },
+ { title: 'Quiz 12', content: 'Quiz 12 Content' },
+ { title: 'Quiz 13', content: 'Quiz 13 Content' },
+ { title: 'Quiz 14', content: 'Quiz 14 Content' },
+ { title: 'Quiz 15', content: 'Quiz 15 Content' }
+ ];
+ }
}
--
GitLab
From 96fbb2c1e6e440117f957846980698e0ffb7498f Mon Sep 17 00:00:00 2001
From: mekhinini <elies.mekhinini@etu.unistra.fr>
Date: Thu, 5 Dec 2024 17:41:30 +0100
Subject: [PATCH 10/10] fix: fix header navigation
---
src/app/shared/header/header.component.html | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/app/shared/header/header.component.html b/src/app/shared/header/header.component.html
index b714272..44a0c3c 100644
--- a/src/app/shared/header/header.component.html
+++ b/src/app/shared/header/header.component.html
@@ -1,5 +1,5 @@
<div class="header">
- <button (click)="navigate('/')" [ngClass]="{'selected': homePage}">
+ <button (click)="navigate('/home')" [ngClass]="{'selected': homePage}">
Home
</button>
<button (click)="navigate('/community')" [ngClass]="{'selected': communityPage}">
--
GitLab