isa44.74/organizee-front
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

page d'accueil

Browse source
This commit is contained in:
Blandine Bajard 2022-01-31 18:18:03 +01:00
parent 52ff29ca30
commit 0633d6ae6d
11 changed files with 11697 additions and 99 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/app/components/meteo/meteo.component.html
View file

@ -1 +1,7 @@
<p>meteo works!</p>
<div class="meteo">
<input type="text" id="ville">
<label for="ville">Entrez votre code postal</label>
<button id="meteo-button">Ok !</button>
<iframe id="widget_autocomplete_preview" width="150" height="300" frameborder="0"
src="https://meteofrance.com/widget/prevision/751010"> </iframe>
</div>

66
src/app/components/signin/signin.component.html
View file

@ -1,45 +1,31 @@
<div class="signin-form text-center">
<main class="form-signin">
<form (ngSubmit)="onSubmit(signinForm)" #signinForm="ngForm">
<div class="form-floating">
<input type="email"
class="form-control"
id="floatingInput"
placeholder=""
name="email"
ngModel
required
[ngClass]="{'is-valid': signinForm.form.touched && signinForm.form.value['email'] != '' ,
<main class="form-signin">
<form (ngSubmit)="onSubmit(signinForm)" #signinForm="ngForm">
<div class="connexion">
<div class="form-floating">
<input type="email" class="form-control" id="floatingInput" placeholder="" name="email" ngModel required
[ngClass]="{'is-valid': signinForm.form.touched && signinForm.form.value['email'] != '' ,
'is-invalid': signinForm.form.touched && signinForm.form.value['email'] == ''}">
<label for="floatingInput">Adresse email</label>
</div>
<div class="form-floating">
<input type="password"
class="form-control"
id="floatingPassword"
placeholder=""
name="password"
ngModel
required
[ngClass]="{'is-valid': signinForm.form.touched && signinForm.form.value['password'] != '' ,
<label for="floatingInput">Adresse email</label>
</div>
<div class="form-floating">
<input type="password" class="form-control" id="floatingPassword" placeholder="" name="password" ngModel
required [ngClass]="{'is-valid': signinForm.form.touched && signinForm.form.value['password'] != '' ,
'is-invalid': signinForm.form.touched && signinForm.form.value['password'] == ''}">
<label for="floatingPassword">Mot de passe</label>
</div>
<label for="floatingPassword">Mot de passe</label>
</div>
<button class="w-100 btn btn-lg btn-outline-success"
type="submit"
[disabled]="signinForm.invalid">Se connecter</button>
<button class="w-100 btn btn-lg btn-outline-success"
routerLink="../creation-compte" routerLinkActive="active-custom"
>S'inscrire</button>
</form>
<div *ngIf="errorForm">
<p class="text-danger">Il manque des informations dans le formulaire...</p>
</div>
</main>
<button class="w-100 btn btn-lg btn-outline-success" type="submit" [disabled]="signinForm.invalid">Se
connecter</button>
</div>
<button class="w-100 btn btn-lg btn-outline-success" routerLink="../creation-compte"
routerLinkActive="active-custom">S'inscrire</button>
</form>
<div *ngIf="errorForm">
<p class="text-danger">Il manque des informations dans le formulaire...</p>
</div>
</main>
</div>

18
src/app/components/signin/signin.component.scss
View file

@ -1,7 +1,7 @@
.signin-form {
height: 100vh;
padding-top: 40px;
background-color: #f5f5f5;
background-color: #fff;
}
.form-signin {
@ -10,10 +10,13 @@
margin-top: 50px;
margin-left: auto;
margin-right: auto;
border: solid 1px;
}
.connexion {
border: solid 4px;
border-radius: 10px;
background-color: #fcddec;
border-color: #ef5da8;
background-color: #ffff;
border-color: #5d5fef;
}
.form-floating:focus-within {
@ -22,11 +25,14 @@
input[type="email"] {
margin-bottom: -1px;
margin-right: 50px;
padding-right: 10px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
input[type="password"] {
padding-right: 10px;
margin-bottom: 10px;
border-top-left-radius: 0;
border-top-right-radius: 0;
@ -35,6 +41,6 @@ input[type="password"] {
margin-top: 10px;
margin-bottom: 5px;
background-color: #ffff;
color: #ef5da8 !important;
border-color: #ef5da8 !important;
color: #5d5fef !important;
border-color: #5d5fef !important;
}