brian/laravel-shopping-cart
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

now the cards look fine

Browse Source
This commit is contained in:
Brian
2026-04-09 18:51:53 -06:00
parent 519f944139
commit ebf30d4f5f
1 changed files with 9 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/pages/Home.vue
+8 -3
View File
@@ -33,7 +33,7 @@ function formatPrice(cents: number): string {
<div <div
v-for="product in products" v-for="product in products"
:key="product.id" :key="product.id"
class="overflow-hidden rounded-lg border border-gray-200 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-800" class="flex flex-col overflow-hidden rounded-lg border border-gray-200 bg-white shadow-sm dark:border-gray-700 dark:bg-gray-800"
> >
<img <img
v-if="product.image_url" v-if="product.image_url"
@@ -44,10 +44,15 @@ function formatPrice(cents: number): string {
<div v-else class="flex h-48 items-center justify-center bg-gray-100 dark:bg-gray-700"> <div v-else class="flex h-48 items-center justify-center bg-gray-100 dark:bg-gray-700">
<span class="text-sm text-gray-400">No image</span> <span class="text-sm text-gray-400">No image</span>
</div> </div>
<div class="p-5"> <div class="flex flex-1 flex-col p-5">
<h2 class="mb-1 font-medium capitalize">{{ product.name }}</h2> <h2 class="mb-1 font-medium capitalize">{{ product.name }}</h2>
<p class="mb-4 text-sm text-gray-500 dark:text-gray-400">{{ product.description }}</p> <p class="mb-4 grow text-sm text-gray-500 dark:text-gray-400">{{ product.description }}</p>
<div class="flex items-center justify-between">
<p class="text-lg font-semibold">{{ formatPrice(product.price_cents) }}</p> <p class="text-lg font-semibold">{{ formatPrice(product.price_cents) }}</p>
<button type="button" class="rounded-md bg-gray-900 px-3 py-1.5 text-sm font-medium text-white hover:bg-gray-700 dark:bg-white dark:text-gray-900 dark:hover:bg-gray-200">
Add
</button>
</div>
</div> </div>
</div> </div>
</div> </div>