sanchezvem/BeReadyFrontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

created login page

Browse Source
This commit is contained in:
sanchezvem
2026-03-24 09:51:47 +01:00
parent c24103a2ad
commit 95f92229a4
7 changed files with 54 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
angular.json
+2 -1
View File
@@ -155,7 +155,8 @@
"cli": {
"schematicCollections": [
"@ionic/angular-toolkit"
]
],
"analytics": "e8e950b1-4841-478c-ba40-4e4328545e20"
},
"schematics": {
"@ionic/angular-toolkit:component": {
package-lock.json
Generated
+3 -26
View File
@@ -469,7 +469,6 @@
"resolved": "https://registry.npmjs.org/@angular/common/-/common-20.3.17.tgz",
"integrity": "sha512-Dqd8f8o9MehszTZIB7o7jrERlwLOSK64gNngK14DCQazz5lpIhAF6hBjx7zjHpa7L9eAYPK1TaxQUXypjzj18Q==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -486,7 +485,6 @@
"resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-20.3.17.tgz",
"integrity": "sha512-cj3x6aFk9xOOxX+qEdeN8T5YbnBNWJ4UMHB/LQoDr7/xCJJGa40IhcOAuJeuF2kGqTwx6MCXnvjO8XOQfHhe9g==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -500,7 +498,6 @@
"integrity": "sha512-w5pmO1pXO9tUMgUMWstpDmAWh5s1lJWo+2GI/ByaUEgBZkXd2S92sWoDL+bhy+JSvFzdLGdua6BncHBOX7hEjA==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@babel/core": "7.28.3",
"@jridgewell/sourcemap-codec": "^1.4.14",
@@ -533,7 +530,6 @@
"resolved": "https://registry.npmjs.org/@angular/core/-/core-20.3.17.tgz",
"integrity": "sha512-YlQqxMeHI9XJw7I7oM3hYFQd4lQbK37IdlD9ztROIw5FjX6i6lmLU7+X1MQGSRi2r+X9l3IZtl33hRTNvkoUBw==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -559,7 +555,6 @@
"resolved": "https://registry.npmjs.org/@angular/forms/-/forms-20.3.17.tgz",
"integrity": "sha512-iGS6NwzcyJzinbPMapsQtcN0ZJ62vr6hcul+FNa40CaK2ePC04S+C5n+DIphzwnwsFHDBIWuTQRfk/lNYdN1JA==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -578,7 +573,6 @@
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-20.3.17.tgz",
"integrity": "sha512-GA8pK+0F2/KGdYn5LMpLBrPTkQUwGjQE8Q+qsivOa150cK3OuD0po5PvYK58l+niGIVvm0wB1xGKTHTOiX/+4A==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -601,7 +595,6 @@
"resolved": "https://registry.npmjs.org/@angular/router/-/router-20.3.17.tgz",
"integrity": "sha512-p0r0IOJhUcn8WHx4gkSlfwifkkYO5mSDtq4iM5OunZTlSaeSxLb1vTRg2VBgwdzpgAM+eZSMBTTVF/M3pdoELQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"tslib": "^2.3.0"
},
@@ -646,7 +639,6 @@
"integrity": "sha512-yDBHV9kQNcr2/sUr9jghVyz9C3Y5G2zUM2H2lo+9mKv4sFgbA8s8Z9t8D1jiTkGoO/NoIfKMyKWr4s6CN23ZwQ==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@ampproject/remapping": "^2.2.0",
"@babel/code-frame": "^7.27.1",
@@ -1623,7 +1615,6 @@
"integrity": "sha512-nqhDw2ZcAUrKNPwhjinJny903bRhI0rQhiDz1LksjeRxqa36i3l75+4iXbOy0rlDpLJGxqtgoPavQjmmyS5UJw==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@inquirer/checkbox": "^4.2.1",
"@inquirer/confirm": "^5.1.14",
@@ -2439,7 +2430,6 @@
"resolved": "https://registry.npmjs.org/@nestjs/common/-/common-11.1.16.tgz",
"integrity": "sha512-JSIeW+USuMJkkcNbiOdcPkVCeI3TSnXstIVEPpp3HiaKnPRuSbUUKm9TY9o/XpIcPHWUOQItAtC5BiAwFdVITQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"file-type": "21.3.0",
"iterare": "1.2.1",
@@ -4445,7 +4435,6 @@
"resolved": "https://registry.npmjs.org/axios/-/axios-1.13.6.tgz",
"integrity": "sha512-ChTCHMouEe2kn713WHbQGcuYrr6fXTBiu460OTwWrWob16g1bXn4vtz07Ope7ewMozJAnEquLk5lWQWtBig9DQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"follow-redirects": "^1.15.11",
"form-data": "^4.0.5",
@@ -4567,7 +4556,6 @@
}
],
"license": "MIT",
"peer": true,
"dependencies": {
"baseline-browser-mapping": "^2.9.0",
"caniuse-lite": "^1.0.30001759",
@@ -5665,7 +5653,6 @@
"integrity": "sha512-hIS4idWWai69NezIdRt2xFVofaF4j+6INOpJlVOLDO8zXGpUVEVzIYk12UUi2JzjEzWL3IOAxcTubgz9Po0yXw==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"accepts": "^2.0.0",
"body-parser": "^2.2.1",
@@ -6133,7 +6120,6 @@
"integrity": "sha512-jq9l1DM0zVIvsm3lv9Nw9nlJnMNPOcAtsbsgiUhWcFzPE99Gvo6yRTlszSLLYacMeQ6quHD6hMfId8crVHvexw==",
"dev": true,
"license": "MIT",
"peer": true,
"engines": {
"node": ">=16.9.0"
}
@@ -6849,7 +6835,6 @@
"integrity": "sha512-SL0JY3DaxylDuo/MecFeiC+7pedM0zia33zl0vcjgwcq1q1FWWF1To9EIauPbl8GbMCU0R2e0uJ8bZunhYKD2g==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"cli-truncate": "^4.0.0",
"colorette": "^2.0.20",
@@ -8195,8 +8180,7 @@
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.2.tgz",
"integrity": "sha512-urBwgfrvVP/eAyXx4hluJivBKzuEbSQs9rKWCrCkbSxNv8mxPcUZKeuoF3Uy4mJl3Lwprp6yy5/39VWigZ4K6Q==",
"license": "Apache-2.0",
"peer": true
"license": "Apache-2.0"
},
"node_modules/require-directory": {
"version": "2.1.1",
@@ -8367,7 +8351,6 @@
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz",
"integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==",
"license": "Apache-2.0",
"peer": true,
"dependencies": {
"tslib": "^2.1.0"
}
@@ -8385,7 +8368,6 @@
"integrity": "sha512-9GUyuksjw70uNpb1MTYWsH9MQHOHY6kwfnkafC24+7aOMZn9+rVMBxRbLvw756mrBFbIsFg6Xw9IkR2Fnn3k+Q==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"chokidar": "^4.0.0",
"immutable": "^5.0.2",
@@ -8953,8 +8935,7 @@
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
"license": "0BSD",
"peer": true
"license": "0BSD"
},
"node_modules/tuf-js": {
"version": "4.1.0",
@@ -9004,7 +8985,6 @@
"integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
"dev": true,
"license": "Apache-2.0",
"peer": true,
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@@ -9145,7 +9125,6 @@
"integrity": "sha512-uzcxnSDVjAopEUjljkWh8EIrg6tlzrjFUfMcR1EVsRDGwf/ccef0qQPRyOrROwhrTDaApueq+ja+KLPlzR/zdg==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"esbuild": "^0.25.0",
"fdir": "^6.5.0",
@@ -9445,7 +9424,6 @@
"integrity": "sha512-AvvthqfqrAhNH9dnfmrfKzX5upOdjUVJYFqNSlkmGf64gRaTzlPwz99IHYnVs28qYAybvAlBV+H7pn0saFY4Ig==",
"dev": true,
"license": "MIT",
"peer": true,
"funding": {
"url": "https://github.com/sponsors/colinhacks"
}
@@ -9464,8 +9442,7 @@
"version": "0.15.1",
"resolved": "https://registry.npmjs.org/zone.js/-/zone.js-0.15.1.tgz",
"integrity": "sha512-XE96n56IQpJM7NAoXswY3XRLcWFW83xe0BiAOeMD7K5k5xecOeul3Qcpx6GqEeeHNkW5DWL5zOyTbEfB4eti8w==",
"license": "MIT",
"peer": true
"license": "MIT"
}
}
}
src/app/components/login-form/login-form.component.html
+4 -8
View File
@@ -1,17 +1,13 @@
<form [formGroup]="loginForm">
<ion-item>
<ion-label>Pseudo</ion-label>
<ion-item lines="none">
<ion-label position="stacked">Pseudo</ion-label>
<ion-input placeholder="Nom d'utilisateur" formControlName="username"></ion-input>
</ion-item>
<ion-item>
<ion-label>Mot de passe</ion-label>
<ion-item lines="none">
<ion-label position="stacked">Mot de passe</ion-label>
<ion-input type="password" placeholder="MotDePasse1234" formControlName="password">
<ion-input-password-toggle slot="end"></ion-input-password-toggle>
</ion-input>
</ion-item>
<ion-button class="flex flex-col items-center justify-center mt-6">
<p class="text-white font-bold m-0">Se connecter</p>
</ion-button>
</form>
src/app/components/login-form/login-form.component.scss
+28
View File
@@ -0,0 +1,28 @@
/* Style global des items */
ion-item {
--background: #ffffff;
margin-bottom: 4px;
}
/* Label */
ion-label {
font-size: 13px;
color: #666;
margin-bottom: 4px;
}
/* Input */
ion-input{
--padding-start: 10px;
--padding-end: 10px;
--padding-top: 0;
--padding-bottom: 0;
border: solid 1px #000;
border-radius: 10px;
font-size: 14px;
}
/* Button */
ion-button:active {
transform: scale(0.98);
}
src/app/components/login-form/login-form.component.ts
+2 -6
View File
@@ -1,6 +1,6 @@
import { Component } from '@angular/core';
import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
import {IonButton, IonInput, IonInputPasswordToggle, IonItem, IonLabel} from "@ionic/angular/standalone";
import {IonicModule} from "@ionic/angular";
@Component({
selector: 'app-login-form',
@@ -8,11 +8,7 @@ import {IonButton, IonInput, IonInputPasswordToggle, IonItem, IonLabel} from "@i
styleUrls: ['./login-form.component.scss'],
imports: [
ReactiveFormsModule,
IonButton,
IonInput,
IonInputPasswordToggle,
IonItem,
IonLabel
IonicModule
]
})
export class LoginFormComponent {
src/app/pages/login/login.component.html
+12 -8
View File
@@ -1,23 +1,27 @@
<div class="flex flex-col items-center justify-center min-h-screen p-6 space-y-4 bg-white">
<img src="BeReady.png" alt="BeReady-Logo" class="w-1/4 max-w-xs">
<img src="BeReady.png" alt="BeReady-Logo" class="w-1/3 max-w-xs">
<p class="text-3xl font-extrabold text-center text-black">
BeReady
</p>
<!-- <p class="text-3xl font-extrabold text-center text-black">-->
<!-- BeReady-->
<!-- </p>-->
<p class="text-gray-500 text-sm text-center w-3/5 leading-snug">
Prêt à défier tes potes et prouver que t’es le meilleur ?
</p>
<app-login-form></app-login-form>
<app-login-form class="mb-9"></app-login-form>
<div class="flex items-center w-full">
<ion-button class="w-10/12 mt-0 border-0" color="primary">
<p class="text-white font-bold m-0">Se connecter</p>
</ion-button>
<div class="flex items-center w-10/12">
<div class="flex-1 border-b border-gray-400"></div>
<span class="px-2 text-gray-500 font-bold">ou</span>
<span class="px-2 text-gray-400 font-bold">ou</span>
<div class="flex-1 border-b border-gray-400"></div>
</div>
<ion-button class="w-full mt-0" style="border: 1px solid black; border-radius: 15px" color="secondary">
<ion-button class="w-10/12 mt-0" color="secondary">
<p class="text-black font-bold m-0">Créer un compte</p>
</ion-button>
</div>
src/app/pages/login/login.component.scss
+3
View File
@@ -0,0 +1,3 @@
ion-button:active {
transform: scale(0.98);
}