upgraded nuxt

shunwman · Feb 11, 2021 · 8024a1f · 8024a1f
1 parent f4d3aa9
commit 8024a1f
Show file tree

Hide file tree

Showing 5 changed files with 2,194 additions and 1,552 deletions.
diff --git a/assets/css/tailwind.css b/assets/css/tailwind.css
@@ -1,8 +1,8 @@
-@import 'tailwindcss/base';
-@import 'tailwindcss/components';
-@import 'tailwindcss/utilities';
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
 
-.field-container {
+.stepC {
   margin-left: 0;
   margin-right: 0;
 }
@@ -18,13 +18,14 @@
   background-color: #38a169;
   border-color: #38a169;
 }
-
-.device-curve {
+#device {
   border-radius: 2rem;
+  width: 100%;
 }
 .max-hd {
   scrollbar-width: none;
   -ms-overflow-style: none;
+  max-height: 100vh;
 }
 .max-hd::-webkit-scrollbar {
   display: none;
@@ -36,12 +37,30 @@
 .theme-one::-webkit-scrollbar {
   display: none;
 }
+.footer {
+  display: flex;
+}
+.stepC.actions {
+  display: grid;
+  grid-gap: 1.5rem;
+  justify-content: space-between;
+  grid-template-columns: repeat(auto-fill, minmax(3rem, auto));
+}
+
 @media (min-width: 640px) {
+  .footer {
+    display: none;
+  }
   .max-hd {
-    max-height: 60vh;
+    max-height: 38rem;
   }
-  .field-container {
+  .stepC {
     margin-left: 0.5rem;
     margin-right: 0.5rem;
   }
 }
+@media (min-width: 480px) {
+  #device {
+    max-width: 24rem;
+  }
+}
diff --git a/nuxt.config.js b/nuxt.config.js
@@ -3,7 +3,7 @@ export default {
    ** Nuxt rendering mode
    ** See https://nuxtjs.org/api/configuration-mode
    */
-  mode: 'spa',
+  ssr: false,
   /*
    ** Nuxt target
    ** See https://nuxtjs.org/api/configuration-target
@@ -17,31 +17,31 @@ export default {
     ogType: 'website',
     ogImage: '/maskable_512.png',
     // ogUrl: false,
-    ogTitle: 'Digital Business Card Generator - Free & Open-Source',
+    ogTitle: 'EnBizCard - An Open-Source Digital Business Card Generator',
     ogDescription:
-      'Stop printing. Start hosting! Quickly generate an interactive and responsive HTML-based digital business card, that can be hosted with your website.',
-    ogSiteName: 'Digital Business Card Generator - Free & Open-Source',
-    theme_color: '#38A169',
+      'EnBizCard helps you create interactive and responsive HTML-based digital business card that can be hosted with your website.',
+    ogSiteName: 'EnBizCard - An Open-Source Digital Business Card Generator',
+    theme_color: '#111827',
     author: 'Vishnu Raghav',
     lang: 'en',
-    name: 'Digital Business Card Generator - Free & Open-Source',
+    name: 'EnBizCard - An Open-Source Digital Business Card Generator',
   },
   head: {
-    title: 'Digital Business Card Generator - Free & Open-Source',
+    title: 'EnBizCard - An Open-Source Digital Business Card Generator',
     meta: [
       { charset: 'utf-8' },
       { name: 'viewport', content: 'width=device-width, initial-scale=1' },
       {
         hid: 'description',
         name: 'description',
         content:
-          'Stop printing. Start hosting! Quickly generate an interactive and responsive HTML-based digital business card, that can be hosted with your website.',
+          'EnBizCard helps you create interactive and responsive HTML-based digital business card that can be hosted with your website.',
       },
       {
         hid: 'msapplication-TileColor',
         name: 'msapplication-TileColor',
         property: 'msapplication-TileColor',
-        content: '#38A169',
+        content: '#111827',
       },
       {
         hid: 'msapplication-TileImage',
@@ -54,7 +54,17 @@ export default {
       {
         rel: 'icon',
         type: 'image/x-icon',
-        href: '/favicon.ico',
+        href: '/favicon.ico?v=2',
+      },
+      {
+        rel: 'icon',
+        type: 'image/png',
+        href: '/favicon-16x16.png',
+      },
+      {
+        rel: 'icon',
+        type: 'image/png',
+        href: '/favicon-32x32.png',
       },
       {
         rel: 'apple-touch-icon',
@@ -63,19 +73,19 @@ export default {
       },
       {
         rel: 'mask-icon',
-        color: '#38A169',
+        color: '#111827',
         href: '/safari-pinned-tab.svg',
       },
     ],
     script: [{ src: '/qrcode.min.js' }],
   },
   manifest: {
-    name: 'Digital Business Card Generator - Free & Open-Source',
-    short_name: 'Digital Business Card Generator',
+    name: 'EnBizCard - An Open-Source Digital Business Card Generator',
+    short_name: 'EnBizCard',
     start_url: '/',
     display: 'standalone',
-    theme_color: '#38A169',
-    background_color: '#ffffff',
+    theme_color: '#111827',
+    background_color: '#111827',
     display: 'standalone',
     icons: [
       {