Layout Changes

Small tweaks to the layout

src/components/ui/image-gallery.tsx

@@ -27,7 +27,7 @@ export function ImageGallery({ images, className }: ImageGalleryProps) {
 
   return (
     <div className={cn("w-full", className)}>
-      <div className="bg-stone relative aspect-[16/9] w-full overflow-hidden rounded-md">
+      <div className="bg-stone relative aspect-[16/9] w-full overflow-hidden">
         {/* eslint-disable-next-line @next/next/no-img-element -- local/user-supplied URL, same pattern used app-wide */}
         <img src={active.url} alt={active.caption ?? ""} className="h-full w-full object-cover" />
         {images.length > 1 && (
@@ -36,7 +36,7 @@ export function ImageGallery({ images, className }: ImageGalleryProps) {
               type="button"
               onClick={() => goTo(activeIndex - 1)}
               aria-label="Previous image"
-              className="bg-ink/60 hover:bg-ink/80 absolute top-1/2 left-3 flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-md text-white"
+              className="bg-ink/60 hover:bg-ink/80 absolute top-1/2 left-3 flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-sm text-white"
             >
               <ChevronLeft className="h-4 w-4" aria-hidden="true" />
             </button>
@@ -53,7 +53,7 @@ export function ImageGallery({ images, className }: ImageGalleryProps) {
       </div>
 
       {images.length > 1 && (
-        <div className="mt-2 flex gap-2 overflow-x-auto pb-1">
+        <div className="px-1 mt-1 flex gap-1 overflow-x-auto">
           {images.map((image, index) => (
             <button
               key={image.id}
@@ -62,7 +62,7 @@ export function ImageGallery({ images, className }: ImageGalleryProps) {
               aria-label={`Show image ${index + 1}`}
               aria-current={index === activeIndex}
               className={cn(
-                "h-14 w-20 shrink-0 overflow-hidden rounded-lg border-2",
+                "h-14 w-20 shrink-0 overflow-hidden border-2",
                 index === activeIndex ? "border-ink" : "border-transparent opacity-70",
               )}
             >