+
+
+
+
+
+
+
+
diff --git a/admin/src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.scss b/admin/src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.scss
new file mode 100644
index 0000000..966c9a2
--- /dev/null
+++ b/admin/src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.scss
@@ -0,0 +1,61 @@
+.myContainer {
+ max-width: 100vw;
+ height: 100vh;
+ overflow-x: hidden;
+}
+
+
+.boite {
+ margin-left: auto;
+ margin-right: auto;
+ width: 25%;
+ margin-top: 10vh;
+ border: solid 3px;
+ border-radius: 10px;
+ padding: 20px 40px 20px 40px;
+ background-color: #ffffff;
+ text-align: center;
+ box-shadow: 10px 5px 5px black;
+}
+.lightTheme .boite {
+ border-color: black;
+}
+.darkTheme .boite {
+ border-color: white;
+}
+
+
+img {
+ margin: 0px 0px 10px 0px;
+ width: 5vw;
+ height: 5vw;
+ border: solid 2px black;
+ border-radius: 50%;
+ font-size: xxx-large;
+}
+
+
+.myRow {
+ margin: 15px 0px 15px 0px;
+}
+.myLabel {
+ text-align: right;
+ padding: 0px 5px 0px 0px;
+ margin: 0px;
+ font-weight: bold;
+}
+.myValue {
+ text-align: left;
+ padding: 0px 0px 0px 5px;
+ margin: 0px;
+}
+
+
+.btnContainer {
+ text-align: center;
+ margin-top: 40px;
+}
+.myBtn {
+ border: solid 1px black;
+ background-color: white;
+}
diff --git a/admin/src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.spec.ts b/admin/src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.spec.ts
new file mode 100644
index 0000000..39fbdd9
--- /dev/null
+++ b/admin/src/app/admin/myProfil/page-profil-admin/page-profil-admin.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageProfilAdminComponent } from './page-profil-admin.component';
+
+describe('PageProfilAdminComponent', () => {
+ let component: PageProfilAdminComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
+
+
+ Pseudo:
+ {{admin.login}}
+
+
+
+
+ Mail:
+ {{admin.email}}
+
+
+
+
+ Date de création:
+ {{admin.createdAt | date:'dd/LL/YYYY'}}
+
+
+
+
+
+
diff --git a/admin/src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.scss b/admin/src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.scss
new file mode 100644
index 0000000..1968e90
--- /dev/null
+++ b/admin/src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.scss
@@ -0,0 +1,33 @@
+.boite {
+ font-size: small;
+}
+
+button {
+ font-size: small;
+}
+
+img {
+ margin: 0px 0px 10px 0px;
+ width: 5vw;
+ height: 5vw;
+ border: solid 2px black;
+ border-radius: 50%;
+ font-size: xxx-large;
+}
+
+// -------------------------------------------------------------------------
+
+// aura
+::ng-deep .mat-checkbox-ripple .mat-ripple-element {
+ background-color: grey !important;
+}
+
+// contenu coche
+::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background {
+ background-color: black !important;
+}
+
+// indeterminate
+::ng-deep .mat-checkbox .mat-checkbox-frame {
+ background-color: white !important;
+}
diff --git a/admin/src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.spec.ts b/admin/src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.spec.ts
new file mode 100644
index 0000000..9f1a0f5
--- /dev/null
+++ b/admin/src/app/admin/myProfil/popup-update-admin/popup-update-admin.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PopupUpdateAdminComponent } from './popup-update-admin.component';
+
+describe('PopupUpdateAdminComponent', () => {
+ let component: PopupUpdateAdminComponent;
+ let fixture: ComponentFixture
+
+
+
+ + +
+ Pseudo
+
+
+ + +
+ + +
+
+
+
+ + +
+
+ ![]()
+ +
+
+
+ + +
+ + +
+ + +
+ + +
+ Modifier mot de passe:
+
+
+
+
+
+
+ Nouveau mot de passe
+
+
+
+ +
+ Confirmation nouveau mot de passe
+
+
+
+ + +
+ + +
+ {{errorMessage}}
+
+
+
+
+
+
+
+
+
+
diff --git a/admin/src/app/admin/userList/page-user-list/page-user-list.component.scss b/admin/src/app/admin/userList/page-user-list/page-user-list.component.scss
new file mode 100644
index 0000000..bbeac05
--- /dev/null
+++ b/admin/src/app/admin/userList/page-user-list/page-user-list.component.scss
@@ -0,0 +1,99 @@
+.myContainer {
+ min-height: 100vh;
+ font-size: small;
+}
+
+// ----------------------------------------------------------
+
+.filtersContainer {
+ width: 90%;
+ background-color: white;
+ padding: 10px 10px 10px 10px;
+}
+
+.myRow {
+ margin-left: 1%;
+}
+
+.textFilter {
+ width: 50%;
+ font-size: medium;
+ border-radius: 5px;
+}
+
+.btnAjouter {
+ background-color: white;
+ border: solid 1px black;
+}
+
+// ----------------------------------------------------------
+
+table {
+ margin: 0 auto;
+ width: 94%;
+ font-size: small;
+}
+.darkTheme table { border: solid 2px white; }
+
+th.mat-sort-header-sorted {
+ color: black;
+}
+
+td {
+ font-size: small;
+}
+
+// -------------------------------------------------------------------------
+
+::ng-deep .mat-radio-inner-circle {
+ color: black !important;
+ background-color: black !important;
+}
+
+::ng-deep .mat-radio-outer-circle{
+ color: black !important;
+ border: solid 1px gray !important;
+}
+
+// -------------------------------------------------------------------------
+
+
+// aura
+::ng-deep .mat-checkbox-ripple .mat-ripple-element {
+ background-color: grey !important;
+}
+
+// contenu coche
+::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background {
+ background-color: black !important;
+}
+
+// indeterminate
+::ng-deep .mat-checkbox .mat-checkbox-frame {
+ border: solid 1px black !important;
+ background-color: white !important;
+}
+
+
+// --------------------------------------------------------------------
+
+
+// rong gauche
+::ng-deep .mat-slide-toggle-thumb {
+ background-color: white !important;
+}
+
+// trait droite
+::ng-deep .mat-slide-toggle-bar {
+ background-color: gray !important;
+}
+
+// rond droite
+::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
+ background-color: white !important;
+}
+
+// trait gauche
+::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
+ background-color: cornflowerblue !important;
+}
diff --git a/admin/src/app/admin/userList/page-user-list/page-user-list.component.spec.ts b/admin/src/app/admin/userList/page-user-list/page-user-list.component.spec.ts
new file mode 100644
index 0000000..edbbffe
--- /dev/null
+++ b/admin/src/app/admin/userList/page-user-list/page-user-list.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageUserListComponent } from './page-user-list.component';
+
+describe('PageUserListComponent', () => {
+ let component: PageUserListComponent;
+ let fixture: ComponentFixture
+
+
+
+
+ + + + +
+
+
+
+
+ +
++ + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Filtre
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Utilisateur
+
+
+ Annonceur
+
+
+ Admin
+
+
+
+
+
+ +
+
+ actif
+non actif
+
+
+
+ +
+ Période de dernière connexion:
+
+ Date de début
+
+
+ -
+
+ Date de fin
+
+
+
+
+
+
+
+
+ |
+ |
+
+ |
+ Pseudo | ++ {{user.login}} + | ++ {{user.email}} + | +Date de naissance | +
+
+ |
+ Âge | +
+
+ |
+ Sexe | +
+ H
+ |
+ Centres d'intérêt | +
+
+ {{interest}},
+ |
+ Date de création | ++ {{ user.createdAt | date:'dd/LL/YYYY à HH:mm:ss' }} + | +Dernière connexion | ++ {{ user.lastConnexion | date:'dd/LL/YYYY à HH:mm:ss' }} + | +Accepté | +
+ |
+
|---|---|---|---|
| Aucune vidéo ne correspond au filtre: "{{input.value}}" | +
+
+ + +
+
+
+
+ + +
+ + + + + + +
+ + +
+
+
+
+
+
+
+
+
+ Utilisateur
+ Annonceur
+ Admin
+
+
+
+
+ + +
+ + + + + + +
+ + +
+ {{errorMessage}}
+
+
+
+
+
+
+
+
+
+ ![]()
+ +
+ +
+ +
+
+
+
+
+
+
+
+ Email
+
+
+ + +
+ Pseudo
+
+
+ + +
+ Mot de passe
+
+
+ + +
+ Confirmation mot de passe
+
+
+
+
+
+
+ + + +
+ + +
+ + +
+
+
+
+ Date de naissance
+
+
+ + +
+ Homme
+ Femme
+
+
+ + +
+
+ + + +
+ + +
+ ![]()
+ +
+ +
+ + + +
+
+
+
+
+
+
+
+
+ Email
+
+
+ +
+ Pseudo
+
+
+ +
+ Entreprise
+
+
+
+
+
+ + +
+ +
+
+
+
+ Mot de passe
+
+
+ +
+ Confirmation nouveau mot de passe
+
+
+
+
+ + +
+
diff --git a/admin/src/app/beforeConnexion/login/page-login/page-login.component.scss b/admin/src/app/beforeConnexion/login/page-login/page-login.component.scss
new file mode 100644
index 0000000..8924202
--- /dev/null
+++ b/admin/src/app/beforeConnexion/login/page-login/page-login.component.scss
@@ -0,0 +1,271 @@
+html {
+ background-color: #56baed;
+}
+
+body {
+ font-family: "Poppins", sans-serif;
+ height: 100vh;
+}
+
+a {
+ color: #5E89FF;
+ display:inline-block;
+ text-decoration: none;
+ font-weight: 400;
+}
+
+h2 {
+ text-align: center;
+ font-size: 16px;
+ font-weight: 600;
+ text-transform: uppercase;
+ display:inline-block;
+ margin: 40px 8px 10px 8px;
+ color: #cccccc;
+}
+
+
+
+/* STRUCTURE */
+
+.wrapper {
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+ width: 100%;
+ min-height: 80%;
+ padding: 20px;
+}
+
+#formContent {
+ -webkit-border-radius: 10px 10px 10px 10px;
+ border-radius: 10px 10px 10px 10px;
+ background: #fff;
+ padding: 30px;
+ width: 90%;
+ max-width: 450px;
+ position: relative;
+ padding: 0px;
+ -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
+ box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
+ text-align: center;
+}
+
+#formFooter {
+ background-color: #f6f6f6;
+ border-top: 1px solid #dce8f1;
+ padding: 25px;
+ text-align: center;
+ -webkit-border-radius: 0 0 10px 10px;
+ border-radius: 0 0 10px 10px;
+}
+
+
+
+/* TABS */
+
+h2.inactive {
+ color: #cccccc;
+}
+
+h2.active {
+ color: #0d0d0d;
+ border-bottom: 2px solid #5fbae9;
+}
+
+
+
+/* FORM TYPOGRAPHY*/
+
+input[type=button], input[type=submit], input[type=reset] {
+ background-color: #5E89FF;
+ border: none;
+ color: white;
+ padding: 15px 80px;
+ text-align: center;
+ text-decoration: none;
+ display: inline-block;
+ text-transform: uppercase;
+ font-size: 13px;
+ -webkit-box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
+ box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
+ -webkit-border-radius: 5px 5px 5px 5px;
+ border-radius: 5px 5px 5px 5px;
+ margin: 5px 20px 40px 20px;
+ -webkit-transition: all 0.3s ease-in-out;
+ -moz-transition: all 0.3s ease-in-out;
+ -ms-transition: all 0.3s ease-in-out;
+ -o-transition: all 0.3s ease-in-out;
+ transition: all 0.3s ease-in-out;
+}
+
+input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
+ background-color: #39ace7;
+}
+
+input[type=button]:active, input[type=submit]:active, input[type=reset]:active {
+ -moz-transform: scale(0.95);
+ -webkit-transform: scale(0.95);
+ -o-transform: scale(0.95);
+ -ms-transform: scale(0.95);
+ transform: scale(0.95);
+}
+
+input[type=text], input[type=password] {
+ background-color: #f6f6f6;
+ border: none;
+ color: #0d0d0d;
+ padding: 15px 32px;
+ text-align: center;
+ text-decoration: none;
+ display: inline-block;
+ font-size: 16px;
+ margin: 5px;
+ width: 85%;
+ border: 2px solid #f6f6f6;
+ -webkit-transition: all 0.5s ease-in-out;
+ -moz-transition: all 0.5s ease-in-out;
+ -ms-transition: all 0.5s ease-in-out;
+ -o-transition: all 0.5s ease-in-out;
+ transition: all 0.5s ease-in-out;
+ -webkit-border-radius: 5px 5px 5px 5px;
+ border-radius: 5px 5px 5px 5px;
+}
+
+
+
+input[type=text]:focus, input[type=password]:focus {
+ background-color: #fff;
+ border-bottom: 2px solid #5fbae9;
+}
+
+input[type=text]::placeholder, input[type=password]::placeholder {
+ color: #cccccc;
+}
+
+.bg{
+ margin: 0;
+ padding: 0;
+ height: 100vh;
+ width: 100vw;
+ overflow-y: hidden;
+ overflow-x: hidden;
+}
+
+/* ANIMATIONS */
+
+/* Simple CSS3 Fade-in-down Animation */
+.fadeInDown {
+ -webkit-animation-name: fadeInDown;
+ animation-name: fadeInDown;
+ -webkit-animation-duration: 1s;
+ animation-duration: 1s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both;
+}
+
+@-webkit-keyframes fadeInDown {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none;
+ }
+}
+
+@keyframes fadeInDown {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none;
+ }
+}
+
+/* Simple CSS3 Fade-in Animation */
+@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
+@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
+@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
+
+.fadeIn {
+ opacity:0;
+ -webkit-animation:fadeIn ease-in 1;
+ -moz-animation:fadeIn ease-in 1;
+ animation:fadeIn ease-in 1;
+
+ -webkit-animation-fill-mode:forwards;
+ -moz-animation-fill-mode:forwards;
+ animation-fill-mode:forwards;
+
+ -webkit-animation-duration:1s;
+ -moz-animation-duration:1s;
+ animation-duration:1s;
+}
+
+.fadeIn.first {
+ -webkit-animation-delay: 0.4s;
+ -moz-animation-delay: 0.4s;
+ animation-delay: 0.4s;
+}
+
+.fadeIn.second {
+ -webkit-animation-delay: 0.6s;
+ -moz-animation-delay: 0.6s;
+ animation-delay: 0.6s;
+}
+
+.fadeIn.third {
+ -webkit-animation-delay: 0.8s;
+ -moz-animation-delay: 0.8s;
+ animation-delay: 0.8s;
+}
+
+.fadeIn.fourth {
+ -webkit-animation-delay: 1s;
+ -moz-animation-delay: 1s;
+ animation-delay: 1s;
+}
+
+/* Simple CSS3 Fade-in Animation */
+.underlineHover:after {
+ display: block;
+ left: 0;
+ bottom: -10px;
+ width: 0;
+ height: 2px;
+ //background-color: #5E89FF;
+ background-color: #5E89FF;
+ content: "";
+ transition: width 0.2s;
+}
+
+.underlineHover:hover {
+ color: #0d0d0d;
+}
+
+.underlineHover:hover:after{
+ width: 100%;
+}
+
+h1{
+ color: black;
+}
+
+/* OTHERS */
+
+*:focus {
+ outline: none;
+}
+
+#icon {
+ width:30%;
+}
diff --git a/admin/src/app/beforeConnexion/login/page-login/page-login.component.spec.ts b/admin/src/app/beforeConnexion/login/page-login/page-login.component.spec.ts
new file mode 100644
index 0000000..a4ee677
--- /dev/null
+++ b/admin/src/app/beforeConnexion/login/page-login/page-login.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageLoginComponent } from './page-login.component';
+
+describe('PageLoginComponent', () => {
+ let component: PageLoginComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+ StreamNotFound
+
+ Récupération du mot de passe
+ ++ + +
+
+ Email
+
+
+
+
+
+
+ {{errorMessage}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
++
+
+
+
+
+
+ Pseudo
+
+
+
+ + +
+ Mot de passe
+
+
+
+ + +
+ Confirmation mot de passe
+
+
+
+
+
+ Compte
+ + ++ + +
+ + +
+
+ Email
+
+
+
+ + +
+ Homme
+ Femme
+
+
+ + +
+ Date de naissance
+
+
+
+
+
+
+ Informations personelles
+ + ++ + +
+ + +
+ + +
+ + +
+ + +
+ + +
+ Votre inscription a bien été effectuée. +
+ ++ Votre inscription est en cours de validation. +
+ +
+
+
diff --git a/admin/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.scss b/admin/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.scss
new file mode 100644
index 0000000..85730e0
--- /dev/null
+++ b/admin/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.scss
@@ -0,0 +1,7 @@
+p {
+ font-size: small;
+}
+
+div {
+ font-size: small;
+}
diff --git a/admin/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.spec.ts b/admin/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.spec.ts
new file mode 100644
index 0000000..d6f9908
--- /dev/null
+++ b/admin/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PopupConfirmationComponent } from './popup-confirmation.component';
+
+describe('PopupConfirmationComponent', () => {
+ let component: PopupConfirmationComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+
diff --git a/admin/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.scss b/admin/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.scss
new file mode 100644
index 0000000..e1fefaa
--- /dev/null
+++ b/admin/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.scss
@@ -0,0 +1,79 @@
+.navbar {
+ background-color: black;
+ height: 60px;
+ font-size: medium;
+ color: white;
+}
+
+
+.navbar-expand-lg {
+ border-bottom: solid;
+ border-color: white;
+ border-bottom-width: 2px;
+}
+
+
+// PolyNotFound
+.navbar-brand {
+ font-family: cursive;
+ font-weight: bold;
+ font-size: x-large;
+ margin-left: 15px;
+ color: white;
+}
+
+
+// Recherche, Mes Playlists, Historique
+.nav-link {
+ color: white;
+}
+.nav-link:hover {
+ color: grey;
+}
+
+
+// Bonton deconnexion
+.btnDeconnexion {
+ font-size: medium;
+ margin: 0px 10px 0px 10px
+}
+.btnDeconnexion:hover {
+ color: grey;
+}
+
+
+.monLi {
+ margin: 0px 10px 0px 10px;
+}
+
+
+img {
+ border: solid 2px white;
+ border-radius: 50px;
+ margin: 0px 10px 0px 15px;
+ width: 40px;
+ height: 40px;
+}
+img:hover {
+ cursor: pointer;
+}
+
+
+// --------------------------------------------------------------------
+
+
+::ng-deep .mat-slide-toggle-thumb {
+ background-color: #c8c8c8;
+}
+
+::ng-deep .mat-slide-toggle-bar {
+ background-color: #ffffff;
+}
+
+::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
+ background-color: #ffffff;
+}
+
+::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
+ background-color: #646464;
+}
diff --git a/admin/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.spec.ts b/admin/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.spec.ts
new file mode 100644
index 0000000..f3f7f27
--- /dev/null
+++ b/admin/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NavbarBeforeConnexionComponent } from './navbar-before-connexion.component';
+
+describe('NavbarBeforeConnexionComponent', () => {
+ let component: NavbarBeforeConnexionComponent;
+ let fixture: ComponentFixture
+
+ 
+
+
+Images
+
+ Glisser déposer
+ ou
+ Cliquer pour selectionner
+
+ info
+
+
+
+
diff --git a/userAndAdvertiser/src/app/advertiser/adList/drag-and-drop/drag-and-drop.component.scss b/userAndAdvertiser/src/app/advertiser/adList/drag-and-drop/drag-and-drop.component.scss
new file mode 100644
index 0000000..91899f6
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/adList/drag-and-drop/drag-and-drop.component.scss
@@ -0,0 +1,135 @@
+.container {
+ width: 450px;
+ height: 180px;
+ padding: 20px 0px 20px 0px;
+ text-align: center;
+ border: dashed 1px #979797;
+ position: relative;
+ margin: 0 auto;
+}
+
+input {
+ opacity: 0;
+ position: absolute;
+ z-index: 2;
+ width: 100%;
+ height: 100%;
+ top: 0;
+ left: 0;
+}
+
+
+.fileover {
+ animation: shake 1s;
+ animation-iteration-count: infinite;
+}
+
+.files-list {
+ margin-top: 1.5rem;
+
+ .single-file {
+ display: flex;
+ padding: 0.5rem;
+ justify-content: space-between;
+ align-items: center;
+ border: dashed 1px #979797;
+ margin-bottom: 1rem;
+
+ img.delete {
+ margin-left: 0.5rem;
+ cursor: pointer;
+ align-self: flex-end;
+ }
+
+
+ display: flex;
+ flex-grow: 1;
+
+ .name {
+ font-size: 14px;
+ font-weight: 500;
+ color: #353f4a;
+ margin: 0;
+ }
+
+ .size {
+ font-size: 12px;
+ font-weight: 500;
+ color: #a4a4a4;
+ margin: 0;
+ margin-bottom: 0.25rem;
+ }
+
+ .info {
+ width: 100%
+ }
+ }
+}
+
+/* Shake animation */
+@keyframes shake {
+ 0% {
+ transform: translate(1px, 1px) rotate(0deg);
+ }
+
+ 10% {
+ transform: translate(-1px, -2px) rotate(-1deg);
+ }
+
+ 20% {
+ transform: translate(-3px, 0px) rotate(1deg);
+ }
+
+ 30% {
+ transform: translate(3px, 2px) rotate(0deg);
+ }
+
+ 40% {
+ transform: translate(1px, -1px) rotate(1deg);
+ }
+
+ 50% {
+ transform: translate(-1px, 2px) rotate(-1deg);
+ }
+
+ 60% {
+ transform: translate(-3px, 1px) rotate(0deg);
+ }
+
+ 70% {
+ transform: translate(3px, 1px) rotate(-1deg);
+ }
+
+ 80% {
+ transform: translate(-1px, -1px) rotate(1deg);
+ }
+
+ 90% {
+ transform: translate(1px, 2px) rotate(0deg);
+ }
+
+ 100% {
+ transform: translate(1px, -2px) rotate(-1deg);
+ }
+}
+
+
+.progress-cont {
+ height: 7px;
+ width: 100%;
+ border-radius: 4px;
+ background-color: #d0d0d0;
+ position: relative;
+
+ .progress {
+ width: 0;
+ height: 100%;
+ position: absolute;
+ z-index: 1;
+ top: 0;
+ left: 0;
+ border-radius: 4px;
+ background-color: #4c97cb;
+ transition: 0.5s all;
+ }
+}
diff --git a/userAndAdvertiser/src/app/advertiser/adList/drag-and-drop/drag-and-drop.component.spec.ts b/userAndAdvertiser/src/app/advertiser/adList/drag-and-drop/drag-and-drop.component.spec.ts
new file mode 100644
index 0000000..e4666b0
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/adList/drag-and-drop/drag-and-drop.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DragAndDropComponent } from './drag-and-drop.component';
+
+describe('DragAndDropComponent', () => {
+ let component: DragAndDropComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+ + {{ file?.name }} +
++ {{ formatBytes(file?.size) }} +
+
+
+
+
+
+
diff --git a/userAndAdvertiser/src/app/advertiser/adList/page-ad-list-advertiser/page-ad-list-advertiser.component.scss b/userAndAdvertiser/src/app/advertiser/adList/page-ad-list-advertiser/page-ad-list-advertiser.component.scss
new file mode 100644
index 0000000..370e312
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/adList/page-ad-list-advertiser/page-ad-list-advertiser.component.scss
@@ -0,0 +1,87 @@
+.myContainer {
+ max-width: 100vw;
+ height: 100vh;
+ overflow-x: hidden;
+ font-size: small;
+}
+
+
+// ----------------------------------------------------------
+
+
+.filtersContainer {
+ width: 95%;
+ background-color: white;
+ padding: 10px 10px 10px 10px;
+}
+
+.myRow {
+ margin-left: 1%;
+}
+
+.textFilter {
+ width: 50%;
+ font-size: medium;
+ border-radius: 5px;
+}
+
+.btnAjouter {
+ background-color: white;
+ border: solid 1px black;
+}
+
+
+// ----------------------------------------------------------
+
+
+table {
+ margin: 0 auto;
+ width: 94%;
+ font-size: small;
+}
+.darkTheme table { border: solid 2px white; }
+
+th.mat-sort-header-sorted {
+ color: black;
+}
+
+td {
+ font-size: small;
+}
+
+input {
+ width: 30%;
+ font-size: large;
+ border-radius: 5px;
+}
+
+
+// --------------------------------------------------------------------
+
+
+// rong gauche
+::ng-deep .mat-slide-toggle-thumb {
+ background-color: white !important;
+}
+
+// trait droite
+::ng-deep .mat-slide-toggle-bar {
+ background-color: gray !important;
+}
+
+// rond droite
+::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
+ background-color: white !important;
+}
+
+// trait gauche
+::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
+ background-color: cornflowerblue !important;
+}
+
+
+// -------------------------------------------------------------------------
+
+::ng-deep .mat-pseudo-checkbox-checked {
+ background-color: black !important;
+}
diff --git a/userAndAdvertiser/src/app/advertiser/adList/page-ad-list-advertiser/page-ad-list-advertiser.component.spec.ts b/userAndAdvertiser/src/app/advertiser/adList/page-ad-list-advertiser/page-ad-list-advertiser.component.spec.ts
new file mode 100644
index 0000000..9492c6c
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/adList/page-ad-list-advertiser/page-ad-list-advertiser.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageAdListAdvertiserComponent } from './page-ad-list-advertiser.component';
+
+describe('PageAdvertiserComponent', () => {
+ let component: PageAdListAdvertiserComponent;
+ let fixture: ComponentFixture
+
+
+
+
+ + + + + + +
+
+
+
+
+ +
++ + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Filtre
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ visible
+non visible
+
+
+
+
+ +
+
+ Sujets
+
+
+ {{formControlInterests.value ? formControlInterests.value[0] : ''}}
+
+ (+{{formControlInterests.value.length - 1}} {{formControlInterests.value?.length === 2 ? 'autre' : 'autres'}})
+
+
+ {{topping}}
+
+
+
+
+
+
+
+
+ Période de création:
+
+ Date de début
+
+
+ -
+
+ Date de fin
+
+
+
+
+
+
+
+
+ |
+ |
+
+ |
+ Titre | ++ {{advert.title}} + | +Sujets | ++ + {{interest}}, + {{interest}} + + | +Date de création | ++ {{ advert.createdAt | date:'dd/LL/YYYY à HH:mm:ss' }} + | +Dernière modification | ++ {{ advert.updatedAt | date:'dd/LL/YYYY à HH:mm:ss' }} + | +Vues | ++ {{advert.countViews}} + | +Actions | ++ + + + | +
|---|---|---|---|
| Aucune vidéo ne correspond au filtre: "{{input.value}}" | +
+
+ + +
+
diff --git a/userAndAdvertiser/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.scss b/userAndAdvertiser/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.scss
new file mode 100644
index 0000000..3bb2eed
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.scss
@@ -0,0 +1,90 @@
+.myContainer1 {
+ padding: 10px 10px 0px 25px;
+ margin: 0px 0px 0px 0px;
+ font-size: small;
+}
+
+
+.myContainer2 {
+ padding: 0px 0px 0px 0px;
+ margin: 0px 0px 0px 0px;
+ overflow-y: hidden;
+ overflow-x: hidden;
+ -ms-overflow-style: none;
+ scrollbar-width: none;
+}
+.myContainer2::-webkit-scrollbar {
+ display: none;
+}
+
+
+
+h1 {
+ text-align: center;
+ font-size: large;
+}
+
+.col-6, .col-8 {
+ border-left: solid 1px #a4a4a4;
+}
+
+
+// -------------------------------------------------------------------------
+
+.titleContainer {
+ width: 100%;
+}
+
+.commentContainer {
+ width: 100%;
+}
+
+.imageContainer {
+ border: solid 1px grey;
+}
+
+mat-dialog-actions {
+ margin-bottom: 0px;
+}
+
+button {
+ font-size: small;
+}
+
+
+// -------------------------------------------------------------------------
+// --- LightTheme ---
+
+// aura
+.lightTheme ::ng-deep .mat-checkbox-ripple .mat-ripple-element {
+ background-color: grey !important;
+}
+
+// contenu coche
+.lightTheme ::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background {
+ background-color: black !important;
+}
+
+// indeterminate
+.lightTheme ::ng-deep .mat-checkbox .mat-checkbox-frame {
+ border-color: black !important;
+ background-color: white !important;
+}
+
+// --- DarkTheme ---
+
+// aura
+.darTheme ::ng-deep .mat-checkbox-ripple .mat-ripple-element {
+ background-color: grey !important;
+}
+
+// contenu coche
+.darkTheme ::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background {
+ background-color: black !important;
+}
+
+// indeterminate
+.darkTheme ::ng-deep .mat-checkbox .mat-checkbox-frame {
+ border-color: white !important;
+ //background-color: white !important;
+}
diff --git a/userAndAdvertiser/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.spec.ts b/userAndAdvertiser/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.spec.ts
new file mode 100644
index 0000000..ba74952
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/adList/popup-add-or-update-ad/popup-add-or-update-ad.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PopupAddOrUpdateAdComponent } from './popup-add-or-update-ad.component';
+
+describe('PopupAddOrUpdateAdComponent', () => {
+ let component: PopupAddOrUpdateAdComponent;
+ let fixture: ComponentFixture
+
+
+
+ + + +
+
+
+
+
+
+
+{{title}}
+ + ++ + + +
+
+
+
+
+
+
+
+
+
+ Titre annonce
+
+
+
+
+
+ Commentaire
+
+
+ + +
+ URL
+
+
+ + + Visible
+ + +
+
+
+
+
+ + + +
+ + +
+ + +
+
+
+
+ Images déjà associées:
+
+
+
+
+
+ {{image.description}}
+
+
+
+
+ {{errorMessage}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/userAndAdvertiser/src/app/advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component.scss b/userAndAdvertiser/src/app/advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component.scss
new file mode 100644
index 0000000..3e00dee
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component.scss
@@ -0,0 +1,28 @@
+.lightTheme, .darkTheme {
+ background-image: none;
+}
+
+
+h1 {
+ text-align: center;
+ font-size: xx-large;
+}
+
+
+.myRow {
+ margin: 15px 0px 15px 0px;
+}
+
+
+.myLabel {
+ text-align: right;
+ padding: 0px 5px 0px 0px;
+ margin: 0px;
+ font-weight: bold;
+}
+
+.myValue {
+ text-align: left;
+ padding: 0px 0px 0px 5px;
+ margin: 0px;
+}
diff --git a/userAndAdvertiser/src/app/advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component.spec.ts b/userAndAdvertiser/src/app/advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component.spec.ts
new file mode 100644
index 0000000..56aedbc
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/adList/popup-visualize-ad-advertiser/popup-visualize-ad-advertiser.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PopupVisualizeAdAdvertiserComponent } from './popup-visualize-ad-advertiser.component';
+
+describe('PopupVisualizeAdComponent', () => {
+ let component: PopupVisualizeAdAdvertiserComponent;
+ let fixture: ComponentFixture{{advert.title}}
+ + + +
+
+
+
+ Images:
+
+
+ {{image.url}}
+
+
+
+
+ Centre d'intérêt :
+
+
+ • {{tag}}
+
+
+
+
+ Commentaire:
+ {{advert.comment}}
+
+
+
+
+
+ {{advert.views}}
+
+
+
+
+
+
+ {{ advert.createdAt | date:'dd/LL/YYYY à HH:mm:ss' }}
+
+
+
+
+
+
+
+ {{ advert.updatedAt | date:'dd/LL/YYYY à HH:mm:ss' }}
+
+
+
+
+
+
+ checked
+ close
+
+
+
+
+
+
+
+
+
+
diff --git a/userAndAdvertiser/src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.scss b/userAndAdvertiser/src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.scss
new file mode 100644
index 0000000..966c9a2
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.scss
@@ -0,0 +1,61 @@
+.myContainer {
+ max-width: 100vw;
+ height: 100vh;
+ overflow-x: hidden;
+}
+
+
+.boite {
+ margin-left: auto;
+ margin-right: auto;
+ width: 25%;
+ margin-top: 10vh;
+ border: solid 3px;
+ border-radius: 10px;
+ padding: 20px 40px 20px 40px;
+ background-color: #ffffff;
+ text-align: center;
+ box-shadow: 10px 5px 5px black;
+}
+.lightTheme .boite {
+ border-color: black;
+}
+.darkTheme .boite {
+ border-color: white;
+}
+
+
+img {
+ margin: 0px 0px 10px 0px;
+ width: 5vw;
+ height: 5vw;
+ border: solid 2px black;
+ border-radius: 50%;
+ font-size: xxx-large;
+}
+
+
+.myRow {
+ margin: 15px 0px 15px 0px;
+}
+.myLabel {
+ text-align: right;
+ padding: 0px 5px 0px 0px;
+ margin: 0px;
+ font-weight: bold;
+}
+.myValue {
+ text-align: left;
+ padding: 0px 0px 0px 5px;
+ margin: 0px;
+}
+
+
+.btnContainer {
+ text-align: center;
+ margin-top: 40px;
+}
+.myBtn {
+ border: solid 1px black;
+ background-color: white;
+}
diff --git a/userAndAdvertiser/src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.spec.ts b/userAndAdvertiser/src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.spec.ts
new file mode 100644
index 0000000..ebb9617
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/myProfil/page-profil-advertiser/page-profil-advertiser.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageProfilAdvertiserComponent } from './page-profil-advertiser.component';
+
+describe('PageProfilAdvertiserComponent', () => {
+ let component: PageProfilAdvertiserComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
+
+
+ Entreprise:
+ {{advertiser.company}}
+
+
+
+
+ Pseudo:
+ {{advertiser.login}}
+
+
+
+
+ Mail:
+ {{advertiser.email}}
+
+
+
+
+ Date de création:
+ {{advertiser.createdAt | date:'dd/LL/YYYY'}}
+
+
+
+
+
+
diff --git a/userAndAdvertiser/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.scss b/userAndAdvertiser/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.scss
new file mode 100644
index 0000000..1968e90
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.scss
@@ -0,0 +1,33 @@
+.boite {
+ font-size: small;
+}
+
+button {
+ font-size: small;
+}
+
+img {
+ margin: 0px 0px 10px 0px;
+ width: 5vw;
+ height: 5vw;
+ border: solid 2px black;
+ border-radius: 50%;
+ font-size: xxx-large;
+}
+
+// -------------------------------------------------------------------------
+
+// aura
+::ng-deep .mat-checkbox-ripple .mat-ripple-element {
+ background-color: grey !important;
+}
+
+// contenu coche
+::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background {
+ background-color: black !important;
+}
+
+// indeterminate
+::ng-deep .mat-checkbox .mat-checkbox-frame {
+ background-color: white !important;
+}
diff --git a/userAndAdvertiser/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.spec.ts b/userAndAdvertiser/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.spec.ts
new file mode 100644
index 0000000..dde7ef9
--- /dev/null
+++ b/userAndAdvertiser/src/app/advertiser/myProfil/popup-update-advertiser/popup-update-advertiser.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PopupUpdateAdvertiserComponent } from './popup-update-advertiser.component';
+
+describe('PopupUpdateAdvertiserComponent', () => {
+ let component: PopupUpdateAdvertiserComponent;
+ let fixture: ComponentFixture
+
+
+
+ + +
+ Entreprise
+
+
+ + +
+ Pseudo
+
+
+ + +
+ + +
+
+
+
+ + +
+
+ ![]()
+ +
+
+
+ + +
+ + +
+ + +
+ + +
+ + +
+ Modifier mot de passe:
+
+
+
+
+
+
+ Nouveau mot de passe
+
+
+
+ +
+ Confirmation nouveau mot de passe
+
+
+
+ + +
+ + +
+ {{errorMessage}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + +
+ +
+
+
+
+
+ Filtre
+
+ + + + +
+ +
+
+
+
+
+
+
+
+
+ + + + +
+
diff --git a/userAndAdvertiser/src/app/beforeConnexion/login/page-login/page-login.component.scss b/userAndAdvertiser/src/app/beforeConnexion/login/page-login/page-login.component.scss
new file mode 100644
index 0000000..8924202
--- /dev/null
+++ b/userAndAdvertiser/src/app/beforeConnexion/login/page-login/page-login.component.scss
@@ -0,0 +1,271 @@
+html {
+ background-color: #56baed;
+}
+
+body {
+ font-family: "Poppins", sans-serif;
+ height: 100vh;
+}
+
+a {
+ color: #5E89FF;
+ display:inline-block;
+ text-decoration: none;
+ font-weight: 400;
+}
+
+h2 {
+ text-align: center;
+ font-size: 16px;
+ font-weight: 600;
+ text-transform: uppercase;
+ display:inline-block;
+ margin: 40px 8px 10px 8px;
+ color: #cccccc;
+}
+
+
+
+/* STRUCTURE */
+
+.wrapper {
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: center;
+ width: 100%;
+ min-height: 80%;
+ padding: 20px;
+}
+
+#formContent {
+ -webkit-border-radius: 10px 10px 10px 10px;
+ border-radius: 10px 10px 10px 10px;
+ background: #fff;
+ padding: 30px;
+ width: 90%;
+ max-width: 450px;
+ position: relative;
+ padding: 0px;
+ -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
+ box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
+ text-align: center;
+}
+
+#formFooter {
+ background-color: #f6f6f6;
+ border-top: 1px solid #dce8f1;
+ padding: 25px;
+ text-align: center;
+ -webkit-border-radius: 0 0 10px 10px;
+ border-radius: 0 0 10px 10px;
+}
+
+
+
+/* TABS */
+
+h2.inactive {
+ color: #cccccc;
+}
+
+h2.active {
+ color: #0d0d0d;
+ border-bottom: 2px solid #5fbae9;
+}
+
+
+
+/* FORM TYPOGRAPHY*/
+
+input[type=button], input[type=submit], input[type=reset] {
+ background-color: #5E89FF;
+ border: none;
+ color: white;
+ padding: 15px 80px;
+ text-align: center;
+ text-decoration: none;
+ display: inline-block;
+ text-transform: uppercase;
+ font-size: 13px;
+ -webkit-box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
+ box-shadow: 0 10px 30px 0 rgba(95,186,233,0.4);
+ -webkit-border-radius: 5px 5px 5px 5px;
+ border-radius: 5px 5px 5px 5px;
+ margin: 5px 20px 40px 20px;
+ -webkit-transition: all 0.3s ease-in-out;
+ -moz-transition: all 0.3s ease-in-out;
+ -ms-transition: all 0.3s ease-in-out;
+ -o-transition: all 0.3s ease-in-out;
+ transition: all 0.3s ease-in-out;
+}
+
+input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
+ background-color: #39ace7;
+}
+
+input[type=button]:active, input[type=submit]:active, input[type=reset]:active {
+ -moz-transform: scale(0.95);
+ -webkit-transform: scale(0.95);
+ -o-transform: scale(0.95);
+ -ms-transform: scale(0.95);
+ transform: scale(0.95);
+}
+
+input[type=text], input[type=password] {
+ background-color: #f6f6f6;
+ border: none;
+ color: #0d0d0d;
+ padding: 15px 32px;
+ text-align: center;
+ text-decoration: none;
+ display: inline-block;
+ font-size: 16px;
+ margin: 5px;
+ width: 85%;
+ border: 2px solid #f6f6f6;
+ -webkit-transition: all 0.5s ease-in-out;
+ -moz-transition: all 0.5s ease-in-out;
+ -ms-transition: all 0.5s ease-in-out;
+ -o-transition: all 0.5s ease-in-out;
+ transition: all 0.5s ease-in-out;
+ -webkit-border-radius: 5px 5px 5px 5px;
+ border-radius: 5px 5px 5px 5px;
+}
+
+
+
+input[type=text]:focus, input[type=password]:focus {
+ background-color: #fff;
+ border-bottom: 2px solid #5fbae9;
+}
+
+input[type=text]::placeholder, input[type=password]::placeholder {
+ color: #cccccc;
+}
+
+.bg{
+ margin: 0;
+ padding: 0;
+ height: 100vh;
+ width: 100vw;
+ overflow-y: hidden;
+ overflow-x: hidden;
+}
+
+/* ANIMATIONS */
+
+/* Simple CSS3 Fade-in-down Animation */
+.fadeInDown {
+ -webkit-animation-name: fadeInDown;
+ animation-name: fadeInDown;
+ -webkit-animation-duration: 1s;
+ animation-duration: 1s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both;
+}
+
+@-webkit-keyframes fadeInDown {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none;
+ }
+}
+
+@keyframes fadeInDown {
+ 0% {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0);
+ }
+ 100% {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none;
+ }
+}
+
+/* Simple CSS3 Fade-in Animation */
+@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
+@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
+@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
+
+.fadeIn {
+ opacity:0;
+ -webkit-animation:fadeIn ease-in 1;
+ -moz-animation:fadeIn ease-in 1;
+ animation:fadeIn ease-in 1;
+
+ -webkit-animation-fill-mode:forwards;
+ -moz-animation-fill-mode:forwards;
+ animation-fill-mode:forwards;
+
+ -webkit-animation-duration:1s;
+ -moz-animation-duration:1s;
+ animation-duration:1s;
+}
+
+.fadeIn.first {
+ -webkit-animation-delay: 0.4s;
+ -moz-animation-delay: 0.4s;
+ animation-delay: 0.4s;
+}
+
+.fadeIn.second {
+ -webkit-animation-delay: 0.6s;
+ -moz-animation-delay: 0.6s;
+ animation-delay: 0.6s;
+}
+
+.fadeIn.third {
+ -webkit-animation-delay: 0.8s;
+ -moz-animation-delay: 0.8s;
+ animation-delay: 0.8s;
+}
+
+.fadeIn.fourth {
+ -webkit-animation-delay: 1s;
+ -moz-animation-delay: 1s;
+ animation-delay: 1s;
+}
+
+/* Simple CSS3 Fade-in Animation */
+.underlineHover:after {
+ display: block;
+ left: 0;
+ bottom: -10px;
+ width: 0;
+ height: 2px;
+ //background-color: #5E89FF;
+ background-color: #5E89FF;
+ content: "";
+ transition: width 0.2s;
+}
+
+.underlineHover:hover {
+ color: #0d0d0d;
+}
+
+.underlineHover:hover:after{
+ width: 100%;
+}
+
+h1{
+ color: black;
+}
+
+/* OTHERS */
+
+*:focus {
+ outline: none;
+}
+
+#icon {
+ width:30%;
+}
diff --git a/userAndAdvertiser/src/app/beforeConnexion/login/page-login/page-login.component.spec.ts b/userAndAdvertiser/src/app/beforeConnexion/login/page-login/page-login.component.spec.ts
new file mode 100644
index 0000000..a4ee677
--- /dev/null
+++ b/userAndAdvertiser/src/app/beforeConnexion/login/page-login/page-login.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageLoginComponent } from './page-login.component';
+
+describe('PageLoginComponent', () => {
+ let component: PageLoginComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ StreamNotFound
+
+ Récupération du mot de passe
+ ++ + +
+
+ Email
+
+
+
+
+
+
+ {{errorMessage}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
++
+
+
+
+
+
+ Pseudo
+
+
+
+ + +
+ Mot de passe
+
+
+
+ + +
+ Confirmation mot de passe
+
+
+
+
+
+ Compte
+ + ++ + +
+ + +
+
+ Email
+
+
+
+ + +
+ Homme
+ Femme
+
+
+ + +
+ Date de naissance
+
+
+
+
+
+
+ Informations personelles
+ + ++ + +
+ + +
+ + +
+ + +
+ + +
+ + +
+ Votre inscription a bien été effectuée. +
+ ++ Votre inscription est en cours de validation. +
+ +
+
+
diff --git a/userAndAdvertiser/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.scss b/userAndAdvertiser/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.scss
new file mode 100644
index 0000000..85730e0
--- /dev/null
+++ b/userAndAdvertiser/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.scss
@@ -0,0 +1,7 @@
+p {
+ font-size: small;
+}
+
+div {
+ font-size: small;
+}
diff --git a/userAndAdvertiser/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.spec.ts b/userAndAdvertiser/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.spec.ts
new file mode 100644
index 0000000..d6f9908
--- /dev/null
+++ b/userAndAdvertiser/src/app/beforeConnexion/register/popup-confirmation/popup-confirmation.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PopupConfirmationComponent } from './popup-confirmation.component';
+
+describe('PopupConfirmationComponent', () => {
+ let component: PopupConfirmationComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+
diff --git a/userAndAdvertiser/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.scss b/userAndAdvertiser/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.scss
new file mode 100644
index 0000000..e1fefaa
--- /dev/null
+++ b/userAndAdvertiser/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.scss
@@ -0,0 +1,79 @@
+.navbar {
+ background-color: black;
+ height: 60px;
+ font-size: medium;
+ color: white;
+}
+
+
+.navbar-expand-lg {
+ border-bottom: solid;
+ border-color: white;
+ border-bottom-width: 2px;
+}
+
+
+// PolyNotFound
+.navbar-brand {
+ font-family: cursive;
+ font-weight: bold;
+ font-size: x-large;
+ margin-left: 15px;
+ color: white;
+}
+
+
+// Recherche, Mes Playlists, Historique
+.nav-link {
+ color: white;
+}
+.nav-link:hover {
+ color: grey;
+}
+
+
+// Bonton deconnexion
+.btnDeconnexion {
+ font-size: medium;
+ margin: 0px 10px 0px 10px
+}
+.btnDeconnexion:hover {
+ color: grey;
+}
+
+
+.monLi {
+ margin: 0px 10px 0px 10px;
+}
+
+
+img {
+ border: solid 2px white;
+ border-radius: 50px;
+ margin: 0px 10px 0px 15px;
+ width: 40px;
+ height: 40px;
+}
+img:hover {
+ cursor: pointer;
+}
+
+
+// --------------------------------------------------------------------
+
+
+::ng-deep .mat-slide-toggle-thumb {
+ background-color: #c8c8c8;
+}
+
+::ng-deep .mat-slide-toggle-bar {
+ background-color: #ffffff;
+}
+
+::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb {
+ background-color: #ffffff;
+}
+
+::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
+ background-color: #646464;
+}
diff --git a/userAndAdvertiser/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.spec.ts b/userAndAdvertiser/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.spec.ts
new file mode 100644
index 0000000..f3f7f27
--- /dev/null
+++ b/userAndAdvertiser/src/app/beforeConnexion/utils/navbar-before-connexion/navbar-before-connexion.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NavbarBeforeConnexionComponent } from './navbar-before-connexion.component';
+
+describe('NavbarBeforeConnexionComponent', () => {
+ let component: NavbarBeforeConnexionComponent;
+ let fixture: ComponentFixture
+
diff --git a/userAndAdvertiser/src/app/user/history/page-history-user/page-history-user.component.scss b/userAndAdvertiser/src/app/user/history/page-history-user/page-history-user.component.scss
new file mode 100644
index 0000000..bbd894d
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/history/page-history-user/page-history-user.component.scss
@@ -0,0 +1,46 @@
+.myContainer {
+ max-width: 100vw;
+ height: 100vh;
+ overflow-x: hidden;
+}
+
+table {
+ width: 80%;
+ margin: 0 auto;
+}
+
+
+th.mat-sort-header-sorted {
+ color: black;
+}
+
+
+input {
+ width: 35%;
+ font-size: large;
+}
+
+// -------------------------------------------------------
+
+.imgsContainer {
+ position: relative;
+ width: 20vw;
+ height: 15vh;
+ cursor: pointer;
+}
+
+.imgPlay {
+ position: absolute;
+ margin-left: 9vw;
+ width: 3vw;
+ margin-top: 5vh;
+ height: 6vh;
+ padding: 0px 0px 0px 0px;
+}
+
+.imgVideo {
+ border: solid 1px black;
+ width: 20vw;
+ height: 15vh;
+ padding: 0px 0px 0px 0px;
+}
diff --git a/userAndAdvertiser/src/app/user/history/page-history-user/page-history-user.component.spec.ts b/userAndAdvertiser/src/app/user/history/page-history-user/page-history-user.component.spec.ts
new file mode 100644
index 0000000..9fd31c3
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/history/page-history-user/page-history-user.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageHistoryUserComponent } from './page-history-user.component';
+
+describe('PageHistoriqueComponent', () => {
+ let component: PageHistoryUserComponent;
+ let fixture: ComponentFixture
+
+
+
+ + + +
+ + + +
+
+
+
+ +
++ + + +
+
+
+ + + + +
| Aperçu | +
+
+
+ 
+ |
+ Titre | +{{video.title}} | +Date | ++ {{video.date | date:'dd/LL/YYYY à HH:mm:ss'}} + | +Source | +{{video.source}} | +Action | ++ + | +
|---|---|---|---|
| Aucune vidéo ne correspond au filtre: "{{input.value}}" | +
+
+ + +
+
diff --git a/userAndAdvertiser/src/app/user/myPlaylists/page-my-playlists/page-my-playlists.component.scss b/userAndAdvertiser/src/app/user/myPlaylists/page-my-playlists/page-my-playlists.component.scss
new file mode 100644
index 0000000..fad665f
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/myPlaylists/page-my-playlists/page-my-playlists.component.scss
@@ -0,0 +1,48 @@
+.lightTheme {
+ border-color: black;
+}
+.darkTheme {
+ border-color: white;
+}
+.myContainer {
+ text-align: center;
+ max-width: 100vw;
+ height: 100vh;
+ overflow-x: hidden;
+}
+
+// Liste des vidéos -------------------------------------------------
+
+.celluleListeVideo {
+ margin: 0px 0px 0px 0px;
+}
+
+// Liste des playlists ---------------------------------------------
+
+.celluleListePlaylist {
+ margin: 0px 0px 0px 0px;
+}
+
+// Pub -------------------------------------------------------------
+
+.cellulePub {
+ padding: 0px 10px 0px 10px;
+ width: 100%;
+ text-align: center;
+ justify-content: center;
+}
+
+.conteneurPub {
+ //height: 85vh;
+ text-align: center;
+ justify-content: center;
+ vertical-align: middle;
+ display: block;
+ width: 75%;
+ margin-left: auto;
+ margin-right: auto;
+ position: absolute;
+ top: 50%;
+ -ms-transform: translateY(-50%);
+ transform: translateY(-50%);
+}
diff --git a/userAndAdvertiser/src/app/user/myPlaylists/page-my-playlists/page-my-playlists.component.spec.ts b/userAndAdvertiser/src/app/user/myPlaylists/page-my-playlists/page-my-playlists.component.spec.ts
new file mode 100644
index 0000000..2dba23b
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/myPlaylists/page-my-playlists/page-my-playlists.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageMyPlaylistsComponent } from './page-my-playlists.component';
+
+describe('PageMesPlaylistsComponent', () => {
+ let component: PageMyPlaylistsComponent;
+ let fixture: ComponentFixture
+
+
+
+ + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + + + +
+
+
+
diff --git a/userAndAdvertiser/src/app/user/myPlaylists/playlist-list/playlist-list.component.scss b/userAndAdvertiser/src/app/user/myPlaylists/playlist-list/playlist-list.component.scss
new file mode 100644
index 0000000..0376ee3
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/myPlaylists/playlist-list/playlist-list.component.scss
@@ -0,0 +1,94 @@
+.myContainer {
+ background-color: white ;
+ text-align: center;
+ width: 35vw;
+ margin: 1vh 0vh 3vh 0vh;
+ padding: 0px;
+ border: solid 2px black;
+ border-radius: 10px;
+ box-shadow: 10px 5px 5px black;
+}
+
+// SearchBar -----------------------------------------------------------
+
+.searchBarContainer {
+ text-align: center;
+ margin: 0px 0px 0px 0px;
+ padding: 10px 0px 10px 0px;
+ //background-color: #dcdcdc;
+ background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8));
+ background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5);
+ font-size: large;
+ border-bottom: solid 1px black;
+ border-top-left-radius: 10px;
+ border-top-right-radius: 10px;
+}
+
+.inputSearchBar {
+ width: 70%;
+ border-radius: 5px;
+}
+
+
+// Liste des playlists -------------------------------------------------
+
+.playlistListContainer {
+ max-width: 100%;
+ height: 60vh;
+ overflow-y: scroll;
+ padding: 0px;
+ overflow-x: hidden;
+}
+
+.playlistContainer {
+ max-width: 100%;
+ padding: 0px;
+ overflow-x: hidden;
+}
+
+
+.btnPlaylist {
+ background-color: white;
+ padding: 20px;
+ border-bottom: solid 1px black;
+ //width: 100%;
+ width: 35vw;
+ overflow-x: hidden;
+}
+.btnPlaylist:hover {
+ background-color: #f0f0f0;
+}
+
+.btnPlaylistFocus {
+ background-color: #e6e6e6;
+}
+.btnPlaylistFocus:hover {
+ background-color: #e6e6e6;
+}
+
+
+.playListCount {
+ color: gray;
+ font-style: italic;
+}
+
+// Bouton creer playlist -------------------------------------------------
+
+.btnCreerPlaylistContainer {
+ margin: 0px 0px 0px 0px;
+ background-color: #dcdcdc;
+ font-size: large;
+ border-top: solid 1px black;
+ border-bottom-left-radius: 10px;
+ border-bottom-right-radius: 10px;
+}
+
+.btnCreerPlaylist {
+ margin: 0px 0px 0px 0px;
+ border-bottom-left-radius: 10px;
+ border-bottom-right-radius: 10px;
+ background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8));
+ background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5);
+ //background: linear-gradient(180deg, #e6e6e6 0%, rgba(0,0,0,0.25) 49%, rgba(38,38,38,0.6) 51%, rgba(0,0,0,0.25) 100%);
+}
+
diff --git a/userAndAdvertiser/src/app/user/myPlaylists/playlist-list/playlist-list.component.spec.ts b/userAndAdvertiser/src/app/user/myPlaylists/playlist-list/playlist-list.component.spec.ts
new file mode 100644
index 0000000..9308f2c
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/myPlaylists/playlist-list/playlist-list.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PlaylistListComponent } from './playlist-list.component';
+
+describe('PlaylistListComponent', () => {
+ let component: PlaylistListComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{playlist.name}}
+ {{playlist.videoIds.length}} vidéo + {{playlist.videoIds.length}} vidéos +
+ + {{playlist.videoIds.length}} vidéo + {{playlist.videoIds.length}} vidéos +
+
+
+
+
+
+
+
+
+
diff --git a/userAndAdvertiser/src/app/user/myPlaylists/popup-create-or-update-playlist/popup-create-or-update-playlist.component.scss b/userAndAdvertiser/src/app/user/myPlaylists/popup-create-or-update-playlist/popup-create-or-update-playlist.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/userAndAdvertiser/src/app/user/myPlaylists/popup-create-or-update-playlist/popup-create-or-update-playlist.component.spec.ts b/userAndAdvertiser/src/app/user/myPlaylists/popup-create-or-update-playlist/popup-create-or-update-playlist.component.spec.ts
new file mode 100644
index 0000000..640bdbc
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/myPlaylists/popup-create-or-update-playlist/popup-create-or-update-playlist.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PopupCreateOrUpdatePlaylistComponent } from './popup-create-or-update-playlist.component';
+
+describe('PopupCreatePlaylistComponent', () => {
+ let component: PopupCreateOrUpdatePlaylistComponent;
+ let fixture: ComponentFixture
+
+ Nom de la playlist
+
+
+ {{errorMessage}}
+
+
+
+
+
+
+
+
+
diff --git a/userAndAdvertiser/src/app/user/myPlaylists/video-list/video-list.component.scss b/userAndAdvertiser/src/app/user/myPlaylists/video-list/video-list.component.scss
new file mode 100644
index 0000000..e3af7ce
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/myPlaylists/video-list/video-list.component.scss
@@ -0,0 +1,83 @@
+.myContainer {
+ //background-color: white ;
+ background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8));
+ background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5);
+ text-align: center;
+ width: 35vw;
+ margin: 1vh 0vh 3vh 0vh;
+ padding: 0px;
+ border: solid 2px black;
+ border-radius: 10px;
+ box-shadow: 10px 5px 5px black;
+}
+
+// TopBorder --------------------------------------------------------
+
+.topBorder {
+ margin: 0px 0px 0px 0px;
+ //background-color: #dcdcdc;
+ background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8));
+ background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5);
+ text-align: left;
+ padding: 5px 0px 5px 5px;
+ border-bottom: solid 1px black;
+ border-top-left-radius: 10px;
+ border-top-right-radius: 10px;
+}
+
+.spanPlayListTitle {
+ font-size: large;
+ font-weight: bold;
+}
+
+// Liste des videos ------------------------------------------------
+
+.listVideoContainer {
+ height: 65vh;
+ background-color: white;
+ padding: 0px;
+ overflow-y: scroll;
+}
+
+.videoContainer {
+ border-bottom: solid 1px black;
+ padding: 15px 0px 15px 0px;
+ width: 100%;
+}
+
+.imgsContainer {
+ position: relative;
+ width: 20vw;
+ height: 15vh;
+ cursor: pointer;
+}
+
+.imgPlay {
+ position: absolute;
+ margin-left: 9vw;
+ width: 3vw;
+ margin-top: 5vh;
+ height: 6vh;
+ padding: 0px 0px 0px 0px;
+}
+
+.imgVideo {
+ border: solid 1px black;
+ width: 20vw;
+ height: 15vh;
+ padding: 0px 0px 0px 0px;
+}
+
+// BottomBorder --------------------------------------------------------
+
+.bottomBorder {
+ margin: 0px 0px 0px 0px;
+ //background-color: #dcdcdc;
+ background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8));
+ background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5);
+ border-top: solid 1px black;
+ border-bottom: solid 1px black;
+ font-size: large;
+ border-bottom-left-radius: 10px;
+ border-bottom-right-radius: 10px;
+}
diff --git a/userAndAdvertiser/src/app/user/myPlaylists/video-list/video-list.component.spec.ts b/userAndAdvertiser/src/app/user/myPlaylists/video-list/video-list.component.spec.ts
new file mode 100644
index 0000000..403cc76
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/myPlaylists/video-list/video-list.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { VideoListComponent } from './video-list.component';
+
+describe('VideoListComponent', () => {
+ let component: VideoListComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+ {{playlist.name}}
+
+
+
+
+ Aucune playlist selectionnée
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{video.title}}
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Pseudo:
+ {{user.login}}
+
+
+
+
+ Mail:
+ {{user.email}}
+
+
+
+
+ Sexe:
+
+ Homme
+ Femme
+
+
+
+
+ Date de création:
+ {{ user.createdAt | date:'dd/LL/YYYY' }}
+
+
+
+
+
+
+
+
+ Date de naissance:
+ {{ user.dateOfBirth | date:'dd/LL/YYYY' }}
+
+
+
+ Centres d'intérêt:
+
+
+
+
+ {{interest}}
+
+
+
+
+ + +
+
+
+
+
+
+
+
+ ![]()
+ +
+ +
+ + +
+
+
+
+
+
{{errorMessage}} +
+
+
+ {{errorMessage}} +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Homme
+ Femme
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/userAndAdvertiser/src/app/user/search/page-search/page-search.component.scss b/userAndAdvertiser/src/app/user/search/page-search/page-search.component.scss
new file mode 100644
index 0000000..f80fc45
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/search/page-search/page-search.component.scss
@@ -0,0 +1,90 @@
+.lightTheme {
+ color: black;
+ border-color: black;
+}
+.darkTheme {
+ color: white;
+ border-color: white;
+}
+.myContainer {
+ text-align: center;
+ max-width: 100vw;
+ height: 100vh;
+ overflow-x: hidden;
+ overflow-y: scroll;
+}
+
+//--------------------------------------------------------------------------------------------
+
+.inputSearchBar {
+ width: 40%;
+ font-size: large;
+ border-bottom: 10px;
+ border-radius: 5px;
+}
+
+//--------------------------------------------------------------------------------------------
+
+.celluleGrilleVideo {
+ border: solid 2px;
+ border-radius: 5px;
+ width: 100%;
+}
+.lightTheme .celluleGrilleVideo{
+ border-color: black;
+ background-color: #f0f0f0;
+}
+.darkTheme .celluleGrilleVideo{
+ border-color: white;
+ background-color: #646464;
+}
+
+.conteneurVideosGrid {
+ height: 75vh;
+ width: 100%;
+}
+
+//--------------------------------------------------------------------------------------------
+
+.cellulePub {
+ padding: 0px 10px 0px 10px;
+ width: 100%;
+ text-align: center;
+ justify-content: center;
+}
+
+.conteneurPub {
+ height: 75vh;
+ text-align: center;
+ justify-content: center;
+ vertical-align: middle;
+ display: block;
+ width: 75%;
+ margin-left: auto;
+ margin-right: auto;
+ position: absolute;
+ top: 50%;
+ -ms-transform: translateY(-50%);
+ transform: translateY(-50%);
+}
+
+
+
+// -------------------------------------------------------------------------
+
+
+// aura
+::ng-deep .mat-checkbox-ripple .mat-ripple-element {
+ background-color: grey !important;
+}
+
+// contenu coche
+::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background {
+ background-color: black !important;
+}
+
+// indeterminate
+::ng-deep .mat-checkbox .mat-checkbox-frame {
+ border: solid 1px black !important;
+ background-color: white !important;
+}
diff --git a/userAndAdvertiser/src/app/user/search/page-search/page-search.component.spec.ts b/userAndAdvertiser/src/app/user/search/page-search/page-search.component.spec.ts
new file mode 100644
index 0000000..79e1a03
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/search/page-search/page-search.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PageSearchComponent } from './page-search.component';
+
+describe('PageSearchComponent', () => {
+ let component: PageSearchComponent;
+ let fixture: ComponentFixture
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+
+
+
+
+ {{tronquage(tabVideo[indexPage+k].title)}}
+
+ + {{tabVideo[indexPage+k].views | number: '1.0-0'}} vues. + Il y a {{dateToElapsedTime(tabVideo[indexPage+k].publishedAt)}}. + +
+ + + {{tabVideo[indexPage+k].views | number: '1.0-0'}} vues. + Il y a {{dateToElapsedTime(tabVideo[indexPage+k].publishedAt)}}. + +
+
+
+
+
+
+
+
+ {{page}}
+
+
+ {{page}}
+
+
+
+
+
+
+
diff --git a/userAndAdvertiser/src/app/user/search/video-grid/video-grid.component.scss b/userAndAdvertiser/src/app/user/search/video-grid/video-grid.component.scss
new file mode 100644
index 0000000..6819fd8
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/search/video-grid/video-grid.component.scss
@@ -0,0 +1,84 @@
+mat-grid-list {
+ margin: 0px 0px 0px 0px;
+ padding: 0px 0px 0px 0px;
+ border: none;
+}
+
+mat-grid-tile {
+ margin: 0px 0px 0px 0px;
+ padding: 0px 0px 0px 0px;
+}
+
+.myCell {
+ margin: 7px 0px 0px 0px;
+ padding: 0px 0px 0px 0px;
+ background-color: white;
+ border: solid 1px black;
+ border-bottom-left-radius: 2px;
+ border-bottom-right-radius: 2px;
+ cursor: pointer;
+}
+.myCell:hover {
+ background-color: #d2d2d2;
+}
+
+
+// ---------------------------------------------------------------------------------------------
+
+
+.imgsContainer {
+ //width: 20vw;
+ width: 18vw;
+ height: 15vh;
+}
+
+.imgPlay {
+ position: absolute;
+ margin-left: 8vw;
+ width: 2.5vw;
+ margin-top: 5vh;
+ height: 5vh;
+ padding: 0px 0px 0px 0px;
+}
+
+.imgVideo {
+ width: 18vw;
+ height: 15vh;
+ padding: 0px 0px 0px 0px;
+}
+
+
+// ---------------------------------------------------------------------------------------------
+
+
+.mat-grid-list-info-video {
+ margin: 0px 0px 0px 0px;
+ font-size: small;
+}
+
+.mat-grid-tile-info-video {
+ border: none;
+ font-size: x-small;
+ //background: linear-gradient(top, rgba(38,38,38,0.8), #e6e6e6 25%, #fff 38%, #c5c5c5 87%, rgba(38,38,38,0.8));
+ //background: -webkit-linear-gradient(top, #c5c5c5, #e6e6e6 25%, #fff 38%, #c5c5c5 87%, #c5c5c5);
+}
+
+mat-icon {
+ text-align: right;
+}
+
+
+// ---------------------------------------------------------------------------------------------
+
+
+.paginatorContainer {
+ margin: 0px 0px 0px 0px;
+ padding: 5px 0px 0px 0px;
+ text-align: center;
+ background-color: white;
+}
+
+.btnPaginator {
+ margin: 0px 0px 0px 0px;
+ padding: 0px 0px 0px 0px;
+}
diff --git a/userAndAdvertiser/src/app/user/search/video-grid/video-grid.component.spec.ts b/userAndAdvertiser/src/app/user/search/video-grid/video-grid.component.spec.ts
new file mode 100644
index 0000000..17cea62
--- /dev/null
+++ b/userAndAdvertiser/src/app/user/search/video-grid/video-grid.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { VideoGridComponent } from './video-grid.component';
+
+describe('VideoGridComponent', () => {
+ let component: VideoGridComponent;
+ let fixture: ComponentFixture
+
+
+ ![]()
+
+
+
+
+
+Ajouter dans
+ + +
+
+
+
+
+ {{playlist.name}}
+
+
+
+
+
+
+
+ Nom playlist
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{video.title}}
+
+
+
+
+
+
+ Vues:
+ {{video.views | number: '1.0-0'}}
+
+
+
+
+ Date de publication:
+ {{ video.publishedAt | date:'dd/LL/YYYY à HH:mm:ss' }}
+
+
+
+
+
+
+
+ Description
+ expand_more
+ expand_less
+
+
+ {{video.description}}
+
+
+
+
+
+
+ {{playlist.name}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ![]()
+
+
+
+
+ {{video0.title}}
+
+
+ {{video.views | number: '1.0-0'}} vues
+
+
+ Publiée le {{ video.publishedAt | date:'dd/LL/YYYY à HH:mm:ss' }}
+
+