Merge remote-tracking branch 'origin/master' into docs

README.md

@@ -1,6 +1,8 @@
 # Shopify Polaris Vue
 
-Polaris Vue by Ownego only supports **Vue 3.3+**.
+### The whole new version Polaris Vue 2.0 has been released! :tada:
+
+Polaris Vue by Ownego supports **Vue 3.3+**.
 
 Polaris Vue based on [Shopify Polaris style guide](https://polaris.shopify.com/), built especially for Vue 3.
 We're trying to make it mostly close with Shopify style guide and get a better performance.

docs/.vitepress/config.mts

@@ -18,11 +18,14 @@ export default defineConfig({
 
   title: "Polaris Vue",
   titleTemplate: ":title — Shopify Polaris Vue by ownego",
-  description: "Shopify Polaris for VueJS 3",
+  description: "Shopify Polaris UI components for Vue 3, with better performance, small bundle size, 99% matching Shopify Polaris 12. Compatible with Vue 3.3+",
   head: [
     ['link', { rel: 'icon', href: '/polaris-vue/assets/images/favicon.ico' }],
     ['link', { rel: 'preconnect', href: 'https://cdn.shopify.com/' }],
     ['link', { rel: 'stylesheet', href: 'https://cdn.shopify.com/static/fonts/inter/inter.css', id: 'inter-font-link' }],
+    ['meta', { property: 'og:title', content: 'Shopify Polaris for VueJS 3' }],
+    ['meta', { property: 'og:description', content: 'Shopify Polaris UI components for Vue 3, with better performance, small bundle size, 99% matching Shopify Polaris 12. Compatible with Vue 3.3+' }],
+    ['meta', { property: 'og:image', content: 'https://github.com/ownego/polaris-vue/blob/master/public/images/banner.jpg?raw=true' }],
   ],
 
   rewrites: {

docs/index.md

@@ -6,7 +6,7 @@ title: Homepage
 hero:
   name: "Polaris Vue"
   text: "Shopify Polaris for VueJS 3"
-  tagline: "Better performance, small bundle size, 99% matching Shopify Polaris 12.\nCompatible with Vue 3.3 (and upcoming v3.4)"
+  tagline: "Better performance, small bundle size, 99% matching Shopify Polaris 12.\nCompatible with Vue 3.3+"
   image:
     src: /assets/images/b4s.svg
     alt: Shopify Polaris for VueJS 3
@@ -24,7 +24,7 @@ features:
     details: The whole library written on Shopify Polaris CSS. So its UI is 99% matching Shopify Polaris version.
     icon: <svg width="32" height="32" viewBox="-18 0 292 292" xmlns="http://www.w3.org/2000/svg"><path d="M223.774 57.34c-.201-1.46-1.48-2.268-2.537-2.357-1.055-.088-23.383-1.743-23.383-1.743s-15.507-15.395-17.209-17.099c-1.703-1.703-5.029-1.185-6.32-.805-.19.056-3.388 1.043-8.678 2.68-5.18-14.906-14.322-28.604-30.405-28.604-.444 0-.901.018-1.358.044C129.31 3.407 123.644.779 118.75.779c-37.465 0-55.364 46.835-60.976 70.635-14.558 4.511-24.9 7.718-26.221 8.133-8.126 2.549-8.383 2.805-9.45 10.462C21.3 95.806.038 260.235.038 260.235l165.678 31.042 89.77-19.42S223.973 58.8 223.775 57.34zM156.49 40.848l-14.019 4.339c.005-.988.01-1.96.01-3.023 0-9.264-1.286-16.723-3.349-22.636 8.287 1.04 13.806 10.469 17.358 21.32zm-27.638-19.483c2.304 5.773 3.802 14.058 3.802 25.238 0 .572-.005 1.095-.01 1.624-9.117 2.824-19.024 5.89-28.953 8.966 5.575-21.516 16.025-31.908 25.161-35.828zm-11.131-10.537c1.617 0 3.246.549 4.805 1.622-12.007 5.65-24.877 19.88-30.312 48.297l-22.886 7.088C75.694 46.16 90.81 10.828 117.72 10.828z" fill="#95BF46"/><path d="M221.237 54.983c-1.055-.088-23.383-1.743-23.383-1.743s-15.507-15.395-17.209-17.099c-.637-.634-1.496-.959-2.394-1.099l-12.527 256.233 89.762-19.418S223.972 58.8 223.774 57.34c-.201-1.46-1.48-2.268-2.537-2.357" fill="#5E8E3E"/><path d="M135.242 104.585l-11.069 32.926s-9.698-5.176-21.586-5.176c-17.428 0-18.305 10.937-18.305 13.693 0 15.038 39.2 20.8 39.2 56.024 0 27.713-17.577 45.558-41.277 45.558-28.44 0-42.984-17.7-42.984-17.7l7.615-25.16s14.95 12.835 27.565 12.835c8.243 0 11.596-6.49 11.596-11.232 0-19.616-32.16-20.491-32.16-52.724 0-27.129 19.472-53.382 58.778-53.382 15.145 0 22.627 4.338 22.627 4.338" fill="#FFF"/></svg>
   - title: Built for Shopify
-    details: Compatible with Vue 3.3 - and upcoming v3.4. Better performance, small bundle size. Much more easier to get B4S badge from Shopify.
+    details: Compatible with Vue 3.3+. Better performance, small bundle size. Much more easier to get B4S badge from Shopify.
     icon: <svg viewBox="0 0 512.001 512.001" width="30" height="30">
       <path style="fill:#FFDE33;" d="M50.867,487.021c-9.546,0-15.449-3.892-18.721-7.169c-3.281-3.281-7.19-9.207-7.169-18.797
         c0.06-30.337,44.249-89.278,54.667-99.614c6.547-6.488,17.106-6.477,23.632,0.055l47.226,47.226
@@ -80,17 +80,22 @@ import { withBase } from 'vitepress';
 
 ## Our Shopify brands
 
-We're using this library in our Shopify apps, and gain Built for Shopify badge. Check it out!
+We're using this library in our Shopify apps, and gain Built for Shopify badges. Check it out!
 
 <div style="display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 30px">
   <a href="https://qikify.com?utm_source=polaris-vue&utm_medium=referral&utm_campaign=website" target="_blank" rel="noopener noreferrer">
-    <img :src="withBase('/assets/images/qikify.svg')" alt="Ownego" class="light-mode-logo" width="44" style="margin: 20px auto;">
-    <img :src="withBase('/assets/images/qikify-white.svg')" alt="Ownego" class="dark-mode-logo" width="44" style="margin: 20px auto;">
+    <img :src="withBase('/assets/images/qikify.svg')" alt="Ownego" class="light-mode-logo" width="32" style="margin: 20px auto;">
+    <img :src="withBase('/assets/images/qikify-white.svg')" alt="Ownego" class="dark-mode-logo" width="32" style="margin: 20px auto;">
   </a>
 
   <a href="https://teeinblue.com?utm_source=polaris-vue&utm_medium=referral&utm_campaign=website" target="_blank" rel="noopener noreferrer">
-    <img :src="withBase('/assets/images/teeinblue.svg')" alt="Ownego" class="light-mode-logo" width="50" style="margin: 20px auto;">
-    <img :src="withBase('/assets/images/teeinblue-white.svg')" alt="Ownego" class="dark-mode-logo" width="50" style="margin: 20px auto;">
+    <img :src="withBase('/assets/images/teeinblue.svg')" alt="Ownego" class="light-mode-logo" width="36" style="margin: 20px auto;">
+    <img :src="withBase('/assets/images/teeinblue-white.svg')" alt="Ownego" class="dark-mode-logo" width="36" style="margin: 20px auto;">
+  </a>
+
+  <a href="https://tepo.app/?utm_source=polaris-vue&utm_medium=referral&utm_campaign=website" target="_blank" rel="noopener noreferrer">
+    <img :src="withBase('/assets/images/tepo.svg')" alt="Ownego" class="light-mode-logo" width="36" style="margin: 20px auto;">
+    <img :src="withBase('/assets/images/tepo-white.svg')" alt="Ownego" class="dark-mode-logo" width="36" style="margin: 20px auto;">
   </a>
 </div>