From 97f71c75194bc8f64eea20a77a5b08e49ae3c6f0 Mon Sep 17 00:00:00 2001
From: Ashley Marques <marques.ashley@gmail.com>
Date: Tue, 2 Jan 2024 17:57:06 -0300
Subject: [PATCH] Updated banner messaging and styling

---
 .vitepress/theme/components/Banner.vue        | 214 +++++-------------
 .../partners/herodevs-white-letters.svg       |   7 +
 2 files changed, 59 insertions(+), 162 deletions(-)
 create mode 100644 src/public/images/partners/herodevs-white-letters.svg

diff --git a/.vitepress/theme/components/Banner.vue b/.vitepress/theme/components/Banner.vue
index e60de21c8d..425b3e09f7 100644
--- a/.vitepress/theme/components/Banner.vue
+++ b/.vitepress/theme/components/Banner.vue
@@ -25,141 +25,32 @@ function dismiss() {
     <a
       class="banner__container"
       target="_blank"
-      href="https://www.herodevs.com/support/nes-vue?utm_source=vuejs-org&utm_medium=banner&utm_campaign=eol-by-eoy"
+      href="https://www.herodevs.com/support/nes-vue?utm_source=vuejs-org&utm_medium=banner&utm_campaign=post-eol"
     >
-      <svg
-        id="herodevs_logo"
-        width="158"
-        height="39"
-        viewBox="0 0 158 39"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <path
-          fill-rule="evenodd"
-          clip-rule="evenodd"
-          d="M13.0452 15.5193C8.1975 14.0655 8.74561 26.7218 14.3969 23.2543C16.0279 22.2534 18.1777 20.8149 20.7508 20.8149C23.0721 20.8149 24.3422 23.3645 26.6636 23.3645C30.0074 22.9956 29.8636 16.5603 27.6048 16.3521C25.2295 16.3521 23.283 20.4188 20.2091 19.4631C17.555 18.6381 14.831 16.0547 13.0452 15.5193ZM13.7012 13.4791C16.1773 14.2216 18.3342 16.6238 20.8343 17.4009C21.0378 17.4642 21.2109 17.4657 21.4157 17.4094C21.8943 17.278 22.4424 16.8688 22.8353 16.5673C24.2855 15.4544 25.6192 14.217 27.5513 14.217H27.648L27.7443 14.226C32.7224 14.6849 32.6743 25.0216 26.8475 25.6646L26.7326 25.6773H26.5887C26.4046 25.6773 26.2198 25.6718 26.0371 25.6488C24.5381 25.4602 23.5156 24.7725 22.4515 24.017C22.0279 23.7162 21.2961 23.146 20.7465 23.146C18.8428 23.146 17.127 24.2838 15.5473 25.2532C13.9924 26.2072 12.1797 26.5528 10.5301 25.6194C8.58366 24.518 7.7455 22.1024 7.65976 19.9244C7.5707 17.6642 8.27368 15.0092 10.304 13.8251C11.3583 13.2102 12.5503 13.1339 13.7012 13.4791Z"
-          fill="url(#paint0_linear_4505_2379)"
-        />
-        <path
-          fill-rule="evenodd"
-          clip-rule="evenodd"
-          d="M17.9497 5.17539C-1.0205 3.91536 11.1694 5.09879 6.92234 10.7882C5.11346 13.2134 4.03283 16.2561 4.03283 19.5726C4.03283 27.5238 10.2637 33.9694 17.9497 33.9694C23.6403 33.9694 28.5326 30.436 30.6896 25.3756C32.035 22.664 32.8455 18.7261 30.7129 13.9061C28.5649 8.93155 23.6514 5.55449 17.9497 5.17539ZM18.0955 2.83086C26.825 3.41051 34.1384 10.2482 34.1384 19.5726C34.1384 28.8209 26.8897 36.3191 17.9497 36.3191C9.01046 36.3191 1.76172 28.8203 1.76172 19.5726C1.76172 15.8637 2.93322 12.2892 5.12439 9.35235C5.44884 8.91764 5.75017 8.44702 5.55872 7.89451C5.13486 6.67308 4.23897 6.01743 4.77682 4.40303C5.44097 2.40924 7.60847 2.36038 9.2898 2.36973C12.1915 2.38602 15.198 2.63844 18.0955 2.83086Z"
-          fill="url(#paint1_linear_4505_2379)"
-        />
-        <path
-          id="hero_text1"
-          fill-rule="evenodd"
-          clip-rule="evenodd"
-          d="M106.486 26.8296C103.804 26.8296 101.453 24.5983 101.453 21.1085V21.0513C101.453 17.4754 103.721 15.3587 106.486 15.3587C109.141 15.3587 111.657 17.647 111.657 21.0513V21.1085C111.657 24.5124 109.141 26.8296 106.486 26.8296ZM118.417 20.2487C118.697 17.3281 120.597 15.1597 123.113 15.1597C125.992 15.1597 127.501 17.5306 127.724 20.2487H118.417ZM123.532 29.0552C126.272 29.0552 128.032 27.9275 129.486 26.2504L128.144 25.0073C126.97 26.2794 125.573 27.1178 123.588 27.1178C121.017 27.1178 118.809 25.2963 118.502 22.0582H129.961C129.989 21.798 129.989 21.6245 129.989 21.3352C129.989 16.9692 127.529 13.4418 123.253 13.4418C119.256 13.4418 116.322 16.9115 116.322 21.2194V21.2775C116.322 25.9035 119.564 29.0552 123.532 29.0552ZM136.272 28.6932H138.175L144.47 13.6138H142.148L137.251 26.0301L132.383 13.6138H130.005L136.272 28.6932ZM150.535 28.858C153.414 28.858 155.679 27.2096 155.679 24.3755V24.3581C155.679 21.6377 153.247 20.7308 150.985 20.0288C149.034 19.4145 147.224 18.8589 147.224 17.4256V17.3822C147.224 16.1555 148.3 15.2428 149.982 15.2428C151.361 15.2428 152.877 15.7846 154.201 16.669L155.166 15.0143C153.704 14.0161 151.774 13.3884 150.037 13.3884C147.224 13.3884 145.184 15.0717 145.184 17.6104V17.6682C145.184 20.4381 147.72 21.2542 150.003 21.925C151.919 22.4785 153.638 23.0619 153.638 24.5777V24.607C153.638 26.0528 152.38 26.978 150.647 26.978C148.942 26.978 147.209 26.284 145.644 25.0695L144.554 26.66C146.174 28.019 148.467 28.858 150.535 28.858ZM106.079 28.8068C108.755 28.8068 110.474 27.2745 111.657 25.4821V28.3916H113.698V9.69315H111.657V16.403C110.53 14.7261 108.784 13.2225 106.079 13.2225C102.586 13.2225 99.1211 16.1141 99.1211 21.0002V21.0583C99.1211 25.9734 102.586 28.8068 106.079 28.8068Z"
-          fill="url(#paint2_linear_4505_2379)"
-        />
-        <path
-          id="hero_text2"
-          fill-rule="evenodd"
-          clip-rule="evenodd"
-          d="M64.0917 28.9232C62.9737 28.9232 61.9347 28.7305 60.9752 28.345C60.0158 27.9594 59.1867 27.4099 58.4876 26.697C57.7887 25.9835 57.2439 25.1402 56.8526 24.1668C56.4614 23.1935 56.2658 22.1092 56.2658 20.914V20.8562C56.2658 19.7576 56.4474 18.7168 56.8106 17.7336C57.1742 16.7505 57.682 15.8925 58.3339 15.1604C58.9861 14.4278 59.7642 13.8494 60.6679 13.4252C61.5717 13.0015 62.5731 12.7893 63.6725 12.7893C64.9211 12.7893 66.0016 13.0204 66.9146 13.4833C67.8277 13.9457 68.5869 14.5675 69.1927 15.3482C69.7982 16.1289 70.2454 17.0253 70.5343 18.0372C70.8227 19.049 70.9676 20.1046 70.9676 21.2032C70.9676 21.3766 70.9629 21.5597 70.9536 21.7526C70.9439 21.9452 70.9302 22.1478 70.9116 22.3599H60.4863C60.6913 23.3622 61.1152 24.1185 61.758 24.6294C62.4005 25.1402 63.1973 25.3958 64.1477 25.3958C64.8555 25.3958 65.489 25.2704 66.0482 25.0197C66.6074 24.7692 67.1849 24.3645 67.7811 23.8054L70.2128 26.0316C69.5046 26.9376 68.6472 27.6462 67.6411 28.1568C66.6351 28.6676 65.4517 28.9232 64.0917 28.9232ZM66.6969 19.6456C66.5663 18.6627 66.231 17.8674 65.6905 17.2602C65.15 16.653 64.4328 16.3494 63.5384 16.3494C62.644 16.3494 61.9218 16.6482 61.3723 17.246C60.8227 17.8435 60.4639 18.6433 60.2962 19.6456H66.6969ZM72.3002 13.0107H76.6732V16.0713C77.0912 15.032 77.6641 14.2011 78.3918 13.5776C79.1191 12.954 80.1013 12.6706 81.3377 12.7274V17.2329H81.1194C79.7375 17.2329 78.6507 17.6672 77.8597 18.5364C77.0685 19.4053 76.6732 20.756 76.6732 22.5883V28.3916H72.3002V13.0107ZM90.0558 28.9724C88.892 28.9724 87.8133 28.7637 86.8186 28.3465C85.8242 27.9289 84.9656 27.3563 84.2429 26.6281C83.5204 25.9004 82.9528 25.0461 82.5403 24.066C82.1272 23.0856 81.9208 22.0324 81.9208 20.9065V20.8483C81.9208 19.7223 82.1272 18.6692 82.5403 17.689C82.9528 16.7085 83.5251 15.8494 84.2569 15.112C84.9889 14.3743 85.8521 13.7916 86.8469 13.3646C87.8413 12.9377 88.9296 12.7242 90.112 12.7242C91.2756 12.7242 92.3542 12.9329 93.3489 13.3501C94.3434 13.7677 95.2022 14.3402 95.9247 15.0684C96.6471 15.7961 97.2144 16.6504 97.6272 17.6306C98.0403 18.611 98.2467 19.6642 98.2467 20.7901V20.8483C98.2467 21.9743 98.0403 23.0274 97.6272 24.0075C97.2144 24.9881 96.6424 25.8469 95.9107 26.5846C95.1786 27.3223 94.3154 27.9049 93.3207 28.3317C92.3265 28.7588 91.2379 28.9724 90.0558 28.9724ZM89.966 25.1524C90.5846 25.1524 91.1327 25.0408 91.6105 24.8179C92.0884 24.5949 92.4962 24.2895 92.8335 23.9019C93.1708 23.514 93.4285 23.0634 93.6064 22.5495C93.7848 22.0357 93.8737 21.4882 93.8737 20.9064V20.8483C93.8737 20.2668 93.7801 19.7189 93.5924 19.2051C93.4052 18.6912 93.1332 18.2358 92.7772 17.8383C92.421 17.4409 91.9994 17.126 91.5123 16.8931C91.0248 16.6606 90.491 16.5442 89.9097 16.5442C89.2914 16.5442 88.743 16.6557 88.2655 16.8786C87.7873 17.1016 87.3798 17.407 87.0425 17.7947C86.7052 18.1825 86.4474 18.6332 86.269 19.147C86.0912 19.6609 86.0023 20.2083 86.0023 20.7902V20.8483C86.0023 21.4298 86.0959 21.9777 86.2833 22.4915C86.4708 23.005 86.7428 23.4608 87.0987 23.8583C87.455 24.2556 87.8716 24.5705 88.3497 24.8034C88.8275 25.036 89.3663 25.1524 89.966 25.1524ZM45.1875 9.69321V15.4124C45.4335 15.0797 45.7029 14.7666 45.9965 14.463C46.2898 14.1641 46.6157 13.8992 46.9754 13.6629C47.3346 13.4316 47.7323 13.2486 48.1672 13.1086C48.6025 12.9737 49.0943 12.9064 49.6427 12.9064C51.289 12.9064 52.5612 13.4172 53.46 14.4387C54.3586 15.4605 54.8081 16.8675 54.8081 18.6604V28.6932H50.4351V20.0673C50.4351 19.0312 50.2106 18.2457 49.7616 17.7206C49.3127 17.1905 48.6768 16.9255 47.8533 16.9255C47.0305 16.9255 46.3801 17.1905 45.9032 17.7206C45.4259 18.2457 45.1875 19.0312 45.1875 20.0673V28.3916H40.8145V9.69321H45.1875Z"
-          fill="white"
-        />
-        <defs>
-          <linearGradient
-            id="paint0_linear_4505_2379"
-            x1="7.65234"
-            y1="20.2175"
-            x2="31.358"
-            y2="20.0106"
-            gradientUnits="userSpaceOnUse"
-          >
-            <stop stop-color="#F926E1" />
-            <stop offset="1" stop-color="#2AB5FB" />
-          </linearGradient>
-          <linearGradient
-            id="paint1_linear_4505_2379"
-            x1="1.76172"
-            y1="20.6498"
-            x2="34.1437"
-            y2="20.5032"
-            gradientUnits="userSpaceOnUse"
-          >
-            <stop stop-color="#F926E1" />
-            <stop offset="1" stop-color="#2AB5FB" />
-          </linearGradient>
-          <linearGradient
-            id="paint2_linear_4505_2379"
-            x1="99.1211"
-            y1="20.1189"
-            x2="155.678"
-            y2="19.3345"
-            gradientUnits="userSpaceOnUse"
-          >
-            <stop stop-color="#F926E1" />
-            <stop offset="1" stop-color="#2AB5FB" />
-          </linearGradient>
-        </defs>
-      </svg>
+      <img
+        id="herodevs_left_logo"
+        style="width: 15%; max-width: 175px"
+        src="/images/partners/herodevs-white-letters.svg"
+        alt="HeroDevs logo"
+      />
       <div class="banner__middle">
-        <div class="title gradient_text">
-          Haven't migrated to Vue 3 yet?
+        <div class="title white_text uppercase">
+          Vue 2 is officially end-of-life
         </div>
         <div class="separator"></div>
         <div class="subtitle white_text">
-          Explore Never-Ending Support for Vue 2 by HeroDevs
+          Need to stay compliant? Explore Vue's official LTS partner
+          HeroDevs
         </div>
         <div class="cta_button_container">
           <button class="cta_button">Learn more</button>
         </div>
       </div>
-      <svg
-        id="vuenes_logo"
-        width="175"
-        height="35"
-        viewBox="0 0 175 35"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <path
-          d="M27.5598 0.343994L22.9235 8.19587L18.2872 0.343994H2.84766L22.9235 34.344L42.9993 0.343994H27.5598Z"
-          fill="url(#paint0_linear_4505_2374)"
-        />
-        <path
-          d="M27.5587 0.344048L22.9224 8.19593L18.2862 0.344048H10.877L22.9224 20.7437L34.9679 0.344048H27.5587Z"
-          fill="#34495E"
-        />
-        <path
-          id="vuenes_text"
-          d="M51.5644 7.88399H55.8024L60.7684 22.054L65.7084 7.88399H69.7904L62.7704 26.344H58.5844L51.5644 7.88399ZM71.0634 12.616H74.7034V20.286C74.7034 21.924 75.4574 23.458 77.3034 23.458C79.1494 23.458 79.9034 21.924 79.9034 20.286V12.616H83.5434V20.208C83.5434 23.952 81.2294 26.734 77.2514 26.734C73.4034 26.734 71.0634 24.082 71.0634 20.208V12.616ZM85.9301 19.454C85.9301 15.554 88.6601 12.226 92.7681 12.226C96.9541 12.226 99.4761 15.32 99.4761 19.48V20.39H89.6221C89.9081 22.21 91.0001 23.666 92.9761 23.666C94.2761 23.666 95.2641 23.042 95.9401 21.95L99.1901 22.99C98.2021 25.46 95.5241 26.734 92.9501 26.734C88.8161 26.734 85.9301 23.614 85.9301 19.454ZM92.7681 15.034C91.0261 15.034 89.9861 16.334 89.6741 17.946H95.7321C95.4981 16.334 94.5101 15.034 92.7681 15.034ZM106.649 13.136C107.273 10.042 109.821 8.01399 112.993 8.01399C116.347 8.01399 119.051 10.328 119.051 13.838C119.051 14.618 118.921 15.346 118.635 16.048C117.595 18.596 114.423 21.352 112.369 23.068H119.363V26.344H106.831V23.64L108.651 22.08C110.471 20.52 112.291 18.934 113.825 17.062C114.605 16.1 115.229 15.164 115.229 13.89C115.229 12.408 114.423 11.316 112.863 11.316C111.381 11.316 110.497 12.382 110.159 13.734L106.649 13.136ZM127.665 7.88399H131.019L139.573 20.104V7.88399H143.317V26.344H139.963L131.409 14.124V26.344H127.665V7.88399ZM146.708 7.88399H158.278V11.186H150.452V15.216H157.446V18.518H150.452V23.042H158.538V26.344H146.708V7.88399ZM160.571 21.898L164.185 21.118C164.679 22.574 165.849 23.38 167.383 23.38C168.787 23.38 170.191 22.652 170.191 21.066C170.191 19.558 168.657 19.09 167.435 18.804L166.603 18.622C163.717 17.998 161.039 16.516 161.039 13.214C161.039 9.70399 164.081 7.49399 167.461 7.49399C170.425 7.49399 173.129 9.18399 173.779 12.226L170.217 13.006C170.009 12.304 169.645 11.784 169.151 11.394C168.631 11.03 168.033 10.848 167.357 10.848C166.135 10.848 164.887 11.576 164.887 12.954C164.887 14.436 166.499 14.878 167.669 15.138L168.501 15.32C171.465 15.97 174.065 17.348 174.065 20.754C174.065 24.498 170.945 26.734 167.331 26.734C164.289 26.734 161.299 25.018 160.571 21.898Z"
-          fill="white"
-        />
-        <path
-          d="M51.5644 7.88399H55.8024L60.7684 22.054L65.7084 7.88399H69.7904L62.7704 26.344H58.5844L51.5644 7.88399ZM71.0634 12.616H74.7034V20.286C74.7034 21.924 75.4574 23.458 77.3034 23.458C79.1494 23.458 79.9034 21.924 79.9034 20.286V12.616H83.5434V20.208C83.5434 23.952 81.2294 26.734 77.2514 26.734C73.4034 26.734 71.0634 24.082 71.0634 20.208V12.616ZM85.9301 19.454C85.9301 15.554 88.6601 12.226 92.7681 12.226C96.9541 12.226 99.4761 15.32 99.4761 19.48V20.39H89.6221C89.9081 22.21 91.0001 23.666 92.9761 23.666C94.2761 23.666 95.2641 23.042 95.9401 21.95L99.1901 22.99C98.2021 25.46 95.5241 26.734 92.9501 26.734C88.8161 26.734 85.9301 23.614 85.9301 19.454ZM92.7681 15.034C91.0261 15.034 89.9861 16.334 89.6741 17.946H95.7321C95.4981 16.334 94.5101 15.034 92.7681 15.034ZM106.649 13.136C107.273 10.042 109.821 8.01399 112.993 8.01399C116.347 8.01399 119.051 10.328 119.051 13.838C119.051 14.618 118.921 15.346 118.635 16.048C117.595 18.596 114.423 21.352 112.369 23.068H119.363V26.344H106.831V23.64L108.651 22.08C110.471 20.52 112.291 18.934 113.825 17.062C114.605 16.1 115.229 15.164 115.229 13.89C115.229 12.408 114.423 11.316 112.863 11.316C111.381 11.316 110.497 12.382 110.159 13.734L106.649 13.136ZM127.665 7.88399H131.019L139.573 20.104V7.88399H143.317V26.344H139.963L131.409 14.124V26.344H127.665V7.88399ZM146.708 7.88399H158.278V11.186H150.452V15.216H157.446V18.518H150.452V23.042H158.538V26.344H146.708V7.88399ZM160.571 21.898L164.185 21.118C164.679 22.574 165.849 23.38 167.383 23.38C168.787 23.38 170.191 22.652 170.191 21.066C170.191 19.558 168.657 19.09 167.435 18.804L166.603 18.622C163.717 17.998 161.039 16.516 161.039 13.214C161.039 9.70399 164.081 7.49399 167.461 7.49399C170.425 7.49399 173.129 9.18399 173.779 12.226L170.217 13.006C170.009 12.304 169.645 11.784 169.151 11.394C168.631 11.03 168.033 10.848 167.357 10.848C166.135 10.848 164.887 11.576 164.887 12.954C164.887 14.436 166.499 14.878 167.669 15.138L168.501 15.32C171.465 15.97 174.065 17.348 174.065 20.754C174.065 24.498 170.945 26.734 167.331 26.734C164.289 26.734 161.299 25.018 160.571 21.898Z"
-          fill="url(#paint1_linear_4505_2374)"
-          fill-opacity="0.024"
-        />
-        <defs>
-          <linearGradient
-            id="paint0_linear_4505_2374"
-            x1="2.84766"
-            y1="18.6517"
-            x2="43.0054"
-            y2="18.4265"
-            gradientUnits="userSpaceOnUse"
-          >
-            <stop stop-color="#F926E1" />
-            <stop offset="1" stop-color="#2AB5FB" />
-          </linearGradient>
-          <linearGradient
-            id="paint1_linear_4505_2374"
-            x1="51"
-            y1="16.2671"
-            x2="174.968"
-            y2="18.8737"
-            gradientUnits="userSpaceOnUse"
-          >
-            <stop stop-color="#F926E1" />
-            <stop offset="1" stop-color="#2AB5FB" />
-          </linearGradient>
-        </defs>
-      </svg>
+      <img
+        id="herodevs_right_logo"
+        src="/images/partners/herodevs-white-letters.svg"
+        alt="HeroDevs logo"
+      />
 
       <button id="dismiss_button" @click.stop.prevent="dismiss">
         <VTIconPlus class="close" />
@@ -176,7 +67,7 @@ html:not(.banner-dismissed) {
 
 <style scoped>
 .banner {
-  --gradient_text_size: 13px;
+  --title_text_size: 13px;
   --white_text_size: 10px;
   --banner_container_gap: 0;
 
@@ -193,14 +84,15 @@ html:not(.banner-dismissed) {
   font-size: 13px;
   font-weight: 600;
   color: #fff;
-  background-color: var(--vt-c-green);
+  background-color: #ed00d2;
+}
+/*background-color: var(--vt-c-green);
   background: linear-gradient(
       0deg,
       rgba(13, 13, 13, 0.76) 0%,
       rgba(13, 13, 13, 0.76) 100%
     ),
-    linear-gradient(90deg, #f926e1 0.22%, #2ab5fb 99.76%);
-}
+    linear-gradient(90deg, #f926e1 0.22%, #2ab5fb 99.76%);*/
 
 .banner__container {
   cursor: pointer;
@@ -232,6 +124,11 @@ html:not(.banner-dismissed) {
   grid-column-end: button-col;
   grid-row-start: title;
   grid-row-end: subtitle;
+  font-size: var(--title_text_size);
+  font-style: normal;
+  font-weight: 800;
+  line-height: var(--title_text_size); /* 100% */
+  min-width: 307px;
 }
 
 .banner__middle .subtitle {
@@ -239,14 +136,16 @@ html:not(.banner-dismissed) {
   display: flex;
   justify-content: center;
   align-items: center;
-}
-
-.gradient_text {
-  font-size: var(--gradient_text_size);
+  text-align: center;
+  font-size: var(--white_text_size);
   font-style: normal;
-  font-weight: 800;
-  line-height: var(--gradient_text_size); /* 100% */
+  font-weight: 700;
+  line-height: var(--white_text_size);
+}
+.uppercase {
   text-transform: uppercase;
+}
+.gradient_text {
   text-decoration: none;
   background: linear-gradient(90deg, #f926e1 0.22%, #2ab5fb 99.76%);
   background-clip: text;
@@ -256,11 +155,6 @@ html:not(.banner-dismissed) {
 
 .white_text {
   color: var(--vt-c-white, #fff);
-  text-align: center;
-  font-size: var(--white_text_size);
-  font-style: normal;
-  font-weight: 700;
-  line-height: var(--white_text_size);
 }
 
 .separator {
@@ -294,7 +188,7 @@ html:not(.banner-dismissed) {
 
 .banner__container:hover {
   .cta_button {
-    box-shadow: 0px 0px 12px 5px #f04cc5;
+    box-shadow: 0px 0px 12px 5px #2ab5fb;
   }
 }
 
@@ -316,31 +210,28 @@ button#dismiss_button {
   transform: rotate(45deg);
 }
 
-#herodevs_logo,
-#hero_text2,
-#hero_text1,
-#vuenes_logo,
-#vuenes_text {
+#herodevs_left_logo,
+#herodevs_right_logo {
   display: none;
 }
 
 @media (min-width: 320px) {
   .banner {
-    --gradient_text_size: 14px;
+    --title_text_size: 14px;
     --white_text_size: 10px;
     --banner_container_gap: 0;
   }
 }
 @media (min-width: 480px) {
   .banner {
-    --gradient_text_size: 15px;
+    --title_text_size: 15px;
     --white_text_size: 12px;
     --banner_container_gap: 0;
   }
 }
 @media (min-width: 600px) {
   .banner {
-    --gradient_text_size: 18px;
+    --title_text_size: 18px;
     --white_text_size: 14px;
     --banner_container_gap: 0;
   }
@@ -353,8 +244,8 @@ button#dismiss_button {
 }
 @media (min-width: 801px) {
   .banner {
-    --gradient_text_size: 22px;
-    --white_text_size: 16px;
+    --title_text_size: 22px;
+    --white_text_size: 14px;
     --banner_container_gap: 0;
   }
   .banner__container {
@@ -362,35 +253,34 @@ button#dismiss_button {
   }
 }
 @media (min-width: 910px) {
-  #herodevs_logo {
+  /* .banner {
+    --white_text_size: 16px;
+  } */
+  #herodevs_left_logo {
     display: block;
   }
 }
 @media (min-width: 1025px) {
-  #hero_text2,
-  #hero_text1 {
-    display: block;
-  }
   .banner {
-    --banner_container_gap: 40px;
+    --banner_container_gap: 20px;
   }
 }
 @media (min-width: 1281px) {
-  #vuenes_logo,
-  #vuenes_text {
+  #herodevs_right_logo {
     display: block;
     margin-left: 0;
   }
   .banner {
-    --gradient_text_size: 24px;
-    --white_text_size: 18px;
+    --title_text_size: 24px;
+    --white_text_size: 14px;
     --banner_container_gap: 80px;
   }
 }
 
 @media (min-width: 1380px) {
   .banner {
-    --gradient_text_size: 28px;
+    --title_text_size: 26px;
+    --white_text_size: 18px;
   }
   .banner__container .banner__middle {
     display: flex;
diff --git a/src/public/images/partners/herodevs-white-letters.svg b/src/public/images/partners/herodevs-white-letters.svg
new file mode 100644
index 0000000000..23e7b55e9b
--- /dev/null
+++ b/src/public/images/partners/herodevs-white-letters.svg
@@ -0,0 +1,7 @@
+<svg width="175" height="38" viewBox="0 0 175 38" fill="none"
+  xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M13.0452 15.1752C8.1975 13.7215 8.74561 26.3778 14.3969 22.9102C16.0279 21.9093 18.1777 20.4708 20.7508 20.4708C23.0721 20.4708 24.3422 23.0205 26.6636 23.0205C30.0074 22.6515 29.8636 16.2163 27.6048 16.008C25.2295 16.008 23.283 20.0747 20.2091 19.1191C17.555 18.2941 14.831 15.7107 13.0452 15.1752ZM13.7012 13.135C16.1773 13.8776 18.3342 16.2798 20.8343 17.0568C21.0378 17.1201 21.2109 17.1216 21.4157 17.0653C21.8943 16.934 22.4424 16.5247 22.8353 16.2232C24.2855 15.1103 25.6192 13.873 27.5513 13.873H27.648L27.7443 13.8819C32.7224 14.3408 32.6743 24.6776 26.8475 25.3206L26.7326 25.3333H26.5887C26.4046 25.3333 26.2198 25.3277 26.0371 25.3048C24.5381 25.1162 23.5156 24.4284 22.4515 23.6729C22.0279 23.3722 21.2961 22.802 20.7465 22.802C18.8428 22.802 17.127 23.9397 15.5473 24.9092C13.9924 25.8632 12.1797 26.2087 10.5301 25.2753C8.58366 24.174 7.7455 21.7583 7.65976 19.5804C7.5707 17.3201 8.27368 14.6651 10.304 13.481C11.3583 12.8662 12.5503 12.7899 13.7012 13.135Z" fill="white"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M17.9497 4.8314C-1.0205 3.57137 11.1694 4.7548 6.92234 10.4442C5.11346 12.8694 4.03283 15.9121 4.03283 19.2286C4.03283 27.1798 10.2637 33.6254 17.9497 33.6254C23.6403 33.6254 28.5326 30.092 30.6896 25.0316C32.035 22.32 32.8455 18.3821 30.7129 13.5621C28.5649 8.58755 23.6514 5.21049 17.9497 4.8314ZM18.0955 2.48686C26.825 3.06651 34.1384 9.90416 34.1384 19.2286C34.1384 28.4769 26.8897 35.9751 17.9497 35.9751C9.01046 35.9751 1.76172 28.4763 1.76172 19.2286C1.76172 15.5197 2.93322 11.9452 5.12439 9.00836C5.44884 8.57365 5.75017 8.10302 5.55872 7.55051C5.13486 6.32908 4.23897 5.67343 4.77682 4.05904C5.44097 2.06524 7.60847 2.01639 9.2898 2.02574C12.1915 2.04202 15.198 2.29445 18.0955 2.48686Z" fill="white"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M106.486 26.4856C103.804 26.4856 101.453 24.2544 101.453 20.7645V20.7074C101.453 17.1315 103.721 15.0148 106.486 15.0148C109.141 15.0148 111.657 17.3031 111.657 20.7074V20.7645C111.657 24.1685 109.141 26.4856 106.486 26.4856ZM118.417 19.9048C118.697 16.9842 120.597 14.8157 123.113 14.8157C125.992 14.8157 127.501 17.1867 127.724 19.9048H118.417ZM123.532 28.7112C126.272 28.7112 128.032 27.5836 129.486 25.9065L128.144 24.6634C126.97 25.9355 125.573 26.7739 123.588 26.7739C121.017 26.7739 118.809 24.9523 118.502 21.7143H129.961C129.989 21.4541 129.989 21.2805 129.989 20.9913C129.989 16.6252 127.529 13.0979 123.253 13.0979C119.256 13.0979 116.322 16.5675 116.322 20.8755V20.9336C116.322 25.5595 119.564 28.7112 123.532 28.7112ZM136.272 28.3492H138.175L144.47 13.2698H142.148L137.251 25.6862L132.383 13.2698H130.005L136.272 28.3492ZM150.535 28.514C153.414 28.514 155.679 26.8657 155.679 24.0316V24.0141C155.679 21.2937 153.247 20.3868 150.985 19.6848C149.034 19.0706 147.224 18.515 147.224 17.0816V17.0383C147.224 15.8115 148.3 14.8989 149.982 14.8989C151.361 14.8989 152.877 15.4407 154.201 16.3251L155.166 14.6703C153.704 13.6722 151.774 13.0445 150.037 13.0445C147.224 13.0445 145.184 14.7277 145.184 17.2665V17.3243C145.184 20.0942 147.72 20.9103 150.003 21.5811C151.919 22.1346 153.638 22.718 153.638 24.2337V24.2631C153.638 25.7089 152.38 26.6341 150.647 26.6341C148.942 26.6341 147.209 25.94 145.644 24.7256L144.554 26.3161C146.174 27.6751 148.467 28.514 150.535 28.514ZM106.079 28.4629C108.755 28.4629 110.474 26.9306 111.657 25.1381V28.0476H113.698V9.34921H111.657V16.0591C110.53 14.3822 108.784 12.8786 106.079 12.8786C102.586 12.8786 99.1211 15.7702 99.1211 20.6563V20.7144C99.1211 25.6295 102.586 28.4629 106.079 28.4629Z" fill="white"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M64.0917 28.5792C62.9737 28.5792 61.9347 28.3865 60.9752 28.001C60.0158 27.6154 59.1867 27.0659 58.4876 26.353C57.7887 25.6395 57.2439 24.7962 56.8526 23.8228C56.4614 22.8495 56.2658 21.7652 56.2658 20.57V20.5122C56.2658 19.4136 56.4474 18.3728 56.8106 17.3896C57.1742 16.4065 57.682 15.5485 58.3339 14.8164C58.9861 14.0838 59.7642 13.5054 60.6679 13.0812C61.5717 12.6575 62.5731 12.4453 63.6725 12.4453C64.9211 12.4453 66.0016 12.6764 66.9146 13.1393C67.8277 13.6017 68.5869 14.2235 69.1927 15.0042C69.7982 15.7849 70.2454 16.6813 70.5343 17.6932C70.8227 18.705 70.9676 19.7606 70.9676 20.8592C70.9676 21.0326 70.9629 21.2157 70.9536 21.4086C70.9439 21.6012 70.9302 21.8038 70.9116 22.0159H60.4863C60.6913 23.0182 61.1152 23.7745 61.758 24.2854C62.4005 24.7962 63.1973 25.0518 64.1477 25.0518C64.8555 25.0518 65.489 24.9264 66.0482 24.6757C66.6074 24.4252 67.1849 24.0205 67.7811 23.4614L70.2128 25.6876C69.5046 26.5936 68.6472 27.3022 67.6411 27.8128C66.6351 28.3236 65.4517 28.5792 64.0917 28.5792ZM66.6969 19.3016C66.5663 18.3187 66.231 17.5234 65.6905 16.9162C65.15 16.309 64.4328 16.0055 63.5384 16.0055C62.644 16.0055 61.9218 16.3042 61.3723 16.902C60.8227 17.4995 60.4639 18.2993 60.2962 19.3016H66.6969ZM72.3002 12.6667H76.6732V15.7273C77.0912 14.688 77.6641 13.8571 78.3918 13.2336C79.1191 12.61 80.1013 12.3266 81.3377 12.3835V16.8889H81.1194C79.7375 16.8889 78.6507 17.3232 77.8597 18.1924C77.0685 19.0613 76.6732 20.412 76.6732 22.2443V28.0476H72.3002V12.6667ZM90.0558 28.6284C88.892 28.6284 87.8133 28.4197 86.8186 28.0025C85.8242 27.5849 84.9656 27.0123 84.2429 26.2842C83.5204 25.5565 82.9528 24.7021 82.5403 23.722C82.1272 22.7416 81.9208 21.6884 81.9208 20.5625V20.5043C81.9208 19.3783 82.1272 18.3252 82.5403 17.345C82.9528 16.3645 83.5251 15.5054 84.2569 14.768C84.9889 14.0303 85.8521 13.4476 86.8469 13.0206C87.8413 12.5938 88.9296 12.3802 90.112 12.3802C91.2756 12.3802 92.3542 12.5889 93.3489 13.0061C94.3434 13.4237 95.2022 13.9963 95.9247 14.7244C96.6471 15.4521 97.2144 16.3064 97.6272 17.2866C98.0403 18.267 98.2467 19.3202 98.2467 20.4461V20.5043C98.2467 21.6303 98.0403 22.6834 97.6272 23.6635C97.2144 24.6441 96.6424 25.5029 95.9107 26.2406C95.1786 26.9783 94.3154 27.5609 93.3207 27.9877C92.3265 28.4148 91.2379 28.6284 90.0558 28.6284ZM89.966 24.8084C90.5846 24.8084 91.1327 24.6968 91.6105 24.4739C92.0884 24.2509 92.4962 23.9456 92.8335 23.5579C93.1708 23.1701 93.4285 22.7194 93.6064 22.2055C93.7848 21.6917 93.8737 21.1442 93.8737 20.5624V20.5043C93.8737 19.9228 93.7801 19.3749 93.5924 18.8611C93.4052 18.3472 93.1332 17.8918 92.7772 17.4943C92.421 17.0969 91.9994 16.782 91.5123 16.5491C91.0248 16.3166 90.491 16.2002 89.9097 16.2002C89.2914 16.2002 88.743 16.3117 88.2655 16.5347C87.7873 16.7576 87.3798 17.063 87.0425 17.4507C86.7052 17.8385 86.4474 18.2892 86.269 18.803C86.0912 19.3169 86.0023 19.8644 86.0023 20.4462V20.5043C86.0023 21.0858 86.0959 21.6337 86.2833 22.1475C86.4708 22.661 86.7428 23.1168 87.0987 23.5143C87.455 23.9116 87.8716 24.2265 88.3497 24.4594C88.8275 24.692 89.3663 24.8084 89.966 24.8084ZM45.1875 9.34921V15.0684C45.4335 14.7357 45.7029 14.4226 45.9965 14.119C46.2898 13.8201 46.6157 13.5552 46.9754 13.3189C47.3346 13.0876 47.7323 12.9047 48.1672 12.7646C48.6025 12.6297 49.0943 12.5624 49.6427 12.5624C51.289 12.5624 52.5612 13.0732 53.46 14.0947C54.3586 15.1165 54.8081 16.5235 54.8081 18.3164V28.3492H50.4351V19.7233C50.4351 18.6872 50.2106 17.9017 49.7616 17.3766C49.3127 16.8465 48.6768 16.5815 47.8533 16.5815C47.0305 16.5815 46.3801 16.8465 45.9032 17.3766C45.4259 17.9017 45.1875 18.6872 45.1875 19.7233V28.0476H40.8145V9.34921H45.1875Z" fill="white"/>
+</svg>