From dfbf1af8c428595d52e381a86c1eae75b5aefc08 Mon Sep 17 00:00:00 2001
From: Jun Shindo <46585162+jay-es@users.noreply.github.com>
Date: Thu, 18 Apr 2024 19:30:02 +0900
Subject: [PATCH] docs: SF meetup promo

---
 .vitepress/theme/components/AsideSponsors.vue | 36 ++++++-------------
 index.md                                      | 15 ++++++--
 2 files changed, 23 insertions(+), 28 deletions(-)

diff --git a/.vitepress/theme/components/AsideSponsors.vue b/.vitepress/theme/components/AsideSponsors.vue
index 92eef401..bd1baf1b 100644
--- a/.vitepress/theme/components/AsideSponsors.vue
+++ b/.vitepress/theme/components/AsideSponsors.vue
@@ -18,23 +18,18 @@ const sponsors = computed(() => {
 </script>
 
 <template>
-  <a
-    class="viteconf"
-    href="https://viteconf.org/23/replay?utm=vite-sidebar"
-    target="_blank"
-  >
-    <img width="22" height="22" src="/viteconf.svg" />
+  <a class="vite-event" href="https://lu.ma/vite" target="_blank">
+    <img width="22" height="22" src="/logo.svg" />
     <span>
-      <p class="extra-info">Beyond Fast</p>
-      <p class="heading">ViteConf 2023</p>
-      <p class="extra-info">Watch the replay!</p>
+      <p class="extra-info">May 9th, 2024</p>
+      <p class="heading">Vite Meetup SF</p>
     </span>
   </a>
   <VPDocAsideSponsors v-if="data" :data="sponsors" />
 </template>
 
 <style>
-.viteconf {
+.vite-event {
   margin-top: 1rem;
   margin-bottom: 1rem;
   border-radius: 14px;
@@ -53,35 +48,26 @@ const sponsors = computed(() => {
   border: 2px solid var(--vp-c-bg-alt);
   transition: border-color 0.5s;
 }
-.viteconf:hover {
+.vite-event:hover {
   border: 2px solid var(--vp-c-brand-light);
 }
-.viteconf img {
+.vite-event img {
   transition: transform 0.5s;
   transform: scale(1.25);
 }
-.viteconf:hover img {
+.vite-event:hover img {
   transform: scale(1.75);
 }
-.viteconf .heading {
-  background-image: linear-gradient(
-    120deg,
-    #b047ff 16%,
-    var(--vp-c-brand-lighter),
-    var(--vp-c-brand-lighter)
-  );
+.vite-event .heading {
+  background-image: var(--vp-home-hero-name-background);
   background-clip: text;
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
 }
-.viteconf .extra-info {
+.vite-event .extra-info {
   color: var(--vp-c-text-1);
-  opacity: 0;
   font-size: 0.7rem;
   padding-left: 0.1rem;
   transition: opacity 0.5s;
 }
-.viteconf:hover .extra-info {
-  opacity: 0.9;
-}
 </style>
diff --git a/index.md b/index.md
index dd707883..4d5bd35d 100644
--- a/index.md
+++ b/index.md
@@ -21,9 +21,9 @@ hero:
     - theme: alt
       text: GitHub で見る
       link: https://github.com/vitejs/vite
-    - theme: brand
-      text: 🎉 ViteConf 23!
-      link: https://viteconf.org/23/replay?utm=vite-homepage
+    - theme: alt
+      text: 📅 Vite Meetup SF
+      link: https://lu.ma/vite
 
 features:
   - icon: 💡
@@ -45,3 +45,12 @@ features:
     title: 完全に型定義がされている API
     details: 完全な TypeScript の型定義を備えた柔軟なプログラミング志向の API です。
 ---
+
+<style>
+.VPButton.alt[href="https://lu.ma/vite"] {
+  background: var(--vp-home-hero-name-background);
+  border: none;
+  padding: 1px 21px;
+  color: #fff !important;
+}
+</style>