fix(cards): add shadow-sm to all card elements across 24 files

Design system requires shadow-sm + border on all cards.
Also fixes bg-white -> bg-surface-50 and bg-surface-100 -> bg-surface-50
where card backgrounds used wrong tokens.

Confab-Link: http://localhost:8080/sessions/0ec83454-d346-4329-8aaf-6b12139bf596
This commit is contained in:
Ricardo
2026-03-07 15:58:48 +01:00
parent 2f442862af
commit 0f843e7ce1
24 changed files with 121 additions and 121 deletions

View File

@@ -36,7 +36,7 @@
<label for="comment-me" class="block text-sm font-medium mb-1">Your website</label>
<input id="comment-me" type="url" x-model="meUrl"
placeholder="https://yourdomain.com" required
class="w-full px-3 py-2 border rounded-lg dark:bg-surface-800 dark:border-surface-600">
class="w-full px-3 py-2 border rounded-lg dark:bg-surface-800 dark:border-surface-700 dark:text-surface-100">
</div>
<button type="submit" class="button" x-bind:disabled="authLoading">
<span x-show="!authLoading">Sign In</span>
@@ -56,7 +56,7 @@
<form x-on:submit.prevent="submitComment()">
<textarea x-model="commentText" rows="4" required
placeholder="Share your thoughts... (supports **bold**, *italic*, and [links](url))"
class="w-full px-3 py-2 border rounded-lg mb-2 dark:bg-surface-800 dark:border-surface-600"
class="w-full px-3 py-2 border rounded-lg mb-2 dark:bg-surface-800 dark:border-surface-700 dark:text-surface-100"
x-bind:maxlength="maxLength"></textarea>
<div class="flex items-center justify-between">
<span class="text-xs text-surface-500" x-text="commentText.length + '/' + maxLength"></span>
@@ -75,7 +75,7 @@
</template>
<template x-for="comment in comments" x-bind:key="comment.published">
<div class="p-4 bg-surface-100 dark:bg-surface-800 rounded-lg">
<div class="p-4 bg-surface-50 dark:bg-surface-800 rounded-lg border border-surface-200 dark:border-surface-700 shadow-sm">
<div class="flex items-start gap-3">
<template x-if="comment.author?.photo">
<img x-bind:src="comment.author.photo" x-bind:alt="comment.author.name"
@@ -90,7 +90,7 @@
<div class="flex items-center gap-2">
<a x-bind:href="comment.author?.url" class="font-medium text-sm hover:underline" target="_blank" rel="noopener"
x-text="comment.author?.name || comment.author?.url"></a>
<time class="text-xs text-surface-500" x-bind:datetime="comment.published"
<time class="text-xs text-surface-500 font-mono" x-bind:datetime="comment.published"
x-text="new Date(comment.published).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })"></time>
</div>
<div class="mt-1 text-sm prose dark:prose-invert" x-html="comment.content?.html || comment.content?.text"></div>