diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts index 2cc1527..4be8256 100644 --- a/src/app/app.routes.ts +++ b/src/app/app.routes.ts @@ -4,7 +4,7 @@ export const routes: Routes = [ { path: '', pathMatch: 'full', - redirectTo: '/main/messages', + redirectTo: '/main/menu', }, { path: 'main', diff --git a/src/app/pages/parameters/parameters-coordinates/parameters-coordinates.component.css b/src/app/pages/parameters/parameters-coordinates/parameters-coordinates.component.css new file mode 100644 index 0000000..33c1651 --- /dev/null +++ b/src/app/pages/parameters/parameters-coordinates/parameters-coordinates.component.css @@ -0,0 +1,44 @@ +.coordinates-btn { + display: flex; + align-items: center; + gap: 14px; + padding: 7px 105px 7px 5px; + border: none; + cursor: pointer; + border-radius: 50px; + background: radial-gradient(ellipse at 30% 40%, #fff 0%, #f9ece9 60%, #f3d4cc 100%); + box-shadow: 0 4px 24px rgba(200, 120, 100, 0.12); + transition: transform 0.15s ease, box-shadow 0.15s ease; +} + +.coordinates-btn:hover { + transform: scale(1.02); + box-shadow: 0 6px 28px rgba(200, 120, 100, 0.2); +} + +.coordinates-btn:active { + transform: scale(0.98); +} + +.coordinates-btn .icon-wrapper { + width: 40px; + height: 40px; + border-radius: 50%; + background-color: #c07070; + display: flex; + align-items: center; + justify-content: center; +} + +.coordinates-btn .icon-wrapper img { + width: 28px; + height: 28px; + filter: brightness(0) invert(1); /* rend l'icône blanche */ +} + +.coordinates-btn .username { + font-size: 18px; + font-weight: 500; + color: #c07070; + white-space: nowrap; +} \ No newline at end of file diff --git a/src/app/pages/parameters/parameters-coordinates/parameters-coordinates.component.html b/src/app/pages/parameters/parameters-coordinates/parameters-coordinates.component.html new file mode 100644 index 0000000..b2ef56f --- /dev/null +++ b/src/app/pages/parameters/parameters-coordinates/parameters-coordinates.component.html @@ -0,0 +1,11 @@ + \ No newline at end of file diff --git a/src/app/pages/parameters/parameters-coordinates/parameters-coordinates.component.ts b/src/app/pages/parameters/parameters-coordinates/parameters-coordinates.component.ts new file mode 100644 index 0000000..2099785 --- /dev/null +++ b/src/app/pages/parameters/parameters-coordinates/parameters-coordinates.component.ts @@ -0,0 +1,43 @@ +import {Component, EventEmitter, Input, Output} from '@angular/core'; +import {FormsModule} from "@angular/forms"; + +export interface Coordonnees { + phone: string; + email: string; +} + +@Component({ + selector: 'app-parameters-coordinates', + imports: [ + FormsModule + ], + templateUrl: './parameters-coordinates.component.html', + styleUrl: './parameters-coordinates.component.css' +}) +export class ParametersCoordinatesComponent { + @Input() isOpen: boolean = false; + @Output() closed = new EventEmitter(); + @Output() saved = new EventEmitter(); + + form: Coordonnees = { phone: '', email: '' }; + phoneFocused = false; + emailFocused = false; + + close(): void { + this.closed.emit(); + } + + save(): void { + if (this.form.phone || this.form.email) { + this.saved.emit({ ...this.form }); + this.close(); + } + } + + onOverlayClick(event: MouseEvent): void { + if ((event.target as HTMLElement).classList.contains('modal-overlay')) { + this.close(); + } + } + +} diff --git a/src/app/pages/parameters/parameters-exit/parameters-exit.component.css b/src/app/pages/parameters/parameters-exit/parameters-exit.component.css index e69de29..82dd6c3 100644 --- a/src/app/pages/parameters/parameters-exit/parameters-exit.component.css +++ b/src/app/pages/parameters/parameters-exit/parameters-exit.component.css @@ -0,0 +1,21 @@ +.hamburger-btn { + align-self: flex-start; + width: 44px; + height: 44px; + border-radius: 14px; + background: white; + border: none; + box-shadow: 0 2px 10px rgba(180, 80, 80, 0.12); + display: flex; + align-items: center; + justify-content: center; + color: rosybrown; + cursor: pointer; + margin-bottom: 28px; + transition: box-shadow 0.2s, transform 0.15s; + + &:active { + transform: scale(0.94); + box-shadow: 0 1px 5px rgba(180, 80, 80, 0.1); + } +} diff --git a/src/app/pages/parameters/parameters-exit/parameters-exit.component.html b/src/app/pages/parameters/parameters-exit/parameters-exit.component.html index 5e4044a..fc102cd 100644 --- a/src/app/pages/parameters/parameters-exit/parameters-exit.component.html +++ b/src/app/pages/parameters/parameters-exit/parameters-exit.component.html @@ -1,10 +1,6 @@ diff --git a/src/app/pages/parameters/parameters-main/parameters-main.component.html b/src/app/pages/parameters/parameters-main/parameters-main.component.html index be36ab7..44d915a 100644 --- a/src/app/pages/parameters/parameters-main/parameters-main.component.html +++ b/src/app/pages/parameters/parameters-main/parameters-main.component.html @@ -1,5 +1,9 @@
-

Paramètres !

+ +
+ + +
\ No newline at end of file diff --git a/src/app/pages/parameters/parameters-main/parameters-main.component.ts b/src/app/pages/parameters/parameters-main/parameters-main.component.ts index c7d4dd0..9ea338d 100644 --- a/src/app/pages/parameters/parameters-main/parameters-main.component.ts +++ b/src/app/pages/parameters/parameters-main/parameters-main.component.ts @@ -1,11 +1,15 @@ import { Component } from '@angular/core'; import {ParametersExit} from "../parameters-exit/parameters-exit.component"; +import {ParametersCoordinatesComponent} from "../parameters-coordinates/parameters-coordinates.component"; +import {ParametersProfileComponent} from "../parameters-profile/parameters-profile.component"; @Component({ selector: 'app-parameters-main', - imports: [ - ParametersExit - ], + imports: [ + ParametersExit, + ParametersCoordinatesComponent, + ParametersProfileComponent + ], templateUrl: './parameters-main.component.html', styleUrl: './parameters-main.component.css' }) diff --git a/src/app/pages/parameters/parameters-profile/parameters-profile.component.css b/src/app/pages/parameters/parameters-profile/parameters-profile.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/pages/parameters/parameters-profile/parameters-profile.component.html b/src/app/pages/parameters/parameters-profile/parameters-profile.component.html new file mode 100644 index 0000000..a193c3f --- /dev/null +++ b/src/app/pages/parameters/parameters-profile/parameters-profile.component.html @@ -0,0 +1 @@ +

parameters-profile works!

diff --git a/src/app/pages/parameters/parameters-profile/parameters-profile.component.ts b/src/app/pages/parameters/parameters-profile/parameters-profile.component.ts new file mode 100644 index 0000000..81f0f22 --- /dev/null +++ b/src/app/pages/parameters/parameters-profile/parameters-profile.component.ts @@ -0,0 +1,11 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-parameters-profile', + imports: [], + templateUrl: './parameters-profile.component.html', + styleUrl: './parameters-profile.component.css' +}) +export class ParametersProfileComponent { + +}