Update the documentation.

Author: antoniandre

README.md

@@ -5,7 +5,7 @@
 [![npm](https://img.shields.io/npm/dt/vueperslides.svg)](https://www.npmjs.com/package/vueperslides)
 [![npm](https://img.shields.io/npm/dw/vueperslides.svg)](https://www.npmjs.com/package/vueperslides)
 
-> A touch ready and responsive slideshow / carousel for Vue and Vue 3.
+> A touch ready and responsive slideshow / carousel for Vue 3 and 2.
 
 ## Installation
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "vueperslides",
   "version": "3.3.2",
-  "description": "A touch ready and responsive slideshow for Vue and Vue 3.",
+  "description": "A touch ready and responsive slideshow for Vue 3 and 2.",
   "author": "Antoni Andre <[email protected]>",
   "scripts": {
     "serve": "vue-cli-service serve",

src/documentation/index.vue

@@ -21,7 +21,7 @@
     a(id="features" name="features")
   div.max-widthed.mb5.features
     w-icon.pr2(color="secondary" lg) material-icons check
-    strong SUPPORTS VUE 3.
+    strong SUPPORTS VUE 3 and VUE 2.
     br
     w-icon.pr2(color="secondary" lg) material-icons check
     strong Supports Videos with customizable attributes.
@@ -65,23 +65,23 @@
     w-alert.ma0.pl5(border-left color="pink" style="width: 100%;max-width: 620px")
       | If you like Vueper Slides, you can
       a.pink.mx2(
-        href="https://www.paypal.me/antoniandre1"
+        href="https://github.com/sponsors/antoniandre"
         target="_blank"
-        style="text-decoration: underline") #[strong Support the project]
+        style="text-decoration: underline") #[strong Sponsor me]
       | or
       a.pink.ml2(
-        href="https://github.com/sponsors/antoniandre"
+        href="https://www.paypal.me/antoniandre1"
         target="_blank"
-        style="text-decoration: underline") #[strong Sponsor the author]
+        style="text-decoration: underline") #[strong buy me a coffee]
       | !
-      div Thank you so much to all the supporters! #[span.title2.ml1 🙏]
+      div Thank you so much to all the backers! #[span.title2.ml1 🙏]
 
   w-flex.max-widthed.my8(align-center)
     svg.mr4.blue-light1(viewBox="0 0 725 477" style="width: 50px;stroke: #497ca2;stroke-width: 5px")
       path(fill="#497ca2" d="M449 0c-78 5-152 39-217 82-19 13-37 26-54 40-39 1-77 15-110 34-34 21-53 60-61 99-11 52-8 108 6 159 7 23 16 46 33 63 4-4 13-4 13-11-1-5-7-8-9-14-27-48-32-108-11-159 13-32 36-63 68-77 19-9 42-7 58 6 6 7 18 4 24-2 6-4 11-10 19-10-24 25-39 60-38 95 1 15 3 31 8 45 16 36 41 69 76 89 5 2 10 6 16 7 5-2 14-5 14-12-4-9-14-12-21-18-27-23-56-48-67-82-9-29-1-60 8-88 7-15 21-32 39-29 15 1 28 13 43 8 11-5 13-17 16-27 5-17 3-38-10-51-16-18-40-23-62-25l-11-2c23-19 53-26 81-31 21-3 43-5 64-2 18 3 28 21 42 31-33 47-57 102-56 159a170 170 0 0086 149c6-1 13-7 10-14-5-11-17-16-25-25-33-30-52-75-50-121 1-29 11-58 24-84 12-25 25-52 47-71 9-8 22-13 33-7 20 8 42 14 63 13-35 27-55 70-64 113-9 44-7 91 12 133 15 37 45 68 81 85 32 16 67 24 101 27 18 1 36 2 53-4 4-1 6-7 2-9-13-6-28-4-42-6-45-5-92-16-127-45-34-28-54-71-60-114-5-47 7-97 34-137 11-15 26-31 45-34 14-1 25 12 31 23 6 12 16 24 29 28 20-10 40-26 43-50 2-17-6-34-14-49-15-25-40-43-69-48-20-5-41-2-61-6-22-21-54-24-83-24zm6 21c22 0 48 5 62 25 4 7 8 16 8 24-1 10-10 22-21 19-9-7-18-14-30-16-14-4-31-1-43 8-6 6-17 8-24 2-9-6-17-15-28-17-27-7-54 1-81 6a364 364 0 01157-51zm117 29c33 0 66 25 72 58 3 12 3 28-8 35-3 2-6 4-8 1-8-12-12-27-23-37-3-7-12-8-19-9-13-2-26 0-39-4 7-7 6-17 4-25l-3-16 24-3zm-372 92l46 2c18 2 33 16 34 34 1 7 1 17-6 21-6 0-12-4-18-6-21-8-46-14-67-3-6 2-11 9-17 5-10-4-18-14-30-12-30 1-56 21-77 42-16 17-30 37-43 56 0-39 17-80 49-104 26-22 61-30 94-34l35-1z")
     w-alert.ma0.pl5(border-left color="pale-blue" style="width: 100%;max-width: 620px")
       strong
-        | Check out my new UI framework for Vue & Vue 3!
+        | Check out my UI framework for Vue & Vue 3!
         a.title2.ml4(
           href="https://antoniandre.github.io/wave-ui"
           target="_blank"
@@ -93,9 +93,11 @@
     a(id="installation" name="installation")
   p You have two options: #[em.mr1 NPM] or #[span.ml1.code <script>] tag.
   h3.mt12 Via NPM
-  ssh-pre(language="shell") npm i vueperslides # Vue 2.x.
-  ssh-pre(language="shell") npm i vueperslides@next # Vue 3.
-  p.mt8 Then import the 2 components and use it:
+  .mt6.w-flex.align-center.mt2.xs-column.xs-align-start
+    ssh-pre.my0(language="shell") npm i vueperslides # Vue 3.
+    span.mx6 or
+    ssh-pre.my0(language="shell") npm i vueperslides@legacy # Vue 2.
+  p.mt4 Then import the 2 components and use it:
   ssh-pre(language="js" label="Javascript").
     // In your Vue.js component.
     import { VueperSlides, VueperSlide } from 'vueperslides'