From 7147f930e4b6eb17b960f2bafba3b21ebbd68177 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jan=20Fr=C3=B6hlich?= <jan.froehlich.janf@gmail.com>
Date: Thu, 30 Jan 2025 00:35:07 +0100
Subject: [PATCH] feat: uniform border radii

---
 app/assets/css/main.css                 | 4 ++++
 app/components/AppHeader.vue            | 2 +-
 app/components/content/Album.vue        | 6 +++---
 app/components/content/Gallery.vue      | 2 +-
 app/components/content/ImageCaption.vue | 2 +-
 app/components/content/Maps.vue         | 2 +-
 app/pages/index.vue                     | 4 ++--
 content/index.yaml                      | 4 ++--
 8 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/app/assets/css/main.css b/app/assets/css/main.css
index 98cb1b9..aa1fc21 100644
--- a/app/assets/css/main.css
+++ b/app/assets/css/main.css
@@ -47,6 +47,10 @@
   --color-raisin-cool: #242A32;
 
   --ui-primary: var(--color-primary-900);
+
+  /* Sizing */
+  --radius: var(--radius-sm);
+  --ui-radius: var(--radius);
 }
 
 @layer theme {
diff --git a/app/components/AppHeader.vue b/app/components/AppHeader.vue
index 1361ab7..f11b804 100644
--- a/app/components/AppHeader.vue
+++ b/app/components/AppHeader.vue
@@ -5,7 +5,7 @@ const appConfig = useAppConfig()
 <template>
   <UHeader>
     <template #title>
-      <Logo class="w-auto h-12 dark:bg-white rounded-md p-1" />
+      <Logo class="w-auto h-12 dark:bg-white rounded p-1" />
     </template>
 
     <UNavigationMenu :items="appConfig.links.header" />
diff --git a/app/components/content/Album.vue b/app/components/content/Album.vue
index f459996..549c51d 100644
--- a/app/components/content/Album.vue
+++ b/app/components/content/Album.vue
@@ -18,9 +18,9 @@ const previewImage = images[0]
 <template>
   <figure class="!my-0 pt-2 cursor-pointer overflow-hidden min-w-[12rem] lg:min-w-0 flex-1" @click="$emit('selectAlbum', path, images)">
     <div class="relative w-full aspect-square">
-      <div class="absolute -top-2 h-full inset-x-2.5 rounded-md opacity-50 bg-neutral-400 border border-neutral-200 dark:border-neutral-900" />
-      <div class="absolute -top-1 h-full inset-x-1.5 rounded-md bg-neutral-400 border border-neutral-200 dark:border-neutral-900" />
-      <img :src="previewImage?.src" :alt="previewImage?.alt" class="absolute h-full w-full top-0 rounded-md m-0 object-cover border border-neutral-200 dark:border-neutral-900 ">
+      <div class="absolute -top-2 h-full inset-x-2.5 rounded opacity-50 bg-neutral-400 border border-neutral-200 dark:border-neutral-900" />
+      <div class="absolute -top-1 h-full inset-x-1.5 rounded bg-neutral-400 border border-neutral-200 dark:border-neutral-900" />
+      <img :src="previewImage?.src" :alt="previewImage?.alt" class="absolute h-full w-full top-0 rounded m-0 object-cover border border-neutral-200 dark:border-neutral-900 ">
     </div>
     <figcaption class="font-medium text-sm mt-3">
       <ProseH3 class="m-0 font-sans! text-lg">
diff --git a/app/components/content/Gallery.vue b/app/components/content/Gallery.vue
index 4fe14de..a92157c 100644
--- a/app/components/content/Gallery.vue
+++ b/app/components/content/Gallery.vue
@@ -30,7 +30,7 @@ function selectAlbum(path: string, images: { src: string, alt: string | undefine
     </template>
 
     <UPageColumns>
-      <img v-for="img in gallery" :key="img.src" :src="img.src" :alt="img.alt" class="w-full rounded-md border border-neutral-200 dark:border-neutral-800">
+      <img v-for="img in gallery" :key="img.src" :src="img.src" :alt="img.alt" class="w-full rounded border border-neutral-200 dark:border-neutral-800">
     </UPageColumns>
   </UPage>
 </template>
diff --git a/app/components/content/ImageCaption.vue b/app/components/content/ImageCaption.vue
index 71a9b2a..04f7c08 100644
--- a/app/components/content/ImageCaption.vue
+++ b/app/components/content/ImageCaption.vue
@@ -12,7 +12,7 @@ defineProps<{
     <slot name="image">
       <NuxtImg
         placeholder :src :alt :class="imgClass"
-        class="mb-1 border border-neutral-200 dark:border-neutral-800 w-96 lg:w-[28rem] group-left:min-w-full group-right:min-w-full"
+        class="mb-1 border border-neutral-200 dark:border-neutral-800 w-96 rounded lg:w-[28rem] group-left:min-w-full group-right:min-w-full"
       />
     </slot>
 
diff --git a/app/components/content/Maps.vue b/app/components/content/Maps.vue
index 9bc2fc7..9b03780 100644
--- a/app/components/content/Maps.vue
+++ b/app/components/content/Maps.vue
@@ -97,7 +97,7 @@ const options = {
     :center="center"
     :zoom="16"
     :options="options"
-    class="w-full min-h-96 h-[60dvh] rounded-md overflow-hidden border border-neutral-200 dark:border-neutral-800"
+    class="w-full min-h-96 h-[60dvh] rounded overflow-hidden border border-neutral-200 dark:border-neutral-800"
   >
     <GMapCluster>
       <GMapMarker
diff --git a/app/pages/index.vue b/app/pages/index.vue
index 3e1d20e..4ddaef4 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -44,10 +44,10 @@ useSeoMeta({
         <div class="relative">
           <img
             :src="page.hero.image?.src"
-            class="lg:block relative w-full lg:h-[360px] xl:h-[380px] 2xl:h-[420px] sm:rounded-lg aspect-[19/9] sm:aspect-[20/9] md:aspect-[21/9] lg:aspect-[7/5] xl:aspect-[16/9] object-cover md:object-[25%]"
+            class="lg:block relative w-full lg:h-[360px] xl:h-[380px] 2xl:h-[420px] sm:rounded aspect-[19/9] sm:aspect-[20/9] md:aspect-[21/9] lg:aspect-[7/5] xl:aspect-[16/9] object-cover md:object-[25%]"
             alt=""
           >
-          <div class="hidden lg:block absolute inset-2 border border-4 border-white dark:border-neutral-900 rounded-md" />
+          <div class="hidden lg:block absolute inset-2 border border-4 border-white dark:border-neutral-900 rounded" />
         </div>
       </div>
     </UPageSection>
diff --git a/content/index.yaml b/content/index.yaml
index 82f7094..f1203ef 100644
--- a/content/index.yaml
+++ b/content/index.yaml
@@ -56,7 +56,7 @@ sections:
     image:
       src: /images/home-2.jpg
       alt: Grabmale Image
-      class: 'rounded-md'
+      class: 'rounded'
   - icon: i-ph-bank-duotone
     title: Restaurierungen
     description: >
@@ -81,7 +81,7 @@ sections:
     image:
       src: /images/home-1.jpg
       alt: Restaurierungen Image
-      class: 'rounded-md'
+      class: 'rounded'
 ui:
   footer:
     wave: fill-neutral-100 dark:fill-raisin