Code for my personal website
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat: create Comment component

+31
+23
src/components/Comment.astro
··· 1 + --- 2 + import type { Comment } from '@/types'; 3 + 4 + interface Props { 5 + comment: Comment; 6 + } 7 + 8 + const { comment } = Astro.props; 9 + --- 10 + 11 + <div 12 + class='w-full flex flex-col gap-2 pb-2 border-b dark:border-b-stone-100/25 border-b-bg-dark/25' 13 + > 14 + <div class='w-full flex justify-start items-baseline gap-4'> 15 + <span class='font-bold leading-tight'> 16 + {comment.commenter.realName || comment.commenter.displayName} 17 + </span> 18 + <span class='font-thin text-sm leading-tight text-gray-500'> 19 + {comment.updatedAt} 20 + </span> 21 + </div> 22 + <span>{comment.content}</span> 23 + </div>
+8
src/styles/globals.css
··· 44 44 @apply prose-headings:text-black prose-headings:dark:text-white; 45 45 } 46 46 47 + input { 48 + @apply text-base p-1 focus:outline-none focus:ring-2 focus:ring-lime-600 dark:focus:ring-lime-300; 49 + } 50 + 51 + textarea { 52 + @apply text-base p-1 focus:outline-none focus:ring-2 focus:ring-lime-600 dark:focus:ring-lime-300; 53 + } 54 + 47 55 @layer utilities { 48 56 article a { 49 57 @apply font-sans text-current underline underline-offset-2;