feat: add support for vertical maquees (fixes #15, #65, #78) (#152)

megasanjay · Jun 23, 2023 · fe5dbcc · fe5dbcc · vercel · Jun 23, 2023
1 parent fb3bfdc
commit fe5dbcc
Show file tree

Hide file tree

Showing 3 changed files with 215 additions and 36 deletions.
diff --git a/packages/playground/vite-project/src/App.vue b/packages/playground/vite-project/src/App.vue
@@ -1,6 +1,7 @@
 <template>
   <div>
     <HelloWorld msg="Hello Vue 3 + TypeScript + Vite + Vue3 Marquee" />
+
     <div>
       <p>Default</p>
       <Vue3Marquee>
@@ -49,12 +50,26 @@
         <img v-for="i in img_30" :key="i" height="80" :src="i" />
       </Vue3Marquee>
     </div>
+    <div>
+      <p>Gradient Length: 600px</p>
+      <Vue3Marquee :gradient="true" gradient-length="600px">
+        <img v-for="i in img_30" :key="i" height="80" :src="i" />
+      </Vue3Marquee>
+    </div>
     <div>
       <p>clone</p>
       <Vue3Marquee :clone="true" :duration="5">
         <img v-for="i in img_5" :key="i" height="80" :src="i" />
       </Vue3Marquee>
     </div>
+    <div>
+      <p>Vertical</p>
+      <div style="height: 500px; width: max-content">
+        <Vue3Marquee :vertical="true">
+          <img v-for="i in img_30" :key="i" height="50" :src="i" />
+        </Vue3Marquee>
+      </div>
+    </div>
     <div>
       <p>
         Fix for issue:

diff --git a/packages/vue3-marquee/package.json b/packages/vue3-marquee/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue3-marquee",
-  "version": "3.1.3",
+  "version": "3.2.0-beta.0",
   "license": "MIT",
   "description": "A simple marquee component with ZERO dependencies for Vue 3",
   "author": "Sanjay Soundarajan <[email protected]> (https://sanjaysoundarajan.dev)",