feat: Revamp notification and audio preferences (#9312)

Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>

app/javascript/v3/components/Form/Button.vue

@@ -58,7 +58,8 @@ const attrs = useAttrs();
 const baseClasses = {
   outline: 'outline outline-1 -outline-offset-1 focus:ring focus:ring-offset-1',
   ghost: 'hover:text-600 active:text-600 focus:ring focus:ring-offset-1',
-  solid: 'hover:bg-700 active:bg-700 focus:ring focus:ring-offset-1',
+  solid:
+    'hover:bg-700 active:bg-700 focus:ring focus:ring-offset-1 focus:ring-2',
 };
 
 const colorClass = computed(() => {