docs: improve accessibility

docs/components/color-picker/ColorPicker.vue

@@ -1,7 +1,7 @@
 <template>
   <UPopover mode="hover">
     <template #default="{ open }">
-      <UButton color="gray" variant="ghost" square :class="[open && 'bg-gray-50 dark:bg-gray-800']">
+      <UButton color="gray" variant="ghost" square :class="[open && 'bg-gray-50 dark:bg-gray-800']" aria-label="Color picker">
         <UIcon name="i-heroicons-swatch-20-solid" class="w-5 h-5 text-primary-500 dark:text-primary-400" />
       </UButton>
     </template>

docs/components/content/examples/VerticalNavigationExampleAvatarSlot.vue

@@ -2,8 +2,7 @@
 const links = [{
   avatar: {
     src: 'https://ipx.nuxt.com/s_16x16/gh_avatar/benjamincanac',
-    srcset: 'https://ipx.nuxt.com/s_32x32/gh_avatar/benjamincanac 2x',
-    alt: 'benjamincanac'
+    srcset: 'https://ipx.nuxt.com/s_32x32/gh_avatar/benjamincanac 2x'
   },
   label: 'benjamincanac',
   to: 'https://github.com/benjamincanac',
@@ -11,8 +10,7 @@ const links = [{
 }, {
   avatar: {
     src: 'https://ipx.nuxt.com/s_16x16/gh_avatar/Atinux',
-    srcset: 'https://ipx.nuxt.com/s_32x32/gh_avatar/Atinux 2x',
-    alt: 'Atinux'
+    srcset: 'https://ipx.nuxt.com/s_32x32/gh_avatar/Atinux 2x'
   },
   label: 'Atinux',
   to: 'https://github.com/Atinux',
@@ -20,8 +18,7 @@ const links = [{
 }, {
   avatar: {
     src: 'https://ipx.nuxt.com/s_16x16/gh_avatar/smarroufin',
-    srcset: 'https://ipx.nuxt.com/s_32x32/gh_avatar/smarroufin 2x',
-    alt: 'smarroufin'
+    srcset: 'https://ipx.nuxt.com/s_32x32/gh_avatar/smarroufin 2x'
   },
   label: 'smarroufin',
   to: 'https://github.com/smarroufin',

docs/components/home/HomeDemo.vue

@@ -2,7 +2,7 @@
   <Transition appear name="fade">
     <ULandingGrid class="lg:grid-cols-10 lg:gap-8">
       <div class="col-span-8 flex items-center">
-        <RangeExample />
+        <RangeExample aria-label="Range" />
       </div>
 
       <div class="col-span-2 row-span-2 flex items-center">