Merge remote-tracking branch 'origin/upstream'

Author: mostafa-nematpour

.vitepress/config.ts

@@ -515,10 +515,6 @@ export const sidebar: ThemeConfig['sidebar'] = {
           text: 'لیست با انیمیشن',
           link: '/examples/#list-transition'
         },
-        {
-          text: 'نمونه TodoMVC',
-          link: '/examples/#todomvc'
-        }
       ]
     },
     {

.vitepress/inlined-scripts/restorePreference.js

@@ -8,6 +8,6 @@
   restore('vue-docs-prefer-composition', 'prefer-composition', true)
   restore('vue-docs-prefer-sfc', 'prefer-sfc', true)
 
-  window.__VUE_BANNER_ID__ = 'vueconf2025'
-  restore(`vue-docs-banner-${__VUE_BANNER_ID__}`, 'banner-dismissed')
+  // window.__VUE_BANNER_ID__ = ''
+  // restore(`vue-docs-banner-${__VUE_BANNER_ID__}`, 'banner-dismissed')
 })()

.vitepress/theme/components/Banner.vue

@@ -22,31 +22,16 @@ function dismiss() {
 
 <template>
   <div class="banner" v-if="open">
-    <p class="vt-banner-text">
-      <span class="vt-text-primary">
-        Vueconf.US
-      </span>
-      <span class="vt-tagline"> · The official Vue.js conf</span>
-      <span class="vt-place"> · Tampa, USA</span>
-      <span class="vt-date"> · 19-21 May 2025</span>
-      <a target="_blank" class="vt-primary-action"
-         href="https://vueconf.us/?utm_source=vuejs&utm_content=top_banner">
-        Register
-      </a>
-    </p>
+    <a target="_blank"></a>
     <button @click="dismiss">
       <VTIconPlus class="close" />
     </button>
-    <p class="vt-banner-text vt-coupon">
-      <span class="vt-text-primary">Use</span> VUEJSDOCS
-      <span class="vt-text-primary"> $200 off</span>
-    </p>
   </div>
 </template>
 
 <style>
 html:not(.banner-dismissed) {
-  --vt-banner-height: 60px;
+  --vt-banner-height: 30px;
 }
 </style>
 
@@ -65,12 +50,12 @@ html:not(.banner-dismissed) {
   font-weight: 600;
   color: #fff;
   background-color: var(--vt-c-green);
-  background: #0f172a;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-
+  background: linear-gradient(
+    90deg,
+    rgba(66, 184, 131, 1) 0%,
+    rgba(39, 179, 137, 1) 19%,
+    rgba(100, 126, 255, 1) 100%
+  );
 }
 
 .banner-dismissed .banner {
@@ -85,7 +70,7 @@ button {
   position: absolute;
   right: 0;
   top: 0;
-  padding: 10px 10px;
+  padding: 5px;
 }
 
 .close {
@@ -94,61 +79,10 @@ button {
   fill: #fff;
   transform: rotate(45deg);
 }
-
-.vt-banner-text {
-  color: #fff;
-  font-size: 16px;
-}
-
-.vt-text-primary {
-  color: #75c05e;
-}
-
-.vt-primary-action {
-  background: #75c05e;
-  color: #121c1a;
-  padding: 8px 15px;
-  border-radius: 5px;
-  font-size: 14px;
-  text-decoration: none;
-  margin: 0 10px;
-  font-weight: bold;
-}
-
-.vt-primary-action:hover {
-  text-decoration: none;
-  background: #c4d141;
-}
-
-@media (max-width: 1280px) {
-  .banner .vt-banner-text {
-    font-size: 14px;
-  }
-
-
-}
-
-@media (max-width: 780px) {
-  .vt-tagline {
-    display: none;
-  }
-  .vt-primary-action {
-    margin: 0 10px;
-    padding: 5px 5px;
-  }
-
-  .vt-time-now {
-    display: none;
-  }
-}
-
-@media (max-width: 560px) {
-  
-  .vt-place {
+/*
+@media (max-width: 720px) {
+  a > span {
     display: none;
   }
-  .vt-date {
-    display: none;
-  }
-}
+} */
 </style>

.vitepress/theme/components/ScrimbaLink.vue

@@ -0,0 +1,59 @@
+<template>
+  <div class="scrimba">
+    <a
+      :href="href"
+      target="_blank"
+      rel="sponsored noopener"
+      :title="title"
+    >
+      <slot>Watch a free interactive tutorial on Scrimba</slot>
+    </a>
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    href: { type: String, required: true },
+    title: { type: String, required: true }
+  }
+}
+</script>
+<style scoped>
+.scrimba {
+  margin: 28px 0;
+  background-color: var(--vt-c-bg-soft);
+  padding: 1em 1.25em;
+  border-radius: 2px;
+  position: relative;
+  display: flex;
+  border-radius: 8px;
+}
+.scrimba a {
+  color: var(--c-text);
+  position: relative;
+  padding-left: 36px;
+}
+.scrimba a:before {
+  content: '';
+  position: absolute;
+  display: block;
+  width: 30px;
+  height: 30px;
+  top: calc(50% - 15px);
+  left: -4px;
+  border-radius: 50%;
+  background-color: #73abfe;
+}
+.scrimba a:after {
+  content: '';
+  position: absolute;
+  display: block;
+  width: 0;
+  height: 0;
+  top: calc(50% - 5px);
+  left: 8px;
+  border-top: 5px solid transparent;
+  border-bottom: 5px solid transparent;
+  border-left: 8px solid #fff;
+}
+</style> 

.vitepress/theme/index.ts

@@ -10,14 +10,15 @@ import {
 } from './components/preferences'
 import SponsorsAside from './components/SponsorsAside.vue'
 import VueSchoolLink from './components/VueSchoolLink.vue'
-import Banner from './components/Banner.vue'
+import ScrimbaLink from './components/ScrimbaLink.vue'
+// import Banner from './components/Banner.vue'
 // import TextAd from './components/TextAd.vue'
 
 export default Object.assign({}, VPTheme, {
   Layout: () => {
     // @ts-ignore
     return h(VPTheme.Layout, null, {
-      banner: () => h(Banner),
+      // banner: () => h(Banner),
       'sidebar-top': () => h(PreferenceSwitch),
       'sidebar-bottom': () => h(SecurityUpdateBtn),
       'aside-mid': () => h(SponsorsAside)
@@ -28,6 +29,7 @@ export default Object.assign({}, VPTheme, {
     app.provide('prefer-sfc', preferSFC)
     app.provide('filter-headers', filterHeadersByPreference)
     app.component('VueSchoolLink', VueSchoolLink)
+    app.component('ScrimbaLink', ScrimbaLink)
     // app.component('TextAd', TextAd)
   }
 })

.vitepress/theme/styles/overrides.css

@@ -174,3 +174,20 @@ li {
 .vt-banner-text {
   direction: ltr;
 }
+
+.scrimba {
+  direction: rtl !important;
+}
+.scrimba a {
+  padding-left: unset !important;
+  padding-right: 36px !important;
+}
+.scrimba a::before {
+  right: -4px !important;
+  left: unset !important;
+}
+.scrimba a::after {
+  right: 6px !important;
+  left: unset !important;
+
+}

src/about/faq.md

@@ -20,7 +20,7 @@ vue ۳ آخرین نسخه‌ی major vue است که حاوی ویژگی‌ها
 
 ## آیا vue ۲ همچنان پشتیبانی می‌شود؟ {#is-vue-2-still-supported}
 
-vue۲.۷، که در جولای ۲۰۲۲ عرضه شد، آخرین نسخه‌ی minor vue ۲ است. vue ۲ حالا وارد حالت نگهداری شده است: vue ۲ دیگر ویژگی‌های جدیدی را ارائه نمی‌دهد ولی رفع باگ‌های ضروری را دریافت می‌کند و به‌روز رسانی‌های امنیتی را تا ۱۸ ماه بعد از انتشار vue ۲.۷ ارائه می‌دهد. این به این معناست که **vue ۲ در تاریخ ۱۰ دی ۱۴۰۲ به پایان عمر خود می‌رسد**.
+vue۲.۷، که در جولای ۲۰۲۲ عرضه شد، آخرین نسخه‌ی minor vue ۲ است. vue ۲ در حالت نگهداری است: vue ۲ دیگر ویژگی‌های جدیدی را ارائه نمی‌دهد ولی رفع باگ‌های ضروری را دریافت می‌کند و به‌روز رسانی‌های امنیتی را تا ۱۸ ماه بعد از انتشار vue ۲.۷ ارائه می‌دهد. این به این معناست که **vue ۲ در تاریخ ۱۰ دی ۱۴۰۲ به پایان عمر خود می‌رسد**.
 
 ما بر این باور هستیم که این زمان زیاد برای مهاجرت بیشتر اکوسیستم به vue ۳ کافی‌ست. به هر حال، ما متوجه هستیم که شاید گروه‌ها و یا پروژه‌هایی باشند که نتوانند در این مدت زمانی به vue ۳ ارتقا یابند در حالی که همچنان نیازمند امنیت و رضایت‌مندی هستند. ما در حال همکاری با حرفه‌های صنعت هستیم تا بتوانیم پشتیبانی بیشتری برای vue ۲ برای گروه‌هایی با این‌چنین نیازمندی‌هایی برقرار کنیم. اگر گروه شما می‌خواهد که بعد از ۲۰۲۳ همچنان از vue ۲ استفاده کند، در این رابطه برنامه‌ریزی کنید و راجع به [پشتیبانی طولانی مدت اضافی vue ۲](https://v2.vuejs.org/lts/) بیشتر بدانید.
 

src/api/composition-api-lifecycle.md

@@ -210,7 +210,7 @@
   در تولید، آرگومان سوم (`info`) به جای رشته با اطلاعات کامل، یک کد کوتاه شده خواهد بود. شما می‌توانید کد مربوط به map کردن رشته را در  [Production Error Code Reference](/error-reference/#runtime-errors) بیابید.
   :::
 
-  شما می‌توانید state کامپوننت را در `()errorCaptured` تغییر دهید تا یک state خطا را به کاربر نمایش دهید. با این حال، مهم است که state خطا نباید محتوای اصلی که باعث خطا شده است را رندر کند. در غیر این صورت کامپوننت در یک حلقه رندر نامتناهی قرار می‌گیرد.
+  شما می‌توانید state کامپوننت را در `()onErrorCaptured` تغییر دهید تا یک state خطا را به کاربر نمایش دهید. با این حال، مهم است که state خطا نباید محتوای اصلی که باعث خطا شده است را رندر کند. در غیر این صورت کامپوننت در یک حلقه رندر نامتناهی قرار می‌گیرد.
 
   هوک می‌تواند مقدار `false` را برگرداند تا از انتشار بیشتر خطا جلوگیری کند.
 

src/examples/src/crud/App/composition.js

@@ -15,7 +15,7 @@ export default {
     )
 
     watch(selected, (name) => {
-      ;[last.value, first.value] = name.split(', ')
+      [last.value, first.value] = name.split(', ')
     })
 
     function create() {