Merge branch 'feature/redesign'

Author: EvilBeaver

frontend/.vitepress/config.mts

@@ -11,7 +11,19 @@ export default defineConfig({
   description: "OneScript. Официальная документация, релизы, справка, синтакс-помощник",
 
   head: [
-    ['link', { rel: 'icon', href: '/favicon.ico' }]
+    ['link', { rel: 'icon', href: '/favicon.ico' }],
+    // Preload critical resources for faster initial load
+    ['link', { rel: 'preload', href: '/2-min.png', as: 'image' }],
+    ['link', { rel: 'preload', href: '/logo-white-small.png', as: 'image' }],
+    ['link', { rel: 'preconnect', href: 'https://fonts.googleapis.com' }],
+    // Inline script to set home page class immediately to prevent navbar flash
+    ['script', {}, `
+      (function() {
+        if (window.location.pathname === '/' || window.location.pathname === '/index.html') {
+          document.documentElement.classList.add('is-home-page');
+        }
+      })();
+    `],
   ],
 
   lang: 'ru-RU',
@@ -72,7 +84,7 @@ export default defineConfig({
         {
           text: 'Быстрое вхождение',
           items: [
-            { text: 'Что такое 1Скрипт?', link: '/learn/' },
+            { text: 'Что такое OneScript?', link: '/learn/' },
             { text: 'Установка', link: '/learn/install' },
             { text: 'Среда разработки', link: '/learn/dev-tools' },
             { text: 'Урок: Информация о системе', link: '/learn/tutorial-info'},
@@ -164,6 +176,11 @@ export default defineConfig({
     darkModeSwitchTitle: 'Переключить на тёмную тему',
     sidebarMenuLabel: 'Меню',
     returnToTopLabel: 'Вернуться к началу',
+    
+    footer: {
+      message: 'All trademarks, logos, and brand names are the property of their respective owners. Use of these names, trademarks, and brands does not imply endorsement.',
+      copyright: `© ${new Date().getFullYear()} OneScript. All rights reserved.`
+    },
   },
 
   async transformPageData(pageData, _) {

frontend/.vitepress/theme/Layout.vue

@@ -1,11 +1,12 @@
 <script setup>
 import DefaultTheme from "vitepress/theme";
-import { onMounted } from "vue";
-import { useRouter } from "vitepress";
+import { onMounted, onUnmounted, watch } from "vue";
+import { useRouter, useData } from "vitepress";
 import mediumZoom from "medium-zoom";
 
 const { Layout } = DefaultTheme;
 const router = useRouter();
+const { frontmatter } = useData();
 
 // Setup medium zoom with the desired options
 const setupMediumZoom = () => {
@@ -14,11 +15,79 @@ const setupMediumZoom = () => {
   });
 };
 
+// Mark html with home class for CSS to work immediately
+const updateHomeClass = () => {
+  const isHome = frontmatter.value.layout === 'home';
+  if (isHome) {
+    document.documentElement.classList.add('is-home-page');
+    document.body.classList.add('is-home-page');
+  } else {
+    document.documentElement.classList.remove('is-home-page');
+    document.body.classList.remove('is-home-page');
+  }
+};
+
+// Handle navbar scroll state on home page with gradual opacity
+const handleScroll = () => {
+  const navbar = document.querySelector('.VPNavBar');
+  if (!navbar) return;
+  
+  const isHome = frontmatter.value.layout === 'home';
+  if (!isHome) {
+    navbar.classList.remove('scrolled');
+    navbar.style.removeProperty('--navbar-opacity');
+    return;
+  }
+  
+  const scrollY = window.scrollY;
+  const fadeStart = window.innerHeight * 0.25;
+  const fadeEnd = window.innerHeight * 0.85;
+  
+  if (scrollY <= fadeStart) {
+    navbar.style.setProperty('--navbar-opacity', '0');
+    navbar.classList.remove('scrolled');
+  } else if (scrollY >= fadeEnd) {
+    navbar.style.setProperty('--navbar-opacity', '1');
+    navbar.classList.add('scrolled');
+  } else {
+    const progress = (scrollY - fadeStart) / (fadeEnd - fadeStart);
+    navbar.style.setProperty('--navbar-opacity', progress.toString());
+    navbar.classList.remove('scrolled');
+  }
+};
+
+const setupNavbarTransparency = () => {
+  updateHomeClass();
+  handleScroll();
+  window.addEventListener('scroll', handleScroll);
+};
+
+const cleanupNavbarTransparency = () => {
+  window.removeEventListener('scroll', handleScroll);
+  document.documentElement.classList.remove('is-home-page');
+  document.body.classList.remove('is-home-page');
+  const navbar = document.querySelector('.VPNavBar');
+  if (navbar) {
+    navbar.classList.remove('scrolled');
+  }
+};
+
 // Apply medium zoom on load
-onMounted(setupMediumZoom);
+onMounted(() => {
+  setupMediumZoom();
+  setupNavbarTransparency();
+});
 
-// Subscribe to route changes to re-apply medium zoom effect
-router.onAfterRouteChanged = setupMediumZoom;
+onUnmounted(() => {
+  cleanupNavbarTransparency();
+});
+
+// Subscribe to route changes
+router.onAfterRouteChanged = () => {
+  setupMediumZoom();
+  updateHomeClass();
+  setTimeout(handleScroll, 50);
+};
 </script>
 
 <template>