tykayn/ng-implementation
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

EQ: add texts and stepper component

Browse source
This commit is contained in:
Tykayn 2025-10-13 12:47:50 +02:00 • committed by tykayn
parent 9de7b06579
commit d176f57dc5
12 changed files with 241 additions and 58 deletions
Download patch file Download diff file Expand all files Collapse all files

52
eqlair/src/app/app.scss
View file

@ -1,9 +1,11 @@
// Styles globaux supplémentaires
html, body {
font-family: Barlow, Calibri, SansSerif;
height: 80vw;
width: 100%;
margin: 0;
}
main {
padding: 100px;
width: 80vw;
@ -18,8 +20,56 @@ main {
a {
cursor: pointer;
}
app-main-nav {
position: fixed;
width: 100vw;
z-index: 200;
}
}
label {
color: var(--Colors-Principal-500, #153451);
/* AERO Typo/Body/B18/SemiBold */
font-family: Barlow;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: 28px; /* 155.556% */
}
textarea {
padding: 10px 16px;
border: solid 1px #A8ACC2;
color: #585E7E;
background: white;
border-radius: 6px;
}
// forms
select, input {
padding: 10px 16px;
border: solid 1px #A8ACC2;
color: #585E7E;
background: white;
border-radius: 6px;
/* AERO Typo/Body/B16/Regular */
font-family: var(--font-family-title, Barlow);
font-size: var(--font-size-body-B16, 16px);
font-style: normal;
font-weight: 400;
line-height: var(--font-line-height-body-B16, 24px); /* 150% */
letter-spacing: var(--font-tracking-none, 0);
margin-bottom: 14px;
+ select {
margin-bottom: 14px;
margin-right: 14px;
}
}
input {
width: 100%;
}

125
eqlair/src/app/pages/home/home.html
View file

@ -1,68 +1,81 @@
<div id="home">
page d'accueil
<!-- page d'accueil-->
<sae-wip-block>
stepper
</sae-wip-block>
<sae-wip-block>
formulaire
<br>
<h2>
Saisir vos critères
</h2>
<sae-wip-block>
fiche résumé
</sae-wip-block>
<!-- stepper-->
<sae-stepper [currentStep]="1" [maxStep]="2"></sae-stepper>
<sae-m-button kind="secondary" label="do something"></sae-m-button>
<sae-m-button kind="primary" label="do something"></sae-m-button>
<textarea [(ngModel)]="fromText"></textarea>
</sae-wip-block>
<sae-wip-block>
filtres
<div class="optionnal">
(optionnels)
</div>
<br>
<div class="filter-grid">
<select name="a" id="a">
<option value="1">1</option>
</select>
<select name="a" id="a">
<option value="1">1</option>
</select>
<select name="a" id="a">
<option value="1">1</option>
</select>
<select name="a" id="a">
<option value="1">1</option>
</select>
<select name="a" id="a">
<option value="1">1</option>
</select>
<select name="a" id="a">
<option value="1">1</option>
</select>
<select name="a" id="a">
<option value="1">1</option>
</select>
<select name="a" id="a">
<option value="1">1</option>
</select>
<select name="a" id="a">
<option value="1">1</option>
</select>
<h2>
Saisir vos critères
</h2>
<p>
Saisissez un événement qualité ou poser une question, pour explorer les cas déjà traités. Vous pourrez ainsi
gagner du temps et vous appuyer sur des retours d’expérience concrets.
</p>
<sae-m-button kind="primary" label="Chercher un EQ" size="medium"></sae-m-button>
<sae-m-button kind="secondary" label="Poser une question" size="medium"></sae-m-button>
<textarea
[(ngModel)]="fromText"
cols="30"
placeholder="Posez votre question"
rows="5"
></textarea>
<div class="optionnal">
(optionnels)
</div>
<br>
<div class="filter-grid">
<select id="a" name="a">
<option disabled selected value="">Select your option</option>
<option value="1">1</option>
</select>
<select id="a" name="a">
<option value="1">1</option>
</select>
<select id="a" name="a">
<option value="1">1</option>
</select>
<select id="a" name="a">
<option value="1">1</option>
</select>
<select id="a" name="a">
<option value="1">1</option>
</select>
<select id="a" name="a">
<option value="1">1</option>
</select>
<select id="a" name="a">
<option value="1">1</option>
</select>
<select id="a" name="a">
<option value="1">1</option>
</select>
<select id="a" name="a">
<option value="1">1</option>
</select>
</div>
<input type="text" name="keywords" [(ngModel)]="keywords">
</sae-wip-block>
</div>
<input
[(ngModel)]="keywords"
name="keywords"
placeholder="Saisir des mots clés pour affiner votre rechrche"
type="text">
<sae-wip-block>
rechercher
<br>
<sae-m-button kind="secondary" label="réinitialiser" [disabled]="disableSearch"></sae-m-button>
<sae-m-button kind="primary" label="Rechercher des cas similaires" [disabled]="disableSearch"></sae-m-button>
<sae-m-button
[disabled]="disableSearch"
kind="secondary"
label="Réinitialiser"
></sae-m-button>
<sae-m-button
[disabled]="disableSearch"
kind="primary"
label="Rechercher des cas similaires"
></sae-m-button>
</sae-wip-block>
</div>

6
eqlair/src/app/pages/home/home.scss
View file

@ -0,0 +1,6 @@
:host {
textarea {
margin: 1rem 0;
width: 100%;
}
}

4
eqlair/src/app/pages/home/home.ts
View file

@ -3,6 +3,7 @@ import {Component} from '@angular/core';
import {MainButton} from 'sae-lib/buttons/main-button/main-button';
import {WipBlock} from 'sae-lib/layouts/wip-block/wip-block';
import {FormsModule} from '@angular/forms';
import {Stepper} from 'sae-lib/stepper/stepper';
@Component({
selector: 'app-home',
@ -10,7 +11,8 @@ import {FormsModule} from '@angular/forms';
MainButton,
WipBlock,
CommonModule,
FormsModule
FormsModule,
Stepper
],
templateUrl: './home.html',
styleUrl: './home.scss'