From 8626aac0049243de231401a01fe20092eeaf279c Mon Sep 17 00:00:00 2001
From: Nico Devs <3766839+nicodevs@users.noreply.github.com>
Date: Wed, 29 Jun 2022 11:32:31 -0300
Subject: [PATCH] docs: Add Vue School Sumer Sale banner (#1407)

---
 .../docs/.vitepress/components/Banner.vue     | 255 ++++++++----------
 .../vueschool/{vs-close.svg => close.svg}     |   2 +-
 .../public/images/vueschool/vs-backpack.png   | Bin 0 -> 6234 bytes
 .../images/vueschool/vs-fw-bg-small.svg       | 183 -------------
 .../docs/public/images/vueschool/vs-fw-bg.svg | 219 ---------------
 .../docs/public/images/vueschool/vs-iso.svg   |  16 +-
 .../docs/public/images/vueschool/vs-logo.svg  |  20 +-
 7 files changed, 140 insertions(+), 555 deletions(-)
 rename packages/docs/public/images/vueschool/{vs-close.svg => close.svg} (98%)
 create mode 100644 packages/docs/public/images/vueschool/vs-backpack.png
 delete mode 100644 packages/docs/public/images/vueschool/vs-fw-bg-small.svg
 delete mode 100644 packages/docs/public/images/vueschool/vs-fw-bg.svg

diff --git a/packages/docs/.vitepress/components/Banner.vue b/packages/docs/.vitepress/components/Banner.vue
index e45cf0ef3a..7b0f808507 100644
--- a/packages/docs/.vitepress/components/Banner.vue
+++ b/packages/docs/.vitepress/components/Banner.vue
@@ -1,32 +1,32 @@
 <template>
   <a
-    id="vs"
     v-if="isVisible"
-    href="https://vueschool.io/sales/price-increase-22?friend=vuerouter"
+    id="vs"
+    href="https://vueschool.io/sales/summer-vue/?friend=vuerouter"
     target="_blank"
-    rel="noreferrer"
-  >
+    rel="noreferrer">
+    <div class="vs-iso">
+      <img src="/images/vueschool/vs-iso.svg" alt="Vue School Logo">
+    </div>
     <div class="vs-logo">
-      <img src="/images/vueschool/vs-iso.svg" class="logo-small">
-      <img src="/images/vueschool/vs-logo.svg" class="logo-big">
+      <img src="/images/vueschool/vs-logo.svg" alt="Vue School Logo">
     </div>
     <div class="vs-core">
+      <div class="vs-backpack">
+        <img src="/images/vueschool/vs-backpack.png" alt="Backpack">
+      </div>
       <div class="vs-slogan">
-        <div class="vs-slogan-title">
-          Extended for <strong>48 hours!</strong>
-        </div>
-        <div class="vs-slogan-subtitle">
-          Get up to 40% off your Vue School Subscription
-        </div>
+        <span class="vs-slogan-light">Summer Sale:</span> Get the 3 months plan for only <span style="text-decoration: line-through">$75</span> $50
       </div>
       <div class="vs-button">
-        <div class="vs-button-inside">
-          GET OFFER
-        </div>
+        Get 33% OFF
       </div>
     </div>
-    <div id="vs-close" class="vs-close" @click.stop.prevent="close">
-      <img src="/images/vueschool/vs-close.svg" alt="Close">
+    <div
+      id="vs-close"
+      class="vs-close"
+      @click.stop.prevent="close">
+      <img src="/images/vueschool/close.svg" alt="Close">
     </div>
   </a>
 </template>
@@ -40,30 +40,27 @@ export default {
   },
   mounted () {
     const now = new Date()
-    const end = new Date('2022-05-04T00:00:00+02:00')
-    this.isVisible = !localStorage.getItem('VS_FW_22') && (now < end)
+    const end = new Date('2022-07-23T00:00:00+02:00')
+    this.isVisible = !localStorage.getItem('VS_SUMMER_22') && (now < end)
     if (this.isVisible) document.body.classList.add('has-top-banner')
   },
   methods: {
     close () {
       this.isVisible = false
       document.body.classList.remove('has-top-banner')
-      localStorage.setItem('VS_FW_22', 1)
+      localStorage.setItem('VS_SUMMER_22', 1)
     }
   }
 }
 </script>
 
 <style>
-@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
-
 #vs {
   align-items: center;
-  background-color: #000c19;
+  background-color: #202A5A;
   box-sizing: border-box;
   color: #fff;
-  display: flex;
-  font-family: 'Roboto', Oxygen, Fira Sans, Helvetica Neue, sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   justify-content: center;
   position: fixed;
   padding: 0 10px;
@@ -72,152 +69,128 @@ export default {
   top: 0;
   z-index: 100;
   height: 5rem;
-  line-height: 1;
-  background-image: url(/images/vueschool/vs-fw-bg-small.svg);
-  background-size: cover;
-  background-repeat: no-repeat;
+  display: flex;
 }
-
 #vs:hover {
   text-decoration: none;
 }
-
-#vs .vs-logo {
+@media (min-width: 680px) {
+  #vs {
+    height: 5rem;
+  }
+}
+#vs:hover .vs-core .vs-button {
+  background: #f22606;
+}
+#vs .vs-iso {
   position: absolute;
   left: 20px;
-  top: 20px;
-}
-
-#vs .vs-logo .logo-big {
+  height: 26px;
   display: none;
 }
-
-#vs:hover .vs-core .vs-button-inside {
-  background: linear-gradient(257deg, #e19b09 99%, #ffca24 6%);
+#vs .vs-iso img {
+  height: 26px;
 }
-
-#vs .vs-core .vs-slogan {
-  color: #fff;
-  margin-left: 8px;
-  text-align: center;
+@media (min-width: 680px) {
+  #vs .vs-iso {
+    left: 40px;
+    height: 40px;
+    display: inline-block;
+  }
+  #vs .vs-iso img {
+    height: 40px;
+  }
 }
-
-#vs .vs-core {
-  width: 190px;
-  align-items: center;
-  display: flex;
-  justify-content: center;
+@media (min-width: 900px) {
+  #vs .vs-iso {
+    display: none;
+  }
 }
-
-#vs .vs-core .vs-slogan .vs-slogan-subtitle {
-  font-size: 14px;
-  color: #cdc5dc;
-  margin-top: 8px;
+#vs .vs-logo {
+  position: absolute;
+  display: none;
+  left: 40px;
 }
-
-#vs .vs-core .vs-slogan .vs-slogan-title {
-  font-size: 16px;
-  font-weight: 800;
+@media (min-width: 900px) {
+  #vs .vs-logo {
+    display: block;
+  }
 }
-
-#vs .vs-core .vs-slogan .vs-slogan-title strong {
-  color: #fdc722;
+#vs .vs-core {
+  display: flex;
+  align-items: center;
 }
-
-#vs .vs-core .vs-button {
-  background: linear-gradient(0deg, #ffdf4c, #e29d0a);
-  padding: 2px;
-  margin-right: 18px;
-  margin-left: 16px;
-  border-radius: 30px;
-  display: none;
+#vs .vs-core .vs-backpack {
+  margin-right: 14px;
 }
-
-#vs .vs-core .vs-button-inside {
-  color: #000;
-  padding: 7px 10px;
-  font-weight: 800;
-  font-size: 22px;
-  white-space: nowrap;
-  border-radius: 30px;
-  background: linear-gradient(90deg, #FFC828, #E19C0E);
-  text-transform: uppercase;
+#vs .vs-core .vs-backpack img {
+  height: 38px;
 }
-
-#vs .vs-close {
-  right: 6px;
-  position: absolute;
+@media (min-width: 900px) {
+  #vs .vs-core .vs-backpack img {
+    height: 50px;
+  }
 }
-
-#vs .vs-close:hover {
-  color: #56d8ff;
+@media (min-width: 900px) {
+  #vs .vs-core .vs-backpack img {
+    height: 74px;
+  }
+}
+#vs .vs-core .vs-slogan {
+  color: #FFF;
+  font-weight: bold;
+  font-size: 14px;
+  margin-right: 26px;
 }
-
 @media (min-width: 680px) {
-  #vs {
-    background-image: url(/images/vueschool/vs-fw-bg.svg);
-    background-position: top right -110px;
-  }
-
   #vs .vs-core .vs-slogan {
-    margin-left: 24px;
-    width: auto;
-  }
-
-  #vs .vs-core .vs-slogan .vs-slogan-subtitle {
+    margin-right: 0;
     font-size: 16px;
   }
-
-  #vs .vs-core .vs-slogan .vs-slogan-title {
-    font-size: 18px;
+}
+@media (min-width: 900px) {
+  #vs .vs-core .vs-slogan {
+    font-size: 20px;
   }
-
+}
+#vs .vs-core .vs-slogan > .vs-slogan-light {
+  color: #ff5338;
+  display: block;
+  text-align: left;
+}
+@media (min-width: 900px) {
+  #vs .vs-core .vs-slogan > .vs-slogan-light {
+    text-align: center;
+    display: inline;
+  }
+}
+#vs .vs-core .vs-button {
+  margin-left: 43px;
+  color: #fff;
+  padding: 13px 24px;
+  border-radius: 40px;
+  display: none;
+  background: #ff5338;
+  font-weight: bold;
+  text-transform: uppercase;
+}
+@media (min-width: 680px) {
   #vs .vs-core .vs-button {
     display: inline-block;
-    margin-right: 0;
-    margin-left: 22px;
-  }
-
-  #vs .vs-core .vs-button-inside {
-    padding: 8px 24px;
   }
-
+}
+#vs .vs-close {
+  right: 10px;
+  position: absolute;
+  padding: 10px;
+}
+@media (min-width: 680px) {
   #vs .vs-close {
-    padding: 10px;
     right: 20px;
   }
 }
-
-@media (min-width: 768px) {
-  #vs .vs-logo .logo-small {
-    display: none;
-  }
-
-  #vs .vs-logo .logo-big {
-    display: inline-block;
-  }
-
-  #vs .vs-core {
-    width: 430px;
-  }
-}
-
-@media (min-width: 1024px) {
-  #vs {
-    background-position: top right;
-  }
-
-  #vs .vs-core .vs-slogan .vs-slogan-title {
-    font-size: 24px;
-  }
-
-  #vs .vs-core .vs-button {
-    margin-left: 69px;
-  }
-
-  #vs .vs-core {
-    width: auto;
-  }
+#vs .vs-close:hover {
+  color: #56d8ff;
 }
 
 /********************************************/
diff --git a/packages/docs/public/images/vueschool/vs-close.svg b/packages/docs/public/images/vueschool/close.svg
similarity index 98%
rename from packages/docs/public/images/vueschool/vs-close.svg
rename to packages/docs/public/images/vueschool/close.svg
index 0e2f31fcd4..a9d51d1d86 100644
--- a/packages/docs/public/images/vueschool/vs-close.svg
+++ b/packages/docs/public/images/vueschool/close.svg
@@ -4,4 +4,4 @@
             <path d="M1569.69 33.321c-.415-.414-1.084-.414-1.498 0L1563 38.503l-5.192-5.192c-.414-.415-1.083-.415-1.497 0-.415.414-.415 1.083 0 1.497l5.192 5.192-5.192 5.192c-.415.414-.415 1.083 0 1.497.414.415 1.083.415 1.497 0l5.192-5.192 5.192 5.192c.414.415 1.083.415 1.497 0 .415-.414.415-1.083 0-1.497L1564.497 40l5.192-5.192c.404-.404.404-1.083 0-1.487z" transform="translate(-1556.000000, -33.000000)"/>
         </g>
     </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/packages/docs/public/images/vueschool/vs-backpack.png b/packages/docs/public/images/vueschool/vs-backpack.png
