diff --git a/ui/ui-frontend/projects/starter-kit/src/app/app.component.scss b/ui/ui-frontend/projects/starter-kit/src/app/app.component.scss index ed9992aa01529d7ab6f01fc26419195131ee78f5..aa810e0d418d371d87442a418a58be3f43f2bcd6 100644 --- a/ui/ui-frontend/projects/starter-kit/src/app/app.component.scss +++ b/ui/ui-frontend/projects/starter-kit/src/app/app.component.scss @@ -3,8 +3,6 @@ margin: 3rem 5rem;; } - - mat-list-item { cursor: pointer; &:focus { diff --git a/ui/ui-frontend/projects/starter-kit/src/app/components/typography/typography.component.html b/ui/ui-frontend/projects/starter-kit/src/app/components/typography/typography.component.html index 0fcbd3808d95975eb863b082a3985a86f69e1ace..62a5db89e616d54bc7b6c822f948b28ea3244974 100644 --- a/ui/ui-frontend/projects/starter-kit/src/app/components/typography/typography.component.html +++ b/ui/ui-frontend/projects/starter-kit/src/app/components/typography/typography.component.html @@ -1,12 +1,13 @@ +<h5>Titles</h5> <div class="mb-5"> - <h1>h1 Headline (96)</h1> + <h1>H1 Headline (96)</h1> <h2>H2 Headline (60)</h2> <h3>H3 Headline (48)</h3> <h4>H4 Headline (30)</h4> <h5>H5 Headline (24)</h5> </div> - +<h5>Text</h5> <div class="d-flex mb-5"> <div> <p class="text large">Large Text Regular (20)</p> @@ -21,10 +22,51 @@ <p class="text normal bold">Normal Text Bold (14)</p> <p class="text caption bold">Caption Bold (12)</p> </div> + + <div class="ml-5"> + <p class="text link medium">Link Bold large (16)</p> + <p class="text link normal">Link Bold Medium (14)</p> + <p class="text link caption">Link Bold normal (12)</p> + </div> </div> -<div> - <p class="text link medium">Link Bold large (16)</p> - <p class="text link normal">Link Bold Medium (14)</p> - <p class="text link caption">Link Bold normal (12)</p> +<h5>Colors</h5> +<div class="d-flex mb-5"> + <div> + <p class="text large light">Large Text Regular Light (20)</p> + <p class="text medium light">Medium Text Light (16)</p> + <p class="text normal light">Normal Text Light (14)</p> + <p class="text caption light">Caption Light (12)</p> + </div> + + <div> + <p class="text large text-primary">Large Text Regular Primary (20)</p> + <p class="text medium text-primary">Medium Text Primary (16)</p> + <p class="text normal text-primary">Normal Text Primary (14)</p> + <p class="text caption text-primary">Caption Primary (12)</p> + </div> + + <div> + <p class="text large text-secondary">Large Text Regular Secondary (20)</p> + <p class="text medium text-secondary">Medium Text Secondary (16)</p> + <p class="text normal text-secondary">Normal Text Secondary (14)</p> + <p class="text caption text-secondary">Caption Secondary (12)</p> + </div> + + <div> + <p class="text large text-red">Large Text Regular Red (20)</p> + <p class="text medium text-red">Medium Text Red (16)</p> + <p class="text normal text-red">Normal Text Red (14)</p> + <p class="text caption text-red">Caption Red (12)</p> + </div> +</div> + +<h5>Others</h5> +<div class="d-flex mb-5"> + <div> + <p class="text large light spaced">Large Text Regular Light spaced (20)</p> + <p class="text medium light spaced">Medium Text Light spaced (16)</p> + <p class="text normal light spaced">Normal Text Light spaced (14)</p> + <p class="text caption light spaced">Caption Light spaced (12)</p> + </div> </div> \ No newline at end of file diff --git a/ui/ui-frontend/projects/starter-kit/src/assets/README_STARTER_KIT.md b/ui/ui-frontend/projects/starter-kit/src/assets/README_STARTER_KIT.md index c782ce78696f8bd40a6fc12e98c351f09c60843b..d5c798e47487149e186879e4c3118a054254ce53 100644 --- a/ui/ui-frontend/projects/starter-kit/src/assets/README_STARTER_KIT.md +++ b/ui/ui-frontend/projects/starter-kit/src/assets/README_STARTER_KIT.md @@ -1,7 +1,7 @@ -### STARTER-KIT +#### STARTER-KIT Le projet starter-kit a pour but de référencer les classes .scss et composants existants mis à disposition dans vitam-ui par le biais d'exemples d'utilisation. -#### Inspecter +##### Inspecter Inspecter le DOM pour voir les classes .scss et/ou composants utilisées.