11< div class ="container mx-auto pt-2 mb-8 ">
22
3- < h1 class ="mb-2 text-center mt-4 text-4xl font-extrabold leading-none tracking-tight text-gray-900 md:text-4xl lg:text-5xl dark:text-white w-full "> < span class ="underline underline-offset-3 decoration-8 decoration-primary-100 dark:decoration-primary-100 "> {{'CATALOGS._all_catalogs' | translate}}</ span > </ h1 >
3+ < h1 data-cy =" cataloguesAllHeader " class ="mb-2 text-center mt-4 text-4xl font-extrabold leading-none tracking-tight text-gray-900 md:text-4xl lg:text-5xl dark:text-white w-full "> < span class ="underline underline-offset-3 decoration-8 decoration-primary-100 dark:decoration-primary-100 "> {{'CATALOGS._all_catalogs' | translate}}</ span > </ h1 >
44 < p class ="mb-8 text-lg font-normal text-gray-500 lg:text-xl sm:px-16 xl:px-48 dark:text-secondary-50 text-center "> {{'CATALOGS._choose' | translate}}</ p >
55
66 <!-- HEADER SEARCH BAR -->
@@ -33,30 +33,30 @@ <h1 class="mb-2 text-center mt-4 text-4xl font-extrabold leading-none tracking-t
3333
3434 @for (cat of catalogs; track cat.id) {
3535
36- < div (click) ="goToCatalogSearch(cat.id) " class ="block cursor-pointer rounded-lg bg-cover mb-4 md:mb-0 " style ="background-image: url(assets/logos/dome-logo-element-colour.png); " >
36+ < div data-cy =" cataloguesList " (click) ="goToCatalogSearch(cat.id) " class ="block cursor-pointer rounded-lg bg-cover mb-4 md:mb-0 " style ="background-image: url(assets/logos/dome-logo-element-colour.png); " >
3737 < div class ="block w-full h-full p-6 bg-opacity-100 bg-secondary-50 rounded-lg dark:bg-secondary-100 bg-secondary-50/90 dark:bg-secondary-100/90 bg-cover ">
38- < h5 [ngClass] ="{
38+ < h5 data-cy =" cataloguesTitle " [ngClass] ="{
3939 'break-all': hasLongWord(cat.name, 20),
4040 'break-words': !hasLongWord(cat.name, 20)
4141 } " class ="text-2xl font-bold tracking-tight line-clamp-4 text-primary-100 dark:text-white text-wrap break-words "> {{cat.name}}</ h5 >
42- < markdown class ="line-clamp-[8] text-wrap break-all dark:text-white text-gray-900 " [data] ="cat.description ? cat.description : 'CATALOGS._no_desc' | translate "> </ markdown >
42+ < markdown data-cy =" cataloguesDescription " class ="line-clamp-[8] text-wrap break-all dark:text-white text-gray-900 " [data] ="cat.description ? cat.description : 'CATALOGS._no_desc' | translate "> </ markdown >
4343 <!--<a (click)="showFullDesc(cat);$event.stopPropagation();" class="text-xs font-medium inline-flex items-center px-2.5 py-0.5 rounded-md text-secondary-50 bg-primary-100 dark:bg-secondary-50 dark:text-primary-100 mb-2">
4444 <fa-icon [icon]="faEye" class="text-primary-50 mr-2"></fa-icon>
4545 {{'CATALOGS._view_details' | translate}}
4646 </a>-->
4747 < hr class ="h-px my-1 bg-primary-100 border-0 dark:bg-primary-100 ">
48- < div class ="">
48+ < div data-cy =" cataloguesCategories " class ="">
4949 @for(category of cat.category; track category.id) {
5050 < span [ngClass] ="{
5151 'break-all': hasLongWord(category.name, 20),
5252 'break-words': !hasLongWord(category.name, 20)
5353 } " class ="inline-block bg-blue-300 text-primary-100 text-xs font-bold me-2 px-2.5 py-0.5 rounded-full w-fit text-wrap break-words "> {{category.name}}</ span >
5454 } @empty {
55- < span class ="inline-block bg-blue-300 text-primary-100 text-xs font-bold me-2 px-2.5 py-0.5 rounded-full w-fit text-wrap break-words "> {{'CATALOGS._no_cat' | translate}}</ span >
55+ < span class ="inline-block bg-blue-300 text-primary-100 text-xs font-bold me-2 px-2.5 py-0.5 rounded-full w-fit text-wrap break-words "> {{'CATALOGS._no_cat' | translate}}</ span >
5656 }
5757 </ div >
5858 < div class ="flex sticky top-[100vh] justify-center align-items-bottom ">
59- < button (click) ="showFullDesc(cat);$event.stopPropagation(); " type ="button " class ="flex mt-2 items-center align-items-bottom text-white bg-primary-100 hover:bg-primary-50 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-100 dark:hover:bg-primary-50 dark:focus:ring-primary-100 mr-1 ">
59+ < button data-cy =" cataloguesViewDetails " (click) ="showFullDesc(cat);$event.stopPropagation(); " type ="button " class ="flex mt-2 items-center align-items-bottom text-white bg-primary-100 hover:bg-primary-50 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-100 dark:hover:bg-primary-50 dark:focus:ring-primary-100 mr-1 ">
6060 < svg class ="w-[18px] h-[18px] text-white mr-2 " aria-hidden ="true " xmlns ="http://www.w3.org/2000/svg " fill ="none " viewBox ="0 0 20 14 ">
6161 < g stroke ="currentColor " stroke-linecap ="round " stroke-linejoin ="round " stroke-width ="2 ">
6262 < path d ="M10 10a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z "/>
@@ -104,7 +104,7 @@ <h1 class="mb-2 text-center mt-4 text-4xl font-extrabold leading-none tracking-t
104104 class ="fixed inset-0 z-40 flex flex-col lg:flex-row justify-center overflow-y-auto overflow-x-hidden px-4 pt-[80px] lg:pt-0 lg:items-center ">
105105
106106 < div class ="relative w-full max-w-4xl ">
107- < div class ="relative bg-white dark:bg-secondary-100 rounded-lg shadow-lg bg-cover bg-right-bottom overflow-y-auto max-h-[calc(100vh-160px)] "
107+ < div data-cy =" cataloguesDetailsContents " class ="relative bg-white dark:bg-secondary-100 rounded-lg shadow-lg bg-cover bg-right-bottom overflow-y-auto max-h-[calc(100vh-160px)] "
108108 (click) ="$event.stopPropagation(); ">
109109
110110 <!-- HEADER -->
@@ -131,7 +131,7 @@ <h5 class="md:text-3xl lg:text-4xl font-semibold tracking-tight text-primary-100
131131 < hr class ="h-px my-1 bg-primary-100 border-0 dark:bg-primary-100 " />
132132
133133 <!-- CATEGORIES -->
134- < div class ="p-4 flex flex-wrap gap-2 ">
134+ < div data-cy =" cataloguesCategoriesList " class ="p-4 flex flex-wrap gap-2 ">
135135 @for(category of showingCat.category; track category.id) {
136136 < span [ngClass] ="{
137137 'break-all': hasLongWord(category.name, 20),
0 commit comments