diff --git a/src/components/ItemComponents/ItemCard.vue b/src/components/ItemComponents/ItemCard.vue index 34b29712d2228e57607c20c48feec86327292c33..1a0a11cf716704ed45e4293dd4fe57ca266f3db0 100644 --- a/src/components/ItemComponents/ItemCard.vue +++ b/src/components/ItemComponents/ItemCard.vue @@ -5,10 +5,10 @@ > <div class="relative h-0 pb-[66%]"> <img - class="w-full h-full absolute inset-0" - :src="item.img || require('../../assets/default-product.png')" - alt="Item image" - /> + class="w-full h-full absolute inset-0" + :src="item.img || require('../../assets/default-product.png')" + alt="Item image" + /> </div> <div class="p-1 m-1 bottom-0"> <p class="text-gray-700 text-xs font-bold" id="adress"> diff --git a/src/components/RentingComponents/ItemInfo.vue b/src/components/RentingComponents/ItemInfo.vue index 18f8a558678bf4a038a8d05bcac2a39400a81326..d90531a025f89589be6aae75a263e36ea3ab5f8c 100644 --- a/src/components/RentingComponents/ItemInfo.vue +++ b/src/components/RentingComponents/ItemInfo.vue @@ -6,7 +6,7 @@ <div> <div v-bind:class="{ - 'grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 h-[600px] w-auto lg:grid-cols-5 place-items-center': + 'grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 max-h-[600px] w-auto lg:grid-cols-5 place-items-center': noPicture, }" > diff --git a/tests/unit/component-tests/community-component-tests/__snapshots__/item-card.spec.js.snap b/tests/unit/component-tests/community-component-tests/__snapshots__/item-card.spec.js.snap index 356fa6b63aa9ece26edbdd78e5d07728036f38b7..5b80d49ca4a190842e471c615d5e72274b74675e 100644 --- a/tests/unit/component-tests/community-component-tests/__snapshots__/item-card.spec.js.snap +++ b/tests/unit/component-tests/community-component-tests/__snapshots__/item-card.spec.js.snap @@ -5,13 +5,17 @@ exports[`ItemCard component renders correctly 1`] = ` class="mt-5" > <div - class="w-4/5 rounded bg-gray-200 h-full overflow-hidden display:inline-block correct-size" + class="w-[80%] h-full rounded bg-gray-200 overflow-hidden display:inline-block correct-size" > - <img - alt="Item image" - class="h-3/4" - src="String" - /> + <div + class="relative h-0 pb-[66%]" + > + <img + alt="Item image" + class="w-full h-full absolute inset-0" + src="String" + /> + </div> <div class="p-1 m-1 bottom-0" >