Merge pull request #598 from add2cal/dev

Dev

README.md

@@ -4,7 +4,6 @@
 [![npm Installations Total](https://img.shields.io/npm/dt/add-to-calendar-button?label=npm%20Installations&style=for-the-badge)](https://www.npmjs.com/package/add-to-calendar-button)
 [![npm Installations per Month](https://img.shields.io/npm/dm/add-to-calendar-button?label=npm%20Installations%2FMonth&style=for-the-badge)](https://www.npmjs.com/package/add-to-calendar-button)
 [![jsDelivr npm Hits](https://img.shields.io/jsdelivr/npm/hm/add-to-calendar-button?label=jsDelivr%20npm%20hits&style=for-the-badge)](https://www.jsdelivr.com/package/npm/add-to-calendar-button?tab=stats)
-![npm bundle size](https://img.shields.io/bundlephobia/minzip/add-to-calendar-button?style=for-the-badge)
 
 <br />
 

demo/components/header.vue

@@ -10,7 +10,9 @@ const localePath = useLocalePath();
   <div :class="view.atTopOfPage ? 'py-5 shadow-lg' : 'py-3 shadow-xl lg:py-5 lg:shadow-lg'" class="fixed top-0 z-50 w-full bg-gradient-to-tr from-primary from-50% to-primary-light transition-all dark:from-primary-darkest dark:to-primary-darker lg:relative">
     <div class="container flex justify-between">
       <div :class="view.atTopOfPage ? '-ml-2 max-w-[150px]' : '-ml-3 max-w-[100px] lg:-ml-2 lg:max-w-[150px]'" class="-mt-1 w-auto grow transition-all xl:ml-0">
-        <NuxtLink :to="localePath('index')"><Logo class="force-light" /></NuxtLink>
+        <NuxtLink :to="localePath('index')">
+          <Logo class="force-light" />
+        </NuxtLink>
       </div>
       <NavigationBar />
     </div>

demo/components/playground/playgroundArea.vue

@@ -93,7 +93,7 @@ watch(showMC, val => {
         <LayoutAttrs v-model="data.layout" mobile />
       </div>
     </div>
-    <div class="sticky bottom-0 left-0 flex h-20 w-full cursor-pointer justify-center bg-secondary text-lg font-semibold text-zinc-700 hover:bg-secondary-light hover:text-black" @click="(showMC = !showMC)">
+    <div class="sticky bottom-0 left-0 z-50 flex h-20 w-full cursor-pointer justify-center bg-secondary text-lg font-semibold text-zinc-700 hover:bg-secondary-light hover:text-black" @click="(showMC = !showMC)">
       <div class="flex self-center">
         <div>
           <CheckIcon class="-mt-1.5 mr-2 inline-block h-7 w-7" aria-hidden="true" />

demo/locales/en.json

@@ -148,7 +148,7 @@
   },
   "meta": {
     "title": "{title} {'|'} Free Add to Calendar Button",
-    "title_main": "Try this Free Add to Calendar Button",
+    "title_main": "The real Free Add to Calendar Button",
     "title_slug": "convenient event sharing",
     "keywords": "calendar, event, sharing, button, script, widget, rsvp, javascript, angular, react, vue, svelte, astro, web component, outlook, ical, microsoft, teams, apple, google, yahoo, free",
     "description": "Experience the interactive demo and tutorials on how to create a button, which adds events to your users' calendars. Free, quick, and convenient.",