new file mode 100644
index 0000000000000000000000000000000000000000..43807ff60d253f86445b638697960cf25a11c2e8
GIT binary patch
literal 6234
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

literal 0
HcmV?d00001

diff --git a/packages/docs/public/images/vueschool/vs-fw-bg-small.svg b/packages/docs/public/images/vueschool/vs-fw-bg-small.svg
deleted file mode 100644
index a914f40050..0000000000
--- a/packages/docs/public/images/vueschool/vs-fw-bg-small.svg
+++ /dev/null
@@ -1,183 +0,0 @@
-<svg width="375" height="80" viewBox="0 0 375 80" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <defs>
-        <linearGradient x1="44.505%" y1="63.572%" x2="38.734%" y2="35.987%" id="xyjb951esd">
-            <stop stop-color="#100122" offset="0%"/>
-            <stop offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="ladppv4vnf">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="crxo99pdog">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.011%" y1="98.997%" x2="50.011%" y2="0%" id="l018dwim3h">
-            <stop stop-color="#100122" offset="0%"/>
-            <stop stop-color="#100222" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="vf87rf4i9i">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="n2ips3meoj">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.011%" y1="98.997%" x2="50.011%" y2="0%" id="5lfox0f34k">
-            <stop stop-color="#100122" offset="0%"/>
-            <stop stop-color="#100222" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="67.838%" y1="49.111%" x2="77.139%" y2="52.125%" id="glljbgkral">
-            <stop stop-color="#463487" offset="0%"/>
-            <stop stop-color="#352869" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="7zcs47oy5m">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="1ivo9tc94n">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.011%" y1="98.997%" x2="50.011%" y2="0%" id="jtz1zgl29o">
-            <stop stop-color="#100122" offset="0%"/>
-            <stop stop-color="#100222" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="85.547%" y1="49.383%" x2="0%" y2="50.617%" id="shrr9bnubp">
-            <stop stop-color="#3AAB82" offset="0%"/>
-            <stop stop-color="#352869" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="tv07ok373q">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="eoraskrsfr">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.011%" y1="98.997%" x2="50.011%" y2="0%" id="cimbnvk4us">
-            <stop stop-color="#100122" offset="0%"/>
-            <stop stop-color="#100222" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="85.547%" y1="49.111%" x2="0%" y2="50.889%" id="b2acvzbj7t">
-            <stop stop-color="#41878F" offset="0%"/>
-            <stop stop-color="#352869" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="totw3crrmu">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="s5bxokedgv">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.011%" y1="98.997%" x2="50.011%" y2="0%" id="x8jdggif0x">
-            <stop stop-color="#100122" offset="0%"/>
-            <stop stop-color="#100222" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="85.547%" y1="48.98%" x2="0%" y2="51.02%" id="bvdunkfahy">
-            <stop stop-color="#1B2A68" offset="0%"/>
-            <stop stop-color="#352869" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="9resnyc60z">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <linearGradient x1="50.02%" y1="100%" x2="50.02%" y2="-.011%" id="9znzegdhvA">
-            <stop stop-color="#241644" offset="0%"/>
-            <stop stop-color="#040102" offset="100%"/>
-        </linearGradient>
-        <radialGradient cx="86.363%" cy="59.145%" fx="86.363%" fy="59.145%" r="282.589%" gradientTransform="matrix(-.173 .5851 -.12703 -.82532 1.088 .574)" id="oprraelscb">
-            <stop stop-color="#7A1591" offset="0%"/>
-            <stop stop-color="#050A1E" offset="100%"/>
-            <stop stop-color="#050A1E" offset="100%"/>
-        </radialGradient>
-        <radialGradient cx="4.87%" cy="50%" fx="4.87%" fy="50%" r="1332.284%" gradientTransform="matrix(-.07506 0 0 -1 .052 1)" id="0rnf4zdzve">
-            <stop stop-color="#53FFB3" offset="0%"/>
-            <stop stop-color="#3E2F7A" offset="100%"/>
-        </radialGradient>
-        <filter x="-201.5%" y="-225.6%" width="502.9%" height="551.1%" filterUnits="objectBoundingBox" id="2t22ix8htw">
-            <feGaussianBlur stdDeviation="11" in="SourceGraphic"/>
-        </filter>
-        <path id="1l5w42l0na" d="M0 0h375v80H0z"/>
-    </defs>
-    <g fill="none" fill-rule="evenodd">
-        <mask id="fjuopk87tc" fill="#fff">
-            <use xlink:href="#1l5w42l0na"/>
-        </mask>
-        <use fill="url(#oprraelscb)" xlink:href="#1l5w42l0na"/>
-        <g mask="url(#fjuopk87tc)" fill="#FFF">
-            <g transform="translate(-917 5)">
-                <circle opacity=".142" cx="1144" cy="10" r="2"/>
-                <circle opacity=".142" cx="1276" cy="6" r="2"/>
-                <circle opacity=".142" cx="1290" cy="37" r="2"/>
-                <circle opacity=".359" cx="1049" cy="28" r="2"/>
-                <circle opacity=".359" cx="983" cy="66" r="1"/>
-                <circle opacity=".359" cx="1184" cy="47" r="1"/>
-                <circle opacity=".359" cx="1146" cy="65" r="1"/>
-            </g>
-        </g>
-        <g mask="url(#fjuopk87tc)">
-            <path d="M.54.973S-.014 3.466.044 4.06c.058.595 1.32 1.918 1.32 1.918s1.322 2.59 1.739 3.857c.417 1.266 1.848 2.878 1.848 2.878s4.911 4.666 6.39 4.608c.678-.026 3.403-2.551 4.282-2.551 2.337 0 3.735-1.846 3.735-1.846s3.299-5.219 3.587-5.477c.287-.259 1.93-.795 1.93-.795s2.674-4.4 2.884-5.557l-7.437.278L.54.973z" fill="url(#xyjb951esd)" transform="translate(306.607 65.944)"/>
-            <path d="m.54.973 3.513-.25L6.094.529s9.657.014 12.443.109c0 0 2.318-.527 2.947-.544.63-.016 1.849.63 1.849.63l4.426.326s-2.03.396-3.575.378l1.485.282c-.28.12-.599.21-.938.265-.59.1-5.021.174-7.12.16-2.1-.012-3.025-.425-3.025-.425l.966-.206-1.136-.076s-3.44.34-4.753.362A29.142 29.142 0 0 1 6.66 1.63l-.125-.252S2.968 1.268.54.973z" fill="url(#0rnf4zdzve)" transform="translate(306.607 65.944)"/>
-            <path d="M5.702 1.585v1.741l-1.939.3s-.085.035-.299.527c-.214.493-1.201 1.734-1.201 1.734l-.898.09.72 1.468s1.037.01 1.45.243c.414.234 1.327.932 1.327.932l.549 1.37s.548-2.534.58-2.934c.03-.4.569-2.112.486-2.411-.083-.3.033-1.425.033-1.425l.15-1.179s2.81.352 3.104.447c.293.095.42 1.167.42 1.167l.966 2.012-1.081 2.944.417 2.492.131 1.875 1.526 3.966 1.207-.836s.989-6.513 1.06-6.81c.072-.298-.268-1-.268-1l.48-3.06-.046-3.068.966-.333-1.136-.123s-3.565.485-4.156.536c-.59.052-3.596-.457-3.596-.457l1.802-.4-2.754.192z" fill="url(#ladppv4vnf)" transform="translate(306.607 65.944)"/>
-            <path d="m21.116 2.137 2.408.226-.386.518-1.043 1.413-1.26.674-1.411.294-1.097.435h.952l-.073.574-.512 1.367-.025.979.687-.267s2.526-2.416 3.579-3.378c0 0 1.751-.304 1.931-.491.18-.187 2.657-2.79 2.883-3.433l-3.565.38 1.485.28c-.558.142-1.14.252-1.738.327-.7.06-2.815.102-2.815.102z" fill="url(#crxo99pdog)" transform="translate(306.607 65.944)"/>
-            <path d="m325.144 66.577-.772.217s.568.072.896.124c.328.052 2.138-.03 2.458-.083.32-.052 1.51-.256 1.51-.256l.064-.21s-.888-.447-1.158-.423c-.27.024-2.528.501-2.998.63z" fill="#41A997"/>
-            <path d="m330.05 66.676-.754.24-1.18.016h-2.51s1.931-.093 2.223-.128c.291-.035 1.406-.227 1.406-.227l.063-.21.752.309z" fill="#10001D"/>
-            <path fill="#000" d="m312.31 68.368.81 1.072.141-2.019 1.802-.248-2.754.12zM330.791 67.371l1.485.282-.64 2.617s1.992-2.141 2.732-3.278l-3.577.38zM316.857 67.703l1.893 1.035 1.17.702.238.6 1.05-.376-.017-2.011.964-.206-1.138-.076z"/>
-            <g>
-                <path d="M.325.943S.022 2.437.054 2.793c.031.357.72 1.15.72 1.15s.722 1.551.95 2.31c.227.76 1.008 1.725 1.008 1.725s2.681 2.796 3.489 2.76c.37-.015 1.857-1.528 2.337-1.528 1.275 0 2.038-1.106 2.038-1.106s1.8-3.126 1.958-3.281c.157-.155 1.054-.477 1.054-.477s1.46-2.635 1.574-3.329l-4.06.167L.325.944z" fill="url(#l018dwim3h)" transform="translate(297.077 69.01)"/>
-                <path d="m297.402 69.954 1.917-.241 1.114-.19s5.271.014 6.793.105c0 0 1.265-.511 1.608-.527.344-.016 1.009.61 1.009.61l2.416.317s-1.108.384-1.951.367l.81.273a1.564 1.564 0 0 1-.512.257c-.321.097-2.74.169-3.886.156-1.146-.013-1.651-.413-1.651-.413l.527-.2-.62-.073s-1.878.329-2.594.35a9.047 9.047 0 0 1-1.64-.153l-.068-.245s-1.947-.106-3.272-.393z" fill="#3F7D8C"/>
-                <path d="M3.142 1.308v1.043l-1.058.179s-.046.021-.163.316-.656 1.039-.656 1.039l-.49.053.393.88s.566.005.792.145c.225.14.724.558.724.558l.3.82s.299-1.517.315-1.756c.017-.24.311-1.265.266-1.445-.045-.179.018-.852.018-.852l.082-.707s1.534.211 1.694.268c.16.057.23.699.23.699l.527 1.205-.59 1.762.228 1.493.071 1.123.833 2.375.659-.5s.54-3.901.579-4.08c.039-.178-.147-.598-.147-.598l.263-1.832-.026-1.838.527-.199-.62-.074s-1.946.291-2.268.322c-.323.03-1.963-.274-1.963-.274l.984-.24-1.504.115z" fill="url(#vf87rf4i9i)" transform="translate(297.077 69.01)"/>
-                <path d="m11.556 2.073 1.314.219-.21.502-.57 1.37-.687.654-.77.285-.6.422h.52l-.04.557-.28 1.326-.013.948.375-.258s1.38-2.343 1.954-3.276c0 0 .956-.295 1.054-.477.098-.181 1.45-2.706 1.574-3.329l-1.946.368.81.273a4.944 4.944 0 0 1-.948.316c-.383.058-1.537.1-1.537.1z" fill="url(#n2ips3meoj)" transform="translate(297.077 69.01)"/>
-                <path d="m307.226 69.624-.422.21s.31.07.489.121c.18.05 1.167-.03 1.342-.08.175-.05.824-.249.824-.249l.035-.203s-.485-.434-.632-.41c-.148.023-1.38.486-1.636.611z" fill="#211941"/>
-                <path d="m309.903 69.72-.411.233-.644.016h-1.37s1.054-.09 1.213-.125c.159-.033.767-.22.767-.22l.035-.203.41.299z" fill="#10001D"/>
-                <path fill="#000" d="m300.22 71.361.442 1.04.077-1.958.984-.24-1.503.116zM310.308 70.395l.81.273-.35 2.538s1.089-2.077 1.492-3.18l-1.952.369zM302.702 70.716l1.033 1.004.639.68.13.583.573-.365-.01-1.95.527-.2-.621-.073z"/>
-            </g>
-            <g opacity=".6">
-                <path d="M.15.435s-.14.688-.125.852c.014.164.332.53.332.53s.332.715.437 1.064c.105.35.465.795.465.795s1.235 1.288 1.607 1.272c.17-.007.856-.704 1.077-.704.588 0 .94-.51.94-.51s.83-1.44.902-1.512c.072-.071.485-.22.485-.22S6.943.789 6.996.47L5.125.545.15.435z" fill="url(#5lfox0f34k)" transform="translate(290 60.963)"/>
-                <path d="m.15.435.883-.111.514-.088s2.428.006 3.13.049c0 0 .582-.236.74-.243.159-.008.465.281.465.281l1.114.146s-.51.177-.9.169l.374.126a.72.72 0 0 1-.236.118C6.086.927 4.971.96 4.443.954c-.528-.006-.76-.19-.76-.19l.242-.092L3.64.638S2.775.789 2.444.8C2.191.799 1.938.775 1.69.729L1.657.616S.76.566.15.435z" fill="url(#glljbgkral)" transform="translate(290 60.963)"/>
-                <path d="M1.448.603v.48l-.488.083s-.021.01-.075.146c-.054.136-.302.478-.302.478l-.226.025.181.405s.261.002.365.067c.104.064.334.257.334.257l.138.378s.138-.7.145-.81c.008-.11.144-.582.123-.665-.021-.083.008-.393.008-.393L1.689.73s.707.097.78.123c.074.026.106.322.106.322l.243.555-.272.812.105.688.033.518.384 1.094.303-.23s.25-1.798.267-1.88c.018-.082-.067-.276-.067-.276l.12-.844L3.68.764l.243-.092-.286-.034s-.896.134-1.045.148C2.443.801 1.687.66 1.687.66l.454-.11-.693.053z" fill="url(#7zcs47oy5m)" transform="translate(290 60.963)"/>
-                <path d="m5.325.955.605.101-.097.231-.262.632-.317.3-.355.132-.276.195h.24l-.019.256-.128.611-.007.438.173-.12s.636-1.08.9-1.51c0 0 .44-.135.486-.219.045-.083.668-1.247.725-1.534l-.896.17.373.126c-.14.063-.287.112-.437.145-.176.027-.708.046-.708.046z" fill="url(#1ivo9tc94n)" transform="translate(290 60.963)"/>
-                <path d="m294.676 61.246-.194.097s.143.032.225.056c.083.023.538-.014.619-.037l.38-.115.016-.094s-.224-.2-.292-.189c-.068.011-.636.224-.754.282z" fill="#5E48B5"/>
-                <path d="m295.91 61.29-.19.108-.296.007h-.632s.486-.042.56-.057c.073-.016.353-.102.353-.102l.016-.094.189.138z" fill="#10001D"/>
-                <path fill="#000" d="m291.448 62.047.204.478.035-.902.454-.11-.693.053zM296.097 61.601l.373.126-.161 1.17s.501-.957.687-1.465l-.9.17zM292.592 61.75l.476.462.294.313.06.269.264-.168-.004-.9.242-.09-.286-.035z"/>
-            </g>
-            <g opacity=".267">
-                <path d="M.29.813s-.16.767-.143.95c.017.183.38.59.38.59s.38.798.5 1.188c.12.39.53.886.53.886S2.97 5.863 3.396 5.845c.194-.008.978-.785 1.23-.785.672 0 1.074-.568 1.074-.568s.948-1.607 1.03-1.686c.083-.08.556-.245.556-.245s.768-1.354.829-1.71L5.976.936.29.813z" fill="url(#jtz1zgl29o)" transform="matrix(-1 0 0 1 355 57.968)"/>
-                <path d="M.146.755 1.12.652l.566-.08s2.678.006 3.45.045c0 0 .644-.217.818-.223.175-.007.513.258.513.258l1.227.134s-.563.162-.991.155l.412.116a.866.866 0 0 1-.26.109c-.164.04-1.393.071-1.975.066-.582-.006-.839-.175-.839-.175L4.31.972l-.315-.03s-.954.138-1.318.148c-.28 0-.558-.023-.833-.065L1.808.92S.82.876.146.755z" fill="url(#shrr9bnubp)" transform="matrix(-1 0 0 1 355 57.968)"/>
-                <path d="M1.429.875v.563l-.574.097s-.025.012-.088.171c-.064.16-.355.561-.355.561l-.266.03.213.474s.307.003.429.079.392.301.392.301l.163.444s.162-.82.171-.95c.01-.129.169-.683.144-.78-.025-.097.01-.46.01-.46l.044-.383s.831.114.918.145c.087.03.125.378.125.378l.285.651-.32.952.124.807.039.607.451 1.283.357-.27s.293-2.108.314-2.204c.02-.097-.08-.324-.08-.324l.143-.99-.014-.993.285-.108-.335-.04s-1.055.158-1.23.174C2.6 1.107 1.711.942 1.711.942l.533-.13-.815.063z" fill="url(#tv07ok373q)" transform="matrix(-1 0 0 1 355 57.968)"/>
-                <path d="m5.923 1.356.643.113-.103.258-.279.704-.336.336-.377.147-.293.217h.254l-.02.286-.136.682-.007.488.184-.133s.675-1.205.956-1.684c0 0 .467-.152.515-.245.048-.094.71-1.392.77-1.712l-.952.189.397.14c-.15.071-.305.125-.464.163-.187.03-.752.051-.752.051z" fill="url(#eoraskrsfr)" transform="matrix(-1 0 0 1 355 57.968)"/>
-                <path d="m349.625 58.629.197.092s-.145.03-.229.053c-.084.022-.546-.013-.627-.035l-.386-.11-.016-.088s.227-.19.296-.18c.069.01.645.213.765.268z" fill="#09080F"/>
-                <path d="m348.564 58.59.213.179.334.012h.71s-.546-.07-.628-.096c-.083-.025-.398-.168-.398-.168l-.019-.156-.212.23z" fill="#10001D"/>
-                <path fill="#000" d="m353.596 59.444-.247.595-.043-1.12-.549-.138.839.066zM348.144 58.975l-.348.144.15 1.339s-.467-1.096-.64-1.677l.838.194zM352.338 59.356l-.6.488-.37.331-.075.283-.333-.177.006-.948-.305-.097.36-.036z"/>
-            </g>
-            <g>
-                <path d="M.23.666S.015 1.72.037 1.972c.022.251.509.811.509.811s.509 1.095.67 1.631c.16.536.712 1.218.712 1.218S3.82 7.605 4.39 7.58c.261-.01 1.311-1.079 1.65-1.079.9 0 1.439-.78 1.439-.78s1.27-2.207 1.382-2.317c.11-.109.744-.336.744-.336s1.03-1.86 1.11-2.35L7.852.836.23.666z" fill="url(#cimbnvk4us)" transform="matrix(-1 0 0 1 349.694 60.09)"/>
-                <path d="m.23.666 1.353-.17.786-.134s3.72.01 4.795.074c0 0 .892-.36 1.135-.372.243-.011.712.43.712.43l1.706.224s-.782.27-1.378.259l.573.193c-.109.082-.231.144-.362.181-.227.069-1.935.12-2.744.11-.808-.008-1.165-.291-1.165-.291l.372-.14-.437-.053s-1.326.232-1.832.248a6.386 6.386 0 0 1-1.157-.109L2.54.944S1.164.868.229.666z" fill="url(#b2acvzbj7t)" transform="matrix(-1 0 0 1 349.694 60.09)"/>
-                <path d="M2.218.923v.736l-.747.127s-.033.015-.115.223c-.083.208-.463.733-.463.733l-.346.038.277.62s.4.004.56.103c.158.1.51.394.51.394l.212.58s.211-1.072.223-1.24c.012-.17.22-.894.188-1.02-.032-.127.012-.602.012-.602l.058-.499s1.083.149 1.196.19c.113.04.162.493.162.493l.372.85-.416 1.244.16 1.054.05.792.589 1.677.465-.354s.38-2.753.408-2.879c.028-.125-.103-.422-.103-.422l.185-1.293-.018-1.297.372-.141-.437-.052s-1.374.205-1.601.227c-.228.021-1.386-.194-1.386-.194l.694-.169-1.06.081z" fill="url(#totw3crrmu)" transform="matrix(-1 0 0 1 349.694 60.09)"/>
-                <path d="m8.157 1.463.928.155-.149.354-.402.967-.485.462-.544.201-.423.298h.367l-.028.393-.197.936-.01.67.265-.183s.973-1.654 1.379-2.312c0 0 .675-.209.744-.337.07-.128 1.024-1.91 1.111-2.35l-1.374.26.573.193a3.49 3.49 0 0 1-.67.223c-.27.04-1.085.07-1.085.07z" fill="url(#s5bxokedgv)" transform="matrix(-1 0 0 1 349.694 60.09)"/>
-                <path d="m342.53 60.523.298.15s-.218.048-.345.084c-.126.036-.824-.02-.947-.056-.124-.036-.582-.176-.582-.176l-.025-.144s.343-.306.447-.29c.104.017.974.344 1.155.432z" fill="#09080F"/>
-                <path d="m340.64 60.591.29.165.456.01h.967s-.744-.063-.857-.087c-.112-.024-.541-.156-.541-.156l-.025-.143-.29.211z" fill="#10001D"/>
-                <path fill="#000" d="m347.476 61.75-.312.733-.055-1.381-.694-.17 1.061.082zM340.355 61.067l-.572.193.247 1.792s-.768-1.466-1.053-2.244l1.378.26zM345.724 61.294l-.73.709-.45.48-.092.411-.405-.257.007-1.377-.371-.14.438-.053z"/>
-            </g>
-            <g fill-rule="nonzero">
-                <path d="m16.469.411-7.622 14.22-1.91-.07L.089 0l1.91.07 2.895.07 2.666.062.673 1.431L8.994.21l1.91.07 2.67.062 2.895.07z" fill="#05FF8F" filter="url(#2t22ix8htw)" transform="translate(311.471 50)"/>
-                <path fill="#1F3A2E" d="m318.874 53.566 1.905-.073-1.758-3.283-1.909.07z"/>
-                <path fill="#385F86" d="m314.442 50.342 4.572 8.533 4.11-8.735-2.667.062-1.583 3.364-1.762-3.287z"/>
-                <path fill="#1F3A2E" d="m319.169 64.63 1.91-.07L327.927 50l-1.91.07z"/>
-                <path fill="#53FFB3" d="m311.547 50.411 7.622 14.22 6.85-14.561-2.896.07-4.11 8.735-4.57-8.533z"/>
-            </g>
-            <g>
-                <path d="M.98 2.938S.28 6.446.353 7.282C.426 8.12 2.021 9.98 2.021 9.98s1.668 3.644 2.195 5.426c.527 1.782 2.333 4.05 2.333 4.05s6.202 6.563 8.07 6.482c.855-.038 4.296-3.59 5.405-3.59 2.951 0 4.717-2.596 4.717-2.596s4.164-7.341 4.528-7.705c.363-.364 2.438-1.119 2.438-1.119s3.375-6.188 3.64-7.816l-9.39.39L.98 2.939z" fill="url(#x8jdggif0x)" transform="matrix(-1 0 0 1 91.348 57.062)"/>
-                <path d="m.348 3.091 4.517-.61 2.625-.478s12.417.035 16 .266c0 0 2.98-1.29 3.79-1.33.81-.04 2.376 1.54 2.376 1.54l5.692.798s-2.61.969-4.597.926l1.91.689c-.362.294-.77.514-1.207.649-.757.245-6.457.426-9.156.394-2.7-.032-3.889-1.043-3.889-1.043l1.242-.503-1.46-.186s-4.423.83-6.112.886A19.94 19.94 0 0 1 8.218 4.7l-.162-.617S3.47 3.815.348 3.091z" fill="url(#bvdunkfahy)" transform="matrix(-1 0 0 1 91.348 57.062)"/>
-                <path d="M6.855 4.21v2.463l-2.462.423s-.108.05-.38.747c-.272.698-1.525 2.453-1.525 2.453l-1.14.127.915 2.077s1.316.013 1.84.344c.526.331 1.685 1.317 1.685 1.317l.697 1.94s.696-3.586.735-4.151c.04-.565.724-2.989.618-3.412-.105-.423.042-2.015.042-2.015l.191-1.668s3.568.498 3.94.632c.373.135.535 1.651.535 1.651l1.226 2.847-1.373 4.164.53 3.526.166 2.653 1.937 5.61 1.533-1.183s1.255-9.214 1.346-9.635c.09-.42-.34-1.414-.34-1.414l.61-4.329-.06-4.34 1.227-.471-1.442-.174s-4.526.687-5.277.76c-.75.071-4.565-.648-4.565-.648l2.288-.566-3.497.272z" fill="url(#9resnyc60z)" transform="matrix(-1 0 0 1 91.348 57.062)"/>
-                <path d="m26.9 5.385 3.066.508-.491 1.162-1.329 3.174-1.603 1.513-1.798.662-1.397.977h1.212l-.093 1.289-.652 3.071-.032 2.197.876-.598s3.217-5.427 4.557-7.588c0 0 2.231-.684 2.46-1.103.229-.42 3.384-6.268 3.672-7.71l-4.54.851 1.891.633c-.711.318-1.453.563-2.214.732-.892.134-3.586.23-3.586.23z" fill="url(#9znzegdhvA)" transform="matrix(-1 0 0 1 91.348 57.062)"/>
-                <path d="m68.06 59.276.94.44s-.691.145-1.09.25c-.4.106-2.604-.061-2.994-.167-.39-.105-1.838-.518-1.838-.518L63 58.857s1.082-.903 1.41-.855c.33.048 3.078 1.013 3.65 1.274z" fill="#09080F"/>
-                <path d="m61 59.546 1.017.425L63.61 60H67s-2.608-.165-3.001-.227c-.394-.061-1.899-.402-1.899-.402L62.014 59 61 59.546z" fill="#10001D"/>
-                <path fill="#000" d="M84 63.635 82.822 66l-.205-4.453L80 61l4 .264zM61 61.81l-2.076.601L59.82 68s-2.786-4.572-3.82-7l5 .81zM78 61.745l-2.5 2.327-1.547 1.579L73.639 67l-1.389-.846.023-4.521L71 61.171 72.503 61z"/>
-            </g>
-        </g>
-    </g>
-</svg>
diff --git a/packages/docs/public/images/vueschool/vs-fw-bg.svg b/packages/docs/public/images/vueschool/vs-fw-bg.svg
deleted file mode 100644
index 8c52220629..0000000000
--- a/packages/docs/public/images/vueschool/vs-fw-bg.svg
+++ /dev/null
@@ -1,219 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1600" height="80" viewBox="0 0 1600 80">
-    <defs>
-        <linearGradient id="5ameghss0d" x1="69.517%" x2="6.594%" y1="51.532%" y2="50.219%">
-            <stop offset="0%" stop-color="#2F1360"/>
-            <stop offset="100%" stop-color="#170733" stop-opacity="0"/>
-        </linearGradient>
-        <linearGradient id="ldcbexte6e" x1="44.505%" x2="38.734%" y1="63.572%" y2="35.987%">
-            <stop offset="0%" stop-color="#100122"/>
-            <stop offset="100%"/>
-        </linearGradient>
-        <linearGradient id="d2q9m4a13g" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="vad27r6pfh" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="9dpb6hp5ci" x1="50.011%" x2="50.011%" y1="98.997%" y2="0%">
-            <stop offset="0%" stop-color="#100122"/>
-            <stop offset="100%" stop-color="#100222"/>
-        </linearGradient>
-        <linearGradient id="t5ze97cb1j" x1="67.838%" x2="77.139%" y1="49.111%" y2="52.125%">
-            <stop offset="0%" stop-color="#418D90"/>
-            <stop offset="100%" stop-color="#352869"/>
-        </linearGradient>
-        <linearGradient id="iunmf4p5dk" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="ugpy0s3qzl" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="d2qa2xa78m" x1="50.011%" x2="50.011%" y1="98.997%" y2="0%">
-            <stop offset="0%" stop-color="#100122"/>
-            <stop offset="100%" stop-color="#100222"/>
-        </linearGradient>
-        <linearGradient id="ghn0xezfxn" x1="67.838%" x2="77.139%" y1="49.111%" y2="52.125%">
-            <stop offset="0%" stop-color="#463487"/>
-            <stop offset="100%" stop-color="#352869"/>
-        </linearGradient>
-        <linearGradient id="nkk1vcp9xo" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="iatia160pp" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="b93vg68qvq" x1="50.011%" x2="50.011%" y1="98.997%" y2="0%">
-            <stop offset="0%" stop-color="#100122"/>
-            <stop offset="100%" stop-color="#100222"/>
-        </linearGradient>
-        <linearGradient id="qfqmiu1lhr" x1="85.547%" x2="0%" y1="49.383%" y2="50.617%">
-            <stop offset="0%" stop-color="#3AAB82"/>
-            <stop offset="100%" stop-color="#352869"/>
-        </linearGradient>
-        <linearGradient id="3ph8n0fdus" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="z844b6m03t" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="grslp9mosu" x1="50.011%" x2="50.011%" y1="98.997%" y2="0%">
-            <stop offset="0%" stop-color="#100122"/>
-            <stop offset="100%" stop-color="#100222"/>
-        </linearGradient>
-        <linearGradient id="oi7nzej9iv" x1="85.547%" x2="0%" y1="49.111%" y2="50.889%">
-            <stop offset="0%" stop-color="#41878F"/>
-            <stop offset="100%" stop-color="#352869"/>
-        </linearGradient>
-        <linearGradient id="f8fiecmc3w" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="alvgpbp57x" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="z3rt2dgojy" x1="50.011%" x2="50.011%" y1="98.997%" y2="0%">
-            <stop offset="0%" stop-color="#100122"/>
-            <stop offset="100%" stop-color="#100222"/>
-        </linearGradient>
-        <linearGradient id="3zewkh3hjz" x1="85.547%" x2="0%" y1="49.111%" y2="50.889%">
-            <stop offset="0%" stop-color="#1B2A68"/>
-            <stop offset="100%" stop-color="#352869"/>
-        </linearGradient>
-        <linearGradient id="at7ruyopaA" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <linearGradient id="1y097csx7B" x1="50.02%" x2="50.02%" y1="100%" y2="-.011%">
-            <stop offset="0%" stop-color="#241644"/>
-            <stop offset="100%" stop-color="#040102"/>
-        </linearGradient>
-        <radialGradient id="pemavkj99b" cx="100%" cy="50%" r="946.157%" fx="100%" fy="50%" gradientTransform="matrix(-.04881 .21668 -.01103 -.99353 1.054 .78)">
-            <stop offset="0%" stop-color="#8647B7"/>
-            <stop offset="100%" stop-color="#050A1E"/>
-        </radialGradient>
-        <radialGradient id="eertgxvnhf" cx="4.87%" cy="50%" r="1332.284%" fx="4.87%" fy="50%" gradientTransform="matrix(-.07506 0 0 -1 .052 1)">
-            <stop offset="0%" stop-color="#53FFB3"/>
-            <stop offset="100%" stop-color="#3E2F7A"/>
-        </radialGradient>
-        <filter id="rx0t6c148C" width="269%" height="289.2%" x="-84.5%" y="-94.6%" filterUnits="objectBoundingBox">
-            <feGaussianBlur in="SourceGraphic" stdDeviation="11"/>
-        </filter>
-        <path id="f8t3xp6zsa" d="M0 0H1600V80H0z"/>
-    </defs>
-    <g fill="none" fill-rule="evenodd">
-        <g>
-            <mask id="j8rbacs7oc" fill="#fff">
-                <use xlink:href="#f8t3xp6zsa"/>
-            </mask>
-            <use fill="url(#pemavkj99b)" xlink:href="#f8t3xp6zsa"/>
-            <g fill="#FFF" mask="url(#j8rbacs7oc)">
-                <g transform="translate(141 5)">
-                    <circle cx="1144" cy="10" r="2" opacity=".142"/>
-                    <circle cx="1276" cy="6" r="2" opacity=".142"/>
-                    <circle cx="1415" cy="50" r="2" opacity=".359"/>
-                    <circle cx="1290" cy="37" r="2" opacity=".142"/>
-                    <circle cx="1049" cy="28" r="2" opacity=".359"/>
-                    <circle cx="1341" cy="64" r="2" opacity=".359"/>
-                    <circle cx="260" cy="28" r="2" opacity=".359"/>
-                    <circle cx="71" cy="64" r="2" opacity=".359"/>
-                    <circle cx="70" cy="38" r="1" opacity=".359"/>
-                    <circle cx="157" cy="63" r="1" opacity=".359"/>
-                    <circle cx="231" cy="8" r="1" opacity=".359"/>
-                    <circle cx="310" cy="63" r="1" opacity=".359"/>
-                    <circle cx="429" cy="1" r="1" opacity=".359"/>
-                    <circle cx="619" cy="69" r="1" opacity=".359"/>
-                    <circle cx="761" cy="51" r="1" opacity=".359"/>
-                    <circle cx="808" cy="67" r="1" opacity=".359"/>
-                    <circle cx="983" cy="66" r="1" opacity=".359"/>
-                    <circle cx="1184" cy="47" r="1" opacity=".359"/>
-                    <circle cx="1313" cy="58" r="1" opacity=".359"/>
-                    <circle cx="1313" cy="41" r="1" opacity=".359"/>
-                    <circle cx="1367" cy="41" r="1" opacity=".142"/>
-                    <circle cx="1412" cy="16" r="1" opacity=".359"/>
-                    <circle cx="1379" cy="16" r="1" opacity=".359"/>
-                    <circle cx="1146" cy="65" r="1" opacity=".359"/>
-                    <circle cx="1359" cy="15" r="1" opacity=".359"/>
-                    <circle cx="2" cy="2" r="2" opacity=".359"/>
-                    <circle cx="796" cy="6" r="2" opacity=".359"/>
-                </g>
-            </g>
-            <path fill="url(#5ameghss0d)" d="M1466.372 7.76l59.556 5.549-75.405 1.606-170.359 9.693-42.523-1.11 58.819-5.46 42.003-2.974-145.38-5.964 30.368 4.058 24.469 4.045L1143 11.085V80l220.316-1.273 125.536-8.515-73.365-7.78h50.885l130.39 10.236-48.38-8.287H1600V1.736S1490.4 4.817 1415.871 0l50.5 7.76z" mask="url(#j8rbacs7oc)" opacity=".101"/>
-            <g mask="url(#j8rbacs7oc)">
-                <g>
-                    <g>
-                        <path fill="url(#ldcbexte6e)" d="M1.288 2.32S-.034 8.265.104 9.683c.139 1.419 3.15 4.574 3.15 4.574s3.15 6.176 4.145 9.197c.995 3.02 4.407 6.864 4.407 6.864s11.712 11.127 15.24 10.989c1.616-.063 8.114-6.084 10.21-6.084 5.572 0 8.906-4.401 8.906-4.401s7.866-12.445 8.552-13.062c.686-.617 4.605-1.896 4.605-1.896s6.374-10.49 6.876-13.25l-17.735.663L1.288 2.32z" transform="translate(323 7) translate(1041.601 38.02)"/>
-                        <path fill="url(#eertgxvnhf)" d="M1.288 2.32l8.377-.594 4.868-.466s23.026.033 29.672.259c0 0 5.526-1.257 7.027-1.296 1.502-.039 4.407 1.5 4.407 1.5l10.556.778s-4.84.944-8.525.902l3.542.672c-.67.286-1.43.5-2.238.632-1.405.239-11.974.415-16.98.384-5.006-.031-7.212-1.016-7.212-1.016l2.303-.49-2.708-.182s-8.202.81-11.334.864c-2.402-.004-4.8-.13-7.16-.379l-.3-.601S7.077 3.025 1.288 2.32z" transform="translate(323 7) translate(1041.601 38.02)"/>
-                        <path fill="url(#d2q9m4a13g)" d="M13.598 3.78V7.93l-4.624.714s-.202.084-.714 1.26c-.51 1.175-2.864 4.134-2.864 4.134l-2.142.214 1.718 3.501s2.473.021 3.459.58c.985.558 3.164 2.22 3.164 2.22l1.307 3.27s1.308-6.044 1.382-6.997c.074-.953 1.359-5.038 1.16-5.751-.197-.714.079-3.396.079-3.396l.36-2.813s6.7.84 7.4 1.066c.7.227 1.004 2.783 1.004 2.783l2.302 4.799-2.579 7.018.995 5.945.313 4.47 3.638 9.458 2.879-1.994s2.358-15.532 2.528-16.241c.17-.71-.64-2.385-.64-2.385l1.147-7.296-.11-7.317 2.302-.793-2.708-.294s-8.501 1.159-9.91 1.28c-1.41.122-8.576-1.09-8.576-1.09l4.297-.954-6.567.458z" transform="translate(323 7) translate(1041.601 38.02)"/>
-                        <path fill="url(#vad27r6pfh)" d="M50.353 5.096l5.742.54-.92 1.233-2.488 3.37-3.002 1.607-3.367.702-2.615 1.037h2.27l-.175 1.369-1.22 3.26-.06 2.333 1.64-.635s6.023-5.762 8.533-8.056c0 0 4.177-.726 4.605-1.171.428-.446 6.337-6.654 6.876-8.186l-8.502.904 3.542.672c-1.331.337-2.72.598-4.145.777-1.672.143-6.714.244-6.714.244z" transform="translate(323 7) translate(1041.601 38.02)"/>
-                        <path fill="#41A997" d="M44.205 1.509l-1.843.518s1.354.171 2.137.295c.783.125 5.098-.072 5.863-.197.764-.124 3.601-.611 3.601-.611l.152-.5S51.997-.053 51.352.004c-.645.057-6.028 1.195-7.147 1.504z" transform="translate(323 7) translate(1041.601 38.02)"/>
-                        <path fill="#10001D" d="M55.902 1.744l-1.796.573-2.814.04h-5.987s4.606-.224 5.3-.307c.696-.083 3.354-.541 3.354-.541l.152-.5 1.791.735z" transform="translate(323 7) translate(1041.601 38.02)"/>
-                        <path fill="#000" d="M13.598 5.78L15.532 8.336 15.868 3.523 20.165 2.932 13.598 3.217zM57.67 3.403l3.542.672-1.53 6.241S64.437 5.21 66.2 2.5l-8.529.904zM24.443 4.194L28.956 6.662 31.747 8.336 32.314 9.767 34.819 8.87 34.778 4.075 37.076 3.585 34.363 3.403z" transform="translate(323 7) translate(1041.601 38.02)"/>
-                    </g>
-                    <g>
-                        <path fill="url(#9dpb6hp5ci)" d="M.774 2.25S.052 5.812.128 6.662c.075.85 1.72 2.74 1.72 2.74s1.719 3.7 2.262 5.51c.543 1.81 2.405 4.112 2.405 4.112s6.393 6.667 8.319 6.584c.882-.038 4.429-3.645 5.573-3.645 3.041 0 4.861-2.637 4.861-2.637s4.294-7.456 4.668-7.825c.375-.37 2.514-1.137 2.514-1.137s3.48-6.284 3.753-7.938l-9.68.397L.773 2.25z" transform="translate(323 7) translate(1018.876 45.333)"/>
-                        <path fill="url(#t5ze97cb1j)" d="M.774 2.25l4.572-.576 2.658-.452s12.569.032 16.196.251c0 0 3.016-1.22 3.836-1.257.82-.038 2.406 1.456 2.406 1.456l5.761.754s-2.642.915-4.653.875l1.933.65c-.366.279-.78.487-1.221.614-.767.231-6.536.402-9.269.372-2.732-.03-3.936-.985-3.936-.985l1.257-.475-1.479-.176s-4.477.784-6.186.837c-1.311-.004-2.62-.126-3.909-.367l-.163-.584S3.934 2.934.774 2.25z" transform="translate(323 7) translate(1018.876 45.333)"/>
-                        <path fill="url(#iunmf4p5dk)" d="M7.493 3.12v2.486l-2.524.427s-.11.05-.39.754c-.278.704-1.563 2.476-1.563 2.476l-1.169.129.938 2.096s1.35.013 1.888.347c.538.334 1.727 1.33 1.727 1.33l.714 1.958s.714-3.62.754-4.19c.04-.571.741-3.017.633-3.444-.108-.428.043-2.034.043-2.034L8.74 3.77s3.658.502 4.04.638c.382.136.548 1.667.548 1.667l1.257 2.873-1.408 4.203.543 3.56.17 2.677 1.987 5.663 1.57-1.194s1.288-9.3 1.38-9.725c.094-.425-.348-1.428-.348-1.428l.625-4.37-.06-4.38 1.257-.476-1.478-.176s-4.64.694-5.41.767c-.769.073-4.68-.654-4.68-.654l2.345-.57-3.585.274z" transform="translate(323 7) translate(1018.876 45.333)"/>
-                        <path fill="url(#ugpy0s3qzl)" d="M27.556 4.942l3.135.523-.503 1.197-1.358 3.267-1.639 1.559-1.837.681-1.428 1.006h1.24l-.096 1.327-.666 3.162-.033 2.263.895-.616s3.288-5.588 4.658-7.813c0 0 2.28-.704 2.514-1.136.233-.433 3.459-6.453 3.753-7.939l-4.64.878 1.932.65c-.726.328-1.484.58-2.262.755-.913.138-3.665.236-3.665.236z" transform="translate(323 7) translate(1018.876 45.333)"/>
-                        <path fill="#211941" d="M24.2 1.463l-1.006.503s.74.166 1.167.286c.427.121 2.783-.07 3.2-.19.417-.121 1.966-.594 1.966-.594l.083-.485S28.453-.05 28.1.005c-.352.055-3.29 1.159-3.901 1.458z" transform="translate(323 7) translate(1018.876 45.333)"/>
-                        <path fill="#10001D" d="M30.585 1.692l-.98.555-1.536.038H24.8s2.514-.216 2.893-.297c.38-.08 1.83-.525 1.83-.525l.083-.485.978.714z" transform="translate(323 7) translate(1018.876 45.333)"/>
-                        <path fill="#000" d="M7.493 5.606L8.549 8.084 8.733 3.416 11.078 2.843 7.493 3.12zM31.55 3.3l1.933.652-.834 6.053s2.594-4.952 3.557-7.582l-4.656.878zM13.413 4.067L15.877 6.46 17.4 8.084 17.709 9.472 19.077 8.602 19.054 3.952 20.309 3.477 18.828 3.301z" transform="translate(323 7) translate(1018.876 45.333)"/>
-                    </g>
-                    <g opacity=".6">
-                        <path fill="url(#d2qa2xa78m)" d="M.357 1.037S.024 2.678.059 3.07C.094 3.46.85 4.332.85 4.332s.792 1.705 1.043 2.54c.25.833 1.108 1.894 1.108 1.894s2.946 3.072 3.833 3.034c.407-.018 2.041-1.68 2.568-1.68 1.402 0 2.24-1.215 2.24-1.215S13.622 5.47 13.794 5.3c.173-.17 1.159-.523 1.159-.523s1.603-2.896 1.729-3.658l-4.46.183L.356 1.037z" transform="translate(323 7) translate(1002 26.143)"/>
-                        <path fill="url(#ghn0xezfxn)" d="M.357 1.037L2.464.77 3.688.563s5.791.015 7.463.116c0 0 1.39-.562 1.768-.58.377-.017 1.108.671 1.108.671l2.655.348s-1.217.421-2.144.403l.89.3c-.168.128-.359.224-.562.283-.354.106-3.012.185-4.271.17-1.26-.013-1.814-.453-1.814-.453l.58-.219-.682-.081s-2.063.361-2.85.386c-.605-.002-1.208-.059-1.802-.17l-.075-.268s-2.14-.117-3.595-.432z" transform="translate(323 7) translate(1002 26.143)"/>
-                        <path fill="url(#nkk1vcp9xo)" d="M3.453 1.437v1.146L2.29 2.78s-.051.023-.18.347c-.128.325-.72 1.141-.72 1.141l-.539.06.432.966s.622.005.87.16c.248.153.796.612.796.612l.329.902s.329-1.668.347-1.93c.019-.263.342-1.39.292-1.587-.05-.197.02-.937.02-.937l.09-.777s1.686.232 1.862.295c.176.062.252.768.252.768l.58 1.324-.65 1.936.25 1.64.08 1.234.915 2.61.724-.55s.593-4.286.636-4.482c.042-.196-.161-.658-.161-.658l.288-2.013-.028-2.019.58-.219-.682-.081s-2.138.32-2.492.353c-.355.034-2.157-.3-2.157-.3l1.08-.264-1.651.126z" transform="translate(323 7) translate(1002 26.143)"/>
-                        <path fill="url(#iatia160pp)" d="M12.697 2.277l1.445.241-.232.552-.625 1.505-.756.719-.846.313-.658.464h.57l-.043.611-.307 1.457-.015 1.043.412-.284s1.515-2.575 2.146-3.6c0 0 1.051-.324 1.159-.523.107-.2 1.594-2.974 1.73-3.658l-2.14.404.892.3c-.335.15-.685.267-1.043.347-.42.064-1.689.11-1.689.11z" transform="translate(323 7) translate(1002 26.143)"/>
-                        <path fill="#5E48B5" d="M11.15.674l-.462.232s.34.076.537.132c.197.055 1.282-.033 1.475-.088.192-.056.905-.274.905-.274l.039-.223s-.533-.476-.695-.45c-.163.025-1.517.533-1.798.671z" transform="translate(323 7) translate(1002 26.143)"/>
-                        <path fill="#10001D" d="M14.093.78l-.452.256-.707.017h-1.506s1.158-.1 1.333-.137c.175-.037.843-.242.843-.242l.038-.223.451.329z" transform="translate(323 7) translate(1002 26.143)"/>
-                        <path fill="#000" d="M3.453 2.583L3.939 3.725 4.024 1.574 5.105 1.31 3.453 1.437zM14.538 1.52l.89.3-.384 2.79s1.195-2.282 1.64-3.493l-2.146.404zM6.181 1.874L7.316 2.977 8.018 3.725 8.16 4.365 8.79 3.964 8.78 1.821 9.358 1.602 8.676 1.521z" transform="translate(323 7) translate(1002 26.143)"/>
-                    </g>
-                    <g opacity=".267">
-                        <path fill="url(#b93vg68qvq)" d="M.691 1.938s-.38 1.83-.34 2.267c.04.436.905 1.407.905 1.407s.906 1.901 1.192 2.831c.286.93 1.266 2.113 1.266 2.113s3.367 3.425 4.38 3.382c.465-.02 2.333-1.873 2.935-1.873 1.602 0 2.56-1.354 2.56-1.354s2.262-3.83 2.459-4.02c.197-.19 1.324-.584 1.324-.584s1.832-3.229 1.976-4.078l-5.098.204L.691 1.938z" transform="translate(323 7) matrix(-1 0 0 1 1157 19)"/>
-                        <path fill="url(#qfqmiu1lhr)" d="M.348 1.8l2.323-.244 1.35-.192s6.386.014 8.229.107c0 0 1.532-.516 1.948-.532.417-.016 1.223.616 1.223.616l2.927.319s-1.342.387-2.364.37l.982.276c-.186.117-.396.205-.62.26-.39.097-3.321.17-4.71.157-1.388-.013-2-.417-2-.417l.64-.201-.752-.075s-2.274.332-3.143.355c-.666-.002-1.33-.054-1.986-.156l-.083-.247S1.953 2.09.348 1.8z" transform="translate(323 7) matrix(-1 0 0 1 1157 19)"/>
-                        <path fill="url(#3ph8n0fdus)" d="M3.407 2.086V3.43l-1.367.23s-.06.028-.211.408C1.677 4.448.98 5.406.98 5.406l-.633.07.508 1.132s.732.007 1.023.188c.292.18.936.719.936.719l.387 1.058s.387-1.956.408-2.265c.022-.308.402-1.63.344-1.86-.059-.232.023-1.1.023-1.1l.106-.91s1.982.272 2.19.345c.206.074.296.9.296.9l.681 1.554-.763 2.27.295 1.924.092 1.447 1.076 3.06.852-.645s.697-5.026.748-5.255c.05-.23-.19-.772-.19-.772l.34-2.36-.033-2.369.68-.256-.8-.095s-2.515.374-2.932.414c-.416.04-2.536-.353-2.536-.353l1.271-.309-1.943.148z" transform="translate(323 7) matrix(-1 0 0 1 1157 19)"/>
-                        <path fill="url(#z844b6m03t)" d="M14.124 3.233l1.533.27-.246.615-.664 1.68-.802.801-.899.35-.698.518h.606l-.047.682-.325 1.626-.016 1.163.437-.316s1.609-2.874 2.28-4.018c0 0 1.115-.361 1.229-.584.114-.222 1.692-3.318 1.836-4.082l-2.27.451.945.335c-.355.168-.726.298-1.106.388-.447.071-1.793.121-1.793.121z" transform="translate(323 7) matrix(-1 0 0 1 1157 19)"/>
-                        <path fill="#09080F" d="M12.818 1.577l-.47.22s.346.072.545.125c.2.052 1.302-.031 1.497-.084.195-.053.92-.26.92-.26l.038-.211s-.54-.452-.705-.428c-.165.024-1.54.507-1.825.638z" transform="translate(323 7) matrix(-1 0 0 1 1157 19)"/>
-                        <path fill="#10001D" d="M15.348 1.485l-.509.425-.796.028h-1.695s1.304-.165 1.5-.227c.197-.061.95-.401.95-.401l.043-.372.507.547z" transform="translate(323 7) matrix(-1 0 0 1 1157 19)"/>
-                        <path fill="#000" d="M3.348 3.52L3.937 4.938 4.039 2.266 5.348 1.938 3.348 2.097zM16.348 2.401l.83.344-.358 3.193s1.114-2.612 1.528-4l-2 .463zM6.348 3.311L7.777 4.474 8.661 5.264 8.84 5.938 9.633 5.516 9.62 3.255 10.348 3.024 9.489 2.938z" transform="translate(323 7) matrix(-1 0 0 1 1157 19)"/>
-                    </g>
-                    <g>
-                        <path fill="url(#grslp9mosu)" d="M.546 1.588S.037 4.103.09 4.702c.053.6 1.214 1.934 1.214 1.934s1.214 2.612 1.597 3.89 1.698 2.903 1.698 2.903 4.512 4.706 5.872 4.647c.623-.026 3.126-2.573 3.934-2.573 2.147 0 3.431-1.861 3.431-1.861s3.031-5.263 3.296-5.524c.264-.26 1.774-.802 1.774-.802s2.456-4.436 2.65-5.604l-6.834.28L.546 1.589z" transform="translate(323 7) matrix(-1 0 0 1 1144.348 24.062)"/>
-                        <path fill="url(#oi7nzej9iv)" d="M.546 1.588l3.228-.406L5.65.862s8.872.023 11.432.178c0 0 2.13-.86 2.708-.887.579-.027 1.698 1.027 1.698 1.027l4.067.532s-1.865.646-3.284.618l1.364.46c-.258.196-.55.342-.862.432-.541.164-4.614.284-6.542.263-1.93-.021-2.78-.696-2.78-.696l.888-.335-1.043-.124s-3.16.553-4.367.59c-.926-.002-1.85-.088-2.76-.258l-.115-.412S2.777 2.07.546 1.588z" transform="translate(323 7) matrix(-1 0 0 1 1144.348 24.062)"/>
-                        <path fill="url(#f8fiecmc3w)" d="M5.29 2.202v1.755l-1.782.302s-.078.035-.275.532-1.104 1.748-1.104 1.748l-.825.09.662 1.48s.953.01 1.332.245c.38.236 1.22.939 1.22.939l.503 1.382s.504-2.555.533-2.958c.028-.403.523-2.13.447-2.43-.076-.303.03-1.436.03-1.436l.138-1.19s2.582.356 2.852.451c.27.096.387 1.177.387 1.177l.887 2.028-.994 2.967.384 2.513.12 1.89 1.402 3.997 1.11-.843s.908-6.565.973-6.865c.066-.3-.246-1.008-.246-1.008l.441-3.084-.042-3.093.887-.335-1.043-.124s-3.276.49-3.819.54c-.543.052-3.304-.46-3.304-.46l1.656-.403-2.53.193z" transform="translate(323 7) matrix(-1 0 0 1 1144.348 24.062)"/>
-                        <path fill="url(#alvgpbp57x)" d="M19.451 3.489l2.213.369-.355.844-.958 2.307-1.157 1.1-1.297.481-1.008.71h.875l-.068.937-.47 2.232-.023 1.597.632-.435s2.32-3.944 3.288-5.515c0 0 1.61-.497 1.774-.802.165-.305 2.442-4.555 2.65-5.603l-3.276.619 1.364.46c-.513.23-1.048.409-1.597.532-.644.097-2.587.167-2.587.167z" transform="translate(323 7) matrix(-1 0 0 1 1144.348 24.062)"/>
-                        <path fill="#09080F" d="M17.082 1.033l-.71.355s.522.117.824.202c.302.085 1.964-.05 2.259-.135.294-.085 1.387-.419 1.387-.419l.059-.342s-.816-.73-1.065-.69c-.248.039-2.323.818-2.754 1.029z" transform="translate(323 7) matrix(-1 0 0 1 1144.348 24.062)"/>
-                        <path fill="#10001D" d="M21.59 1.194l-.693.392-1.084.027h-2.307s1.775-.153 2.043-.21c.268-.056 1.292-.37 1.292-.37l.058-.343.69.504z" transform="translate(323 7) matrix(-1 0 0 1 1144.348 24.062)"/>
-                        <path fill="#000" d="M5.289 3.957L6.035 5.707 6.164 2.411 7.82 2.007 5.289 2.202zM22.27 2.33l1.365.46-.589 4.272s1.831-3.495 2.511-5.351l-3.286.619zM9.468 2.871L11.207 4.56 12.282 5.707 12.501 6.686 13.466 6.072 13.45 2.789 14.335 2.454 13.29 2.33z" transform="translate(323 7) matrix(-1 0 0 1 1144.348 24.062)"/>
-                    </g>
-                    <g>
-                        <path fill="url(#z3rt2dgojy)" d="M1.177 3.42S.08 8.837.194 10.129c.115 1.292 2.614 4.166 2.614 4.166s2.615 5.626 3.44 8.377c.826 2.752 3.658 6.253 3.658 6.253s9.719 10.136 12.646 10.01c1.342-.058 6.734-5.542 8.473-5.542 4.625 0 7.392-4.01 7.392-4.01s6.528-11.335 7.097-11.897c.57-.562 3.822-1.727 3.822-1.727s5.29-9.555 5.706-12.07l-14.718.604-39.147-.871z" transform="translate(323 7) matrix(-1 0 0 1 56.348 45.062)"/>
-                        <path fill="url(#3zewkh3hjz)" d="M1.177 3.42l6.952-.875 4.04-.688s19.109.05 24.624.383c0 0 4.586-1.854 5.832-1.911 1.246-.058 3.657 2.213 3.657 2.213l8.76 1.146s-4.017 1.391-7.074 1.33l2.939.99c-.557.423-1.186.739-1.858.933-1.165.351-9.936.611-14.09.565-4.155-.046-5.986-1.498-5.986-1.498l1.911-.722-2.247-.268S21.83 6.211 19.23 6.291c-1.994-.005-3.983-.192-5.943-.558l-.248-.887S5.98 4.46 1.177 3.421z" transform="translate(323 7) matrix(-1 0 0 1 56.348 45.062)"/>
-                        <path fill="url(#at7ruyopaA)" d="M11.392 4.743v3.78l-3.837.65s-.168.076-.592 1.146c-.424 1.07-2.377 3.765-2.377 3.765l-1.778.195 1.426 3.187s2.052.02 2.87.527c.818.509 2.626 2.022 2.626 2.022l1.085 2.977s1.086-5.503 1.147-6.37c.061-.868 1.127-4.587.963-5.237-.164-.65.065-3.092.065-3.092l.298-2.56s5.56.764 6.142.97c.58.207.833 2.534.833 2.534l1.911 4.369-2.14 6.39.825 5.412.26 4.07 3.02 8.61 2.388-1.815s1.957-14.14 2.098-14.786c.142-.646-.531-2.171-.531-2.171l.952-6.643-.092-6.661 1.91-.723-2.246-.267s-7.056 1.055-8.225 1.166c-1.17.11-7.116-.994-7.116-.994l3.565-.868-5.45.417z" transform="translate(323 7) matrix(-1 0 0 1 56.348 45.062)"/>
-                        <path fill="url(#1y097csx7B)" d="M41.895 7.514l4.766.795-.765 1.819-2.063 4.968-2.492 2.37-2.794 1.036-2.17 1.528h1.883l-.145 2.018-1.013 4.808-.05 3.44 1.361-.936s5-8.496 7.082-11.879c0 0 3.466-1.07 3.822-1.727.355-.658 5.259-9.811 5.706-12.07l-7.055 1.334 2.939.99c-1.105.497-2.257.882-3.44 1.147-1.387.21-5.572.359-5.572.359z" transform="translate(323 7) matrix(-1 0 0 1 56.348 45.062)"/>
-                        <path fill="#09080F" d="M36.793 2.224l-1.53.765s1.125.252 1.774.435c.65.184 4.231-.107 4.865-.29.635-.184 2.99-.902 2.99-.902l.125-.738S43.26-.076 42.724.008c-.535.084-5.003 1.762-5.931 2.216z" transform="translate(323 7) matrix(-1 0 0 1 56.348 45.062)"/>
-                        <path fill="#10001D" d="M46.5 2.572l-1.49.845-2.335.057h-4.969s3.822-.329 4.399-.45c.577-.123 2.782-.8 2.782-.8l.126-.737L46.5 2.572z" transform="translate(323 7) matrix(-1 0 0 1 56.348 45.062)"/>
-                        <path fill="#000" d="M11.392 8.523L12.998 12.291 13.277 5.194 16.842 4.323 11.392 4.743zM47.968 5.018l2.939.99-1.269 9.203s3.944-7.529 5.408-11.527l-7.078 1.334zM20.393 6.184L24.138 9.822 26.454 12.291 26.925 14.401 29.004 13.078 28.969 6.008 30.876 5.286 28.625 5.018z" transform="translate(323 7) matrix(-1 0 0 1 56.348 45.062)"/>
-                    </g>
-                    <g fill-rule="nonzero">
-                        <path fill="#05FF8F" d="M39.271.98L21.097 34.888l-4.553-.166L.21 0l4.553.167 6.903.166 6.357.148 1.606 3.413L21.448.5l4.553.166 6.367.148 6.903.167z" filter="url(#rx0t6c148C)" transform="translate(323 7) matrix(-1 0 0 1 1092.683 0) matrix(-1 0 0 1 39.482 0)"/>
-                        <g>
-                            <path fill="#1F3A2E" d="M21.589 8.504L17.046 8.329 21.238 0.5 25.791 0.666z" transform="translate(323 7) matrix(-1 0 0 1 1092.683 0) translate(.24)"/>
-                            <path fill="#385F86" d="M32.157 0.814L21.256 21.164 11.456 0.333 17.814 0.481 21.589 8.504 25.791 0.666z" transform="translate(323 7) matrix(-1 0 0 1 1092.683 0) translate(.24)"/>
-                            <path fill="#1F3A2E" d="M20.886 34.887L16.333 34.721 0 0 4.553 0.167z" transform="translate(323 7) matrix(-1 0 0 1 1092.683 0) translate(.24)"/>
-                            <path fill="#53FFB3" d="M39.061 0.981L20.886 34.887 4.553 0.167 11.456 0.333 21.256 21.164 32.157 0.814z" transform="translate(323 7) matrix(-1 0 0 1 1092.683 0) translate(.24)"/>
-                        </g>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>
diff --git a/packages/docs/public/images/vueschool/vs-iso.svg b/packages/docs/public/images/vueschool/vs-iso.svg
index a95d926079..873f0bcdcb 100644
--- a/packages/docs/public/images/vueschool/vs-iso.svg
+++ b/packages/docs/public/images/vueschool/vs-iso.svg
@@ -1,7 +1,13 @@
-<svg width="26" height="30" viewBox="0 0 26 30" xmlns="http://www.w3.org/2000/svg">
-    <g fill-rule="nonzero" fill="none">
-        <path d="M7.546 18.111c-1.96-9.69-.103-16.049-.103-16.049s-.497 3.871 3.408 10.11c-.05 7.735 1.473 11.77 1.473 11.77l.313-.23-.313.272s-2.316-1.89-4.778-5.873zM16.776 16.74c.937.943 1.81 1.596 2.442 1.907a1.405 1.405 0 0 1-.01-.006s.708.255.834.085c.864-.915 1.075-2.621.5-5.827-3.297-1.882-3.713-4.816-3.713-4.816s-.593 4.073-.053 8.656z" fill="#364FDE"/>
-        <path d="M7.443 2.062S4.73 11.348 9.32 24.577a.954.954 0 0 1-.334 1.06l-4.84 3.393c-.458.339-1.126.127-1.334-.424-1.293-3.52-4.84-15.18-1.252-27.943.167-.509.71-.806 1.21-.594l4.673 1.993z" fill="#56D8FF"/>
-        <path d="m16.704 20.719-4.38 3.222s-2.337-6.19-1.127-17.936c.084-.678.793-1.017 1.377-.678l4.255 2.756s-.834 5.724.376 11.237c.125.55-.084 1.102-.5 1.399zM24.797 13.553l-4.046-2.671c-.25-.17-.626.084-.543.381.96 4.283.835 6.403-.167 7.463-.125.17-.834-.085-.834-.085.668.34.834.17.834.17.668-.509 3.171-2.332 4.756-3.435.626-.466.626-1.399 0-1.823z" fill="#667DFF"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="37" height="42" viewBox="0 0 37 42">
+    <g fill="none" fill-rule="evenodd">
+        <g fill-rule="nonzero">
+            <g>
+                <g>
+                    <path fill="#364FDE" d="M10.648 25.558C7.883 11.884 10.503 2.91 10.503 2.91s-.701 5.463 4.81 14.267c-.07 10.915 2.078 16.609 2.078 16.609l.442-.325-.442.385s-3.267-2.667-6.743-8.288zM23.674 23.622c1.322 1.332 2.555 2.254 3.447 2.692l-.016-.008s1 .36 1.177.12c1.22-1.292 1.519-3.699.705-8.223-4.65-2.656-5.238-6.796-5.238-6.796s-.838 5.748-.075 12.215z" transform="translate(-20 -19) translate(20 19)"/>
+                    <path fill="#56D8FF" d="M10.503 2.91s-3.827 13.104 2.65 31.773c.176.539 0 1.137-.472 1.496l-6.829 4.787c-.648.479-1.59.18-1.884-.598C2.143 35.4-2.86 18.946 2.202.935c.235-.718 1-1.137 1.707-.837l6.594 2.812z" transform="translate(-20 -19) translate(20 19)"/>
+                    <path fill="#667DFF" d="M23.573 29.238l-6.182 4.548s-3.297-8.736-1.59-25.311c.118-.958 1.119-1.436 1.943-.958l6.005 3.89s-1.177 8.078.53 15.857c.177.777-.118 1.555-.706 1.974zM34.994 19.126l-5.711-3.77c-.353-.24-.883.12-.765.539 1.354 6.043 1.177 9.035-.236 10.53-.176.24-1.177-.119-1.177-.119.942.479 1.177.24 1.177.24.942-.719 4.474-3.292 6.712-4.847.883-.658.883-1.975 0-2.573z" transform="translate(-20 -19) translate(20 19)"/>
+                </g>
+            </g>
+        </g>
     </g>
 </svg>
