Merge pull request #20 from zackha/development

Development

app/app.vue

@@ -11,7 +11,11 @@ const emptyHabits = computed(() => habits.value?.length === 0);
 
 useHead({
   htmlAttrs: { lang: 'en' },
-  link: [{ rel: 'icon', href: '/icon.png' }],
+  link: [
+    { rel: 'icon', href: '/icon.png' },    
+    { rel: 'apple-touch-icon', href: '/icon.png' },
+    { rel: 'msapplication-TileImage', href: '/icon.png' },
+  ],
 });
 
 useSeoMeta({
@@ -23,6 +27,13 @@ useSeoMeta({
   twitterCard: 'summary_large_image',
   ogImage: '/social-card.png',
   twitterImage: '/social-card.png',
+  ogType: 'website',
+  ogUrl: 'https://habit.vercel.app',
+  ogSiteName: 'Habit',
+  twitterCreator: '@ZHatlen',
+  twitterSite: '@ZHatlen',
+  robots: 'index, follow',
+  keywords: 'habit, tracker, daily, habits, management, tool, minimalistic',
 });
 </script>
 

app/components/Container.vue

@@ -3,7 +3,7 @@
     <div class="fzypcq">
       <slot />
     </div>
-    <div class="absolute h-dvh w-screen bg-cover bg-center blur transition-opacity duration-300" style="background-image: url('/bg/bg1.jpg')"></div>
+    <div class="iPbnzK"></div>
   </div>
 </template>
 
@@ -15,4 +15,9 @@
 .fzypcq {
   @apply z-10 mx-auto flex w-full max-w-sm flex-col items-center justify-center gap-4 p-5;
 }
+
+.iPbnzK {
+  @apply absolute h-dvh w-screen bg-cover bg-center blur transition-opacity duration-300;
+  background-image: url('/bg/bg1.jpg');
+}
 </style>