diff --git a/eqlair/src/app/app.scss b/eqlair/src/app/app.scss
index 9f8997a..945ce17 100644
--- a/eqlair/src/app/app.scss
+++ b/eqlair/src/app/app.scss
@@ -46,6 +46,10 @@ textarea {
border-radius: 6px;
}
+select {
+ min-width: 235px;
+}
+
// forms
select, input {
padding: 10px 16px;
diff --git a/eqlair/src/app/pages/home/home.html b/eqlair/src/app/pages/home/home.html
index 6256b56..1ef1acf 100644
--- a/eqlair/src/app/pages/home/home.html
+++ b/eqlair/src/app/pages/home/home.html
@@ -63,19 +63,18 @@
name="keywords"
placeholder="Saisir des mots clés pour affiner votre rechrche"
type="text">
-
- rechercher
-
-
-
+
+
+
-
diff --git a/eqlair/src/app/pages/home/home.scss b/eqlair/src/app/pages/home/home.scss
index 1c268f9..0328813 100644
--- a/eqlair/src/app/pages/home/home.scss
+++ b/eqlair/src/app/pages/home/home.scss
@@ -1,6 +1,17 @@
:host {
+ sae-stepper {
+ display: block;
+ width: 100%;
+ margin-bottom: 1rem;
+ height: 50px;
+ }
+
textarea {
margin: 1rem 0;
width: 100%;
}
+
+ .optionnal {
+ color: grey;
+ }
}
diff --git a/my-workspace/projects/sae-lib/stepper/stepper.html b/my-workspace/projects/sae-lib/stepper/stepper.html
index b3e2954..eebf41c 100644
--- a/my-workspace/projects/sae-lib/stepper/stepper.html
+++ b/my-workspace/projects/sae-lib/stepper/stepper.html
@@ -1,7 +1,13 @@
@for (ii of stepArray; track ii) {
+
+ @if (ii > 0) {
+
+ }
+
{{ ii }}
+
}
diff --git a/my-workspace/projects/sae-lib/stepper/stepper.scss b/my-workspace/projects/sae-lib/stepper/stepper.scss
index 11e5ac9..aa0745c 100644
--- a/my-workspace/projects/sae-lib/stepper/stepper.scss
+++ b/my-workspace/projects/sae-lib/stepper/stepper.scss
@@ -1,8 +1,25 @@
:host {
+ .separator {
+ width: 100px;
+ background: grey;
+ height: 4px;
+ border-radius: 3px;
+
+ &.is-active {
+ background: blue;
+ }
+ }
+
.step {
- border-radius: 1px solid grey;
- padding: 1rem;
+ border-radius: 100px;
+ border: solid 2px grey;
+ padding: 1rem 1.5rem;
background: white;
+ width: 1.5rem;
+ float: left;
+ display: flex;
+ margin-right: 1rem;
+
&.is-active {
color: black;
@@ -11,6 +28,7 @@
&.is-inactive {
background: grey;
+ border-color: black;
color: white;
}
}