diff --git a/packages/docs/public/images/vueschool/vs-logo.svg b/packages/docs/public/images/vueschool/vs-logo.svg
index b44c004583..01f7ae0504 100644
--- a/packages/docs/public/images/vueschool/vs-logo.svg
+++ b/packages/docs/public/images/vueschool/vs-logo.svg
@@ -1,8 +1,16 @@
-<svg width="128" height="41" viewBox="0 0 128 41" xmlns="http://www.w3.org/2000/svg">
-    <g fill-rule="nonzero" fill="none">
-        <path d="M10.448 25.077c-2.714-13.417-.143-22.222-.143-22.222s-.688 5.36 4.72 13.999c-.07 10.71 2.039 16.296 2.039 16.296l.433-.32-.433.378s-3.206-2.617-6.616-8.13zM23.228 23.177c1.297 1.307 2.507 2.212 3.382 2.642a1.952 1.952 0 0 1-.015-.008s.981.352 1.155.117c1.197-1.267 1.49-3.629.692-8.068-4.564-2.606-5.14-6.668-5.14-6.668s-.822 5.64-.074 11.985z" fill="#364FDE"/>
-        <path d="M10.305 2.855s-3.754 12.858 2.6 31.175c.173.529 0 1.116-.463 1.468l-6.7 4.697c-.636.47-1.56.176-1.849-.587-1.79-4.873-6.7-21.018-1.732-38.69.23-.705.981-1.116 1.675-.822l6.47 2.76z" fill="#56D8FF"/>
-        <path d="m23.129 28.688-6.065 4.462s-3.235-8.572-1.56-24.835c.115-.94 1.097-1.409 1.906-.94l5.892 3.817s-1.155 7.926.52 15.558c.173.763-.116 1.527-.693 1.938zM34.335 18.766l-5.603-3.7c-.347-.234-.867.118-.751.53 1.328 5.929 1.155 8.865-.231 10.332-.174.235-1.156-.117-1.156-.117.925.47 1.156.235 1.156.235.924-.705 4.39-3.23 6.585-4.756.866-.646.866-1.937 0-2.524z" fill="#667DFF"/>
-        <path d="m57.499 17.684 4.43-11.94h-2.46l-3.115 8.875-3.116-8.876h-2.543l4.412 11.941H57.5zm8.118.22c.876 0 1.836-.338 2.29-1.112 0 .336.034.724.068.892h2.139a13.63 13.63 0 0 1-.085-1.499V9.398h-2.24v4.817c0 .96-.572 1.633-1.566 1.633-1.044 0-1.516-.74-1.516-1.667V9.398h-2.24v5.238c0 1.802 1.146 3.267 3.15 3.267zm10.425.033c2.038 0 3.352-1.196 3.773-2.628l-1.87-.555c-.27.74-.842 1.263-1.886 1.263-1.112 0-2.038-.792-2.088-1.886h5.928c0-.034.034-.371.034-.691 0-2.661-1.533-4.295-4.093-4.295-2.122 0-4.076 1.718-4.076 4.362 0 2.796 2.004 4.43 4.278 4.43zm1.684-5.34h-3.705c.05-.757.69-1.633 1.853-1.633 1.28 0 1.819.809 1.852 1.634zM55.781 35.622c2.779 0 4.312-1.853 4.312-3.688 0-1.685-1.162-3.1-3.335-3.52l-1.667-.32c-.876-.169-1.297-.69-1.297-1.348 0-.791.74-1.516 1.87-1.516 1.515 0 2.054 1.028 2.172 1.685l2.088-.64c-.27-1.348-1.38-3.1-4.278-3.1-2.257 0-4.16 1.618-4.16 3.74 0 1.802 1.23 3.031 3.133 3.419l1.667.336c.927.186 1.449.725 1.449 1.415 0 .842-.69 1.465-1.937 1.465-1.684 0-2.51-1.06-2.61-2.24l-2.156.573c.185 1.701 1.583 3.74 4.75 3.74zm9.785 0c2.207 0 3.503-1.415 3.874-2.796l-1.97-.657c-.186.64-.758 1.398-1.904 1.398-1.145 0-2.122-.842-2.122-2.34 0-1.5.96-2.325 2.105-2.325 1.112 0 1.634.707 1.836 1.398l2.004-.674c-.353-1.398-1.633-2.796-3.89-2.796-2.408 0-4.295 1.836-4.295 4.396 0 2.543 1.92 4.396 4.362 4.396zm7.765-.253v-4.867c.05-.91.606-1.617 1.549-1.617 1.078 0 1.533.724 1.533 1.65v4.834h2.24v-5.22c0-1.82-.977-3.285-3.082-3.285-.792 0-1.702.27-2.24.91v-4.598h-2.24v12.193h2.24zm11.317.253c2.476 0 4.346-1.853 4.346-4.396 0-2.56-1.87-4.396-4.346-4.396-2.475 0-4.345 1.836-4.345 4.396 0 2.543 1.87 4.396 4.345 4.396zm0-2.038c-1.094 0-2.105-.808-2.105-2.358 0-1.566 1.01-2.358 2.105-2.358s2.106.792 2.106 2.358c0 1.567-1.01 2.358-2.106 2.358zm9.836 2.038c2.476 0 4.345-1.853 4.345-4.396 0-2.56-1.869-4.396-4.345-4.396s-4.345 1.836-4.345 4.396c0 2.543 1.87 4.396 4.345 4.396zm0-2.038c-1.095 0-2.105-.808-2.105-2.358 0-1.566 1.01-2.358 2.105-2.358s2.105.792 2.105 2.358c0 1.567-1.01 2.358-2.105 2.358zm8.354 1.785V23.175h-2.24v12.193h2.24zm3.705.118c.86 0 1.55-.69 1.55-1.532a1.542 1.542 0 0 0-3.082 0c0 .842.69 1.532 1.532 1.532zm9.095-9.751c.775 0 1.38-.623 1.38-1.364a1.38 1.38 0 0 0-1.38-1.398 1.39 1.39 0 0 0-1.381 1.398c0 .74.623 1.364 1.38 1.364zm1.128 9.633v-8.286h-2.24v8.286h2.24zm6.114.253c2.476 0 4.345-1.853 4.345-4.396 0-2.56-1.87-4.396-4.345-4.396-2.476 0-4.345 1.836-4.345 4.396 0 2.543 1.87 4.396 4.345 4.396zm0-2.038c-1.095 0-2.105-.808-2.105-2.358 0-1.566 1.01-2.358 2.105-2.358s2.105.792 2.105 2.358c0 1.567-1.01 2.358-2.105 2.358z" fill="#FFF"/>
+<svg xmlns="http://www.w3.org/2000/svg" width="120" height="40" viewBox="0 0 120 40">
+    <g fill="none" fill-rule="evenodd">
+        <g fill-rule="nonzero">
+            <g>
+                <g opacity=".9">
+                    <g>
+                        <path fill="#364FDE" d="M9.936 24.365C7.355 11.329 9.8 2.775 9.8 2.775s-.654 5.207 4.488 13.6c-.066 10.405 1.939 15.833 1.939 15.833l.412-.31-.412.367s-3.049-2.543-6.291-7.9zM22.09 22.519c1.233 1.27 2.384 2.148 3.215 2.566l-.014-.007s.933.342 1.098.114c1.139-1.232 1.417-3.526.658-7.84-4.34-2.531-4.887-6.478-4.887-6.478s-.782 5.48-.07 11.645z" transform="translate(-30.000000, -19.000000) translate(30.000000, 19.000000)"/>
+                        <path fill="#56D8FF" d="M9.8 2.774s-3.57 12.492 2.472 30.29c.165.513 0 1.083-.44 1.426L5.46 39.053c-.604.456-1.483.171-1.757-.57C2 33.748-2.67 18.06 2.055.892c.22-.685.933-1.084 1.593-.799L9.8 2.774z" transform="translate(-30.000000, -19.000000) translate(30.000000, 19.000000)"/>
+                        <path fill="#667DFF" d="M21.995 27.873l-5.768 4.335S13.15 23.88 14.744 8.079c.11-.913 1.043-1.369 1.813-.913l5.602 3.708s-1.098 7.7.495 15.116c.165.742-.11 1.483-.66 1.883zM32.651 18.233l-5.328-3.594c-.33-.228-.824.114-.714.513 1.263 5.762 1.099 8.614-.22 10.04-.165.228-1.098-.114-1.098-.114.878.456 1.098.228 1.098.228.88-.685 4.175-3.138 6.262-4.62.824-.628.824-1.883 0-2.453z" transform="translate(-30.000000, -19.000000) translate(30.000000, 19.000000)"/>
+                    </g>
+                </g>
+                <path fill="#FFF" d="M54.753 13.93l-3.028-8.623h-2.47l4.287 11.602h2.323L60.17 5.307H57.78l-3.027 8.624zm11.29 2.98h2.079l-.016-.148c-.028-.276-.06-.697-.065-1.167l-.001-6.737h-2.176v4.68c0 .933-.557 1.587-1.522 1.587-1.015 0-1.473-.72-1.473-1.62V8.858h-2.176v5.09c0 1.75 1.112 3.174 3.06 3.174.85 0 1.783-.327 2.225-1.08 0 .327.033.703.066.867zm5.875-4.943c.05-.736.671-1.587 1.8-1.587 1.244 0 1.767.785 1.8 1.587h-3.6zm3.813 2.095c-.262.72-.818 1.227-1.833 1.227-1.08 0-1.98-.769-2.029-1.833h5.76l.024-.366c.005-.095.009-.2.009-.305 0-2.585-1.49-4.172-3.977-4.172-2.061 0-3.96 1.669-3.96 4.238 0 2.716 1.948 4.304 4.157 4.304 1.98 0 3.256-1.162 3.665-2.553l-1.816-.54zM58.22 25.255c-.261-1.31-1.341-3.011-4.156-3.011-2.192 0-4.041 1.57-4.041 3.632 0 1.751 1.194 2.946 3.043 3.322l1.62.327c.9.18 1.408.704 1.408 1.375 0 .818-.671 1.424-1.882 1.424-1.637 0-2.438-1.031-2.537-2.177l-2.094.557c.18 1.652 1.538 3.632 4.614 3.632 2.7 0 4.19-1.8 4.19-3.583 0-1.637-1.13-3.011-3.24-3.42l-1.62-.311c-.851-.164-1.26-.671-1.26-1.31 0-.768.72-1.472 1.816-1.472 1.473 0 1.996.998 2.11 1.636l2.03-.621zm5.466 2.552c1.08 0 1.588.688 1.784 1.358l1.947-.654c-.343-1.358-1.587-2.716-3.78-2.716-2.34 0-4.173 1.783-4.173 4.27 0 2.471 1.866 4.271 4.239 4.271 2.143 0 3.403-1.374 3.763-2.716l-1.914-.638c-.18.622-.737 1.358-1.85 1.358-1.112 0-2.061-.818-2.061-2.275 0-1.456.933-2.258 2.045-2.258zm7.56 1.555c.05-.884.59-1.571 1.506-1.571 1.047 0 1.489.704 1.489 1.604v4.696h2.176v-5.073c0-1.767-.949-3.19-2.994-3.19-.77 0-1.653.261-2.177.883v-4.467h-2.176V34.09h2.176v-4.73zm10.997 2.994c-1.064 0-2.046-.785-2.046-2.29 0-1.522.982-2.291 2.046-2.291 1.063 0 2.045.769 2.045 2.29 0 1.522-.982 2.291-2.045 2.291zm0-6.561c-2.406 0-4.222 1.783-4.222 4.27 0 2.471 1.816 4.271 4.222 4.271 2.405 0 4.221-1.8 4.221-4.27 0-2.488-1.816-4.271-4.221-4.271zm9.556 6.561c-1.064 0-2.045-.785-2.045-2.29 0-1.522.981-2.291 2.045-2.291s2.045.769 2.045 2.29c0 1.522-.981 2.291-2.045 2.291zm0-6.561c-2.405 0-4.222 1.783-4.222 4.27 0 2.471 1.817 4.271 4.222 4.271 2.405 0 4.222-1.8 4.222-4.27 0-2.488-1.817-4.271-4.222-4.271zm8.116 8.296V22.244H97.74V34.09h2.176zm15.339-1.735c-1.064 0-2.046-.785-2.046-2.29 0-1.522.982-2.291 2.046-2.291 1.063 0 2.045.769 2.045 2.29 0 1.522-.982 2.291-2.045 2.291zm0-6.561c-2.406 0-4.222 1.783-4.222 4.27 0 2.471 1.816 4.271 4.222 4.271 2.405 0 4.221-1.8 4.221-4.27 0-2.488-1.816-4.271-4.221-4.271zm-6.066 8.296v-8.182h-2.176v8.182h2.176zm-2.28-10.386c0-.599.489-1.09 1.085-1.09.608 0 1.097.491 1.097 1.09 0 .6-.489 1.091-1.097 1.091-.596 0-1.085-.491-1.085-1.09zm-4.882 9.011c0-.818.671-1.489 1.49-1.489.834 0 1.505.671 1.505 1.49 0 .818-.671 1.488-1.506 1.488-.818 0-1.489-.67-1.489-1.489z" transform="translate(-30.000000, -19.000000) translate(30.000000, 19.000000)"/>
+            </g>
+        </g>
     </g>
 </svg>