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

EQ stepper and select style

Browse source
This commit is contained in:
Tykayn 2025-10-13 13:00:16 +02:00 • committed by tykayn
parent d176f57dc5
commit 159389498b
5 changed files with 54 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -46,6 +46,10 @@ textarea {
border-radius: 6px; border-radius: 6px;
} }
select {
min-width: 235px;
}
// forms // forms
select, input { select, input {
padding: 10px 16px; padding: 10px 16px;

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

@ -63,19 +63,18 @@
name="keywords" name="keywords"
placeholder="Saisir des mots clés pour affiner votre rechrche" placeholder="Saisir des mots clés pour affiner votre rechrche"
type="text"> type="text">
<sae-wip-block> <br>
rechercher <sae-m-button
<br> [disabled]="disableSearch"
<sae-m-button kind="secondary"
[disabled]="disableSearch" label="Réinitialiser"
kind="secondary" size="medium"
label="Réinitialiser" ></sae-m-button>
></sae-m-button> <sae-m-button
<sae-m-button [disabled]="disableSearch"
[disabled]="disableSearch" kind="primary"
kind="primary" label="Rechercher des cas similaires"
label="Rechercher des cas similaires" size="medium"
></sae-m-button> ></sae-m-button>
</sae-wip-block>
</div> </div>

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

@ -1,6 +1,17 @@
:host { :host {
sae-stepper {
display: block;
width: 100%;
margin-bottom: 1rem;
height: 50px;
}
textarea { textarea {
margin: 1rem 0; margin: 1rem 0;
width: 100%; width: 100%;
} }
.optionnal {
color: grey;
}
} }

6
my-workspace/projects/sae-lib/stepper/stepper.html
View file

@ -1,7 +1,13 @@
<div class="stepper"> <div class="stepper">
@for (ii of stepArray; track ii) { @for (ii of stepArray; track ii) {
@if (ii > 0) {
<div class="separator"></div>
}
<div class="step {{ currentStep >= ii ? 'is-active' : 'is-inactive'}}"> <div class="step {{ currentStep >= ii ? 'is-active' : 'is-inactive'}}">
<span class="label">
{{ ii }} {{ ii }}
</span>
</div> </div>
} }
</div> </div>

22
my-workspace/projects/sae-lib/stepper/stepper.scss
View file

@ -1,8 +1,25 @@
:host { :host {
.separator {
width: 100px;
background: grey;
height: 4px;
border-radius: 3px;
&.is-active {
background: blue;
}
}
.step { .step {
border-radius: 1px solid grey; border-radius: 100px;
padding: 1rem; border: solid 2px grey;
padding: 1rem 1.5rem;
background: white; background: white;
width: 1.5rem;
float: left;
display: flex;
margin-right: 1rem;
&.is-active { &.is-active {
color: black; color: black;
@ -11,6 +28,7 @@
&.is-inactive { &.is-inactive {
background: grey; background: grey;
border-color: black;
color: white; color: white;
} }
} }