fix: document seo optimization (#4372)

labring · Dec 1, 2023 · cb35d78 · cb35d78
1 parent bf5379f
commit cb35d78
Show file tree

Hide file tree

Showing 14 changed files with 53 additions and 70 deletions.
diff --git a/docs/website/docusaurus.config.js b/docs/website/docusaurus.config.js
@@ -195,7 +195,7 @@ const config = {
       additionalLanguages: ["docker"],
       theme: require("prism-react-renderer/themes/github"),
       darkTheme: require("./src/theme/dracula"),
-    },
+    }
   },
   scripts: [
     {

diff --git a/docs/website/src/pages/components/Capability/index.phone.scss b/docs/website/src/pages/components/Capability/index.phone.scss
@@ -7,7 +7,7 @@
       height: 12px;
     }
 
-    h1 {
+    h2 {
       font-size: 20px;
     }
 

diff --git a/docs/website/src/pages/components/Capability/index.scss b/docs/website/src/pages/components/Capability/index.scss
@@ -13,7 +13,7 @@
     margin-top: 140px;
   }
 
-  h1 {
+  h2 {
     margin-top: 28px;
     margin-bottom: 0;
     color: #fff;
@@ -48,8 +48,7 @@
     border-radius: 8px;
     border: 1px solid rgba(255, 255, 255, 0.05);
     background: #c1c1c1;
-    box-shadow: 0px 1.1666667461395264px 2.3333334922790527px 0px
-      rgba(0, 0, 0, 0.2);
+    box-shadow: 0px 1.1666667461395264px 2.3333334922790527px 0px rgba(0, 0, 0, 0.2);
   }
 
   a {
@@ -92,7 +91,7 @@
       margin-left: 50px;
       margin-top: 50px;
       text-align: left;
-      h4{
+      h4 {
         height: 112px;
       }
     }

diff --git a/docs/website/src/pages/components/Capability/index.tsx b/docs/website/src/pages/components/Capability/index.tsx
@@ -58,7 +58,7 @@ const Capability = ({ isPc }: { isPc: boolean }) => {
         <div className="comet-icon">
           <CometIcon />
         </div>
-        <h1>{i18nObj.capability}</h1>
+        <h2>{i18nObj.capability}</h2>
         <div className="app-management">
           <div className="app-management-text">
             <div className="logo">
@@ -120,7 +120,7 @@ const Capability = ({ isPc }: { isPc: boolean }) => {
       <div className="comet-icon">
         <CometIcon />
       </div>
-      <h1>{i18nObj.capability}</h1>
+      <h2>{i18nObj.capability}</h2>
       <div className="app-management animate__fadeIn" data-wow-duration="1s">
         <div className="app-management-text">
           <div className="logo">

diff --git a/docs/website/src/pages/components/Header/index.phone.scss b/docs/website/src/pages/components/Header/index.phone.scss
@@ -26,13 +26,13 @@
       flex-direction: column;
       padding: 0 16px;
       z-index: 9;
-      h1 {
+      .sealos-main-header {
         margin-top: 30px;
         font-size: 20px;
         font-weight: 600;
       }
 
-      h2 {
+      h1 {
         font-weight: 600;
         font-size: 30px;
         @media screen and (max-width: 385px) {

diff --git a/docs/website/src/pages/components/Header/index.scss b/docs/website/src/pages/components/Header/index.scss
@@ -135,7 +135,7 @@
     max-width: 1120px;
     margin: 0 auto;
     z-index: 9;
-    h1 {
+    .sealos-main-header {
       margin-top: 100px;
       margin-bottom: 0;
       font-size: 48px;
@@ -147,7 +147,7 @@
         color: rgba(185, 221, 255, 1);
       }
     }
-    h2 {
+    h1 {
       margin-bottom: 0;
       color: rgba(255, 255, 255, 1);
       text-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
@@ -191,7 +191,7 @@
 @media screen and (max-width: 1220px) {
   .home-header {
     main {
-      h2 {
+      h1 {
         font-size: 80px;
       }
     }

diff --git a/docs/website/src/pages/components/Header/index.tsx b/docs/website/src/pages/components/Header/index.tsx
@@ -120,19 +120,19 @@ const HomeHeader = ({ isPc }: { isPc: boolean }) => {
         </nav>
         <main>
           {currentLocale === 'en' ? (
-            <h1>
+            <div className="sealos-main-header">
               <span className="txt-title">Kubernetes&nbsp;</span>
               <span className="txt-aid">as the kernel</span>
-            </h1>
+            </div>
           ) : (
-            <h1>
+            <div className="sealos-main-header">
               <span className="txt-aid">以&nbsp;</span>
               <span className="txt-title">Kubernetes&nbsp;</span>
               <span className="txt-aid">为内核</span>
-            </h1>
+            </div>
           )}
 
-          <h2>{i18nObj.cloudOS}</h2>
+          <h1>{i18nObj.cloudOS}</h1>
 
           {currentLocale === 'en' ? (
             <h3>
@@ -219,19 +219,19 @@ const HomeHeader = ({ isPc }: { isPc: boolean }) => {
       </nav>
       <main>
         {currentLocale === 'en' ? (
-          <h1>
+          <div className="sealos-main-header">
             <span className="txt-title">Kubernetes&nbsp;</span>
             <span className="txt-aid">as the kernel</span>
-          </h1>
+          </div>
         ) : (
-          <h1>
+          <div className="sealos-main-header">
             <span className="txt-aid">以&nbsp;</span>
             <span className="txt-title">Kubernetes&nbsp;</span>
             <span className="txt-aid">为内核</span>
-          </h1>
+          </div>
         )}
 
-        <h2>{i18nObj.cloudOS}</h2>
+        <h1>{i18nObj.cloudOS}</h1>
 
         {currentLocale === 'en' ? (
           <h3>

diff --git a/docs/website/src/pages/components/Introduce/index.phone.scss b/docs/website/src/pages/components/Introduce/index.phone.scss
@@ -16,7 +16,7 @@
       height: 12px;
     }
 
-    h1 {
+    .sealos-main-whysealos {
       margin-top: 12px;
       margin-bottom: 0;
       color: #fff;

diff --git a/docs/website/src/pages/components/Introduce/index.scss b/docs/website/src/pages/components/Introduce/index.scss
@@ -12,7 +12,7 @@
     margin-top: 140px;
   }
 
-  h1 {
+  .sealos-main-whysealos {
     margin-top: 28px;
     margin-bottom: 0;
     color: #fff;

diff --git a/docs/website/src/pages/components/Introduce/index.tsx b/docs/website/src/pages/components/Introduce/index.tsx
@@ -53,7 +53,7 @@ const Introduce = ({ isPc }: { isPc: boolean }) => {
         <div className="comet-icon">
           <CometIcon />
         </div>
-        <h1>{i18nObj.whySealos}</h1>
+        <div className="sealos-main-whysealos">{i18nObj.whySealos}</div>
         <div className="features">
           <div className="route">
             <div className="icon1">
@@ -100,7 +100,7 @@ const Introduce = ({ isPc }: { isPc: boolean }) => {
       <div className="comet-icon">
         <CometIcon />
       </div>
-      <h1>{i18nObj.whySealos}</h1>
+      <div className="sealos-main-whysealos">{i18nObj.whySealos}</div>
       <div className="features">
         <div className="left animate__fadeIn" data-wow-duration="1s">
           <div className="tag tag1">{i18nObj.lowerCosts}</div>

diff --git a/docs/website/src/pages/components/UserBy/index.tsx b/docs/website/src/pages/components/UserBy/index.tsx
@@ -1,7 +1,7 @@
-import Translate from '@docusaurus/Translate'
-import React from 'react'
-import CometIcon from '../Comet'
-import './index.scss'
+import Translate from '@docusaurus/Translate';
+import React from 'react';
+import CometIcon from '../Comet';
+import './index.scss';
 
 const HomeUserBy = ({ isPc }: { isPc: boolean }) => {
   if (!isPc) {
@@ -10,9 +10,9 @@ const HomeUserBy = ({ isPc }: { isPc: boolean }) => {
         <div className="comet-icon">
           <CometIcon />
         </div>
-        <h1 className="user-by-title">
+        <div className="user-by-title">
           <Translate>Who is Using Sealos</Translate>
-        </h1>
+        </div>
         {/* 品牌商滚动 */}
         <div className="scroll-brand">
           <div className="img-content">
@@ -27,17 +27,17 @@ const HomeUserBy = ({ isPc }: { isPc: boolean }) => {
           </div>
         </div>
       </div>
-    )
+    );
   }
 
   return (
     <div id="Client" className="home-user-by">
       <div className="comet-icon">
         <CometIcon />
       </div>
-      <h1 className="user-by-title">
+      <div className="user-by-title">
         <Translate>Who is Using Sealos</Translate>
-      </h1>
+      </div>
       {/* 品牌商滚动 */}
       <div className="scroll-brand">
         <div className="img-content">
@@ -52,7 +52,7 @@ const HomeUserBy = ({ isPc }: { isPc: boolean }) => {
         </div>
       </div>
     </div>
-  )
-}
+  );
+};
 
-export default React.memo(HomeUserBy)
+export default React.memo(HomeUserBy);
diff --git a/docs/website/src/pages/self-hosting/advantage/index.tsx b/docs/website/src/pages/self-hosting/advantage/index.tsx
@@ -57,19 +57,19 @@ function Akkordion({ items }) {
               </Disclosure.Button>
               <Transition
                 show={open}
-                className="overflow-hidden"
-                enter="transition transition-[max-height] duration-200 ease-in"
-                enterFrom="transform max-h-0"
-                enterTo="transform max-h-screen"
-                leave="transition transition-[max-height] duration-400 ease-out"
-                leaveFrom="transform max-h-screen"
-                leaveTo="transform max-h-0"
-                // enter="transition duration-200 ease-out"
-                // enterFrom="transform scale-95 opacity-0"
-                // enterTo="transform scale-100 opacity-100"
-                // leave="transition duration-200 ease-out"
-                // leaveFrom="transform scale-100 opacity-100"
-                // leaveTo="transform scale-95 opacity-0"
+                // className="overflow-hidden"
+                // enter="transition transition-[max-height] duration-200 ease-in"
+                // enterFrom="transform max-h-0"
+                // enterTo="transform max-h-screen"
+                // leave="transition transition-[max-height] duration-400 ease-out"
+                // leaveFrom="transform max-h-screen"
+                // leaveTo="transform max-h-0"
+                enter="transition duration-200 ease-out"
+                enterFrom="transform scale-95 opacity-0"
+                enterTo="transform scale-100 opacity-100"
+                leave="transition duration-200 ease-out"
+                leaveFrom="transform scale-100 opacity-100"
+                leaveTo="transform scale-95 opacity-0"
               >
                 <Disclosure.Panel
                   static

diff --git a/docs/website/src/pages/self-hosting/header/index.scss b/docs/website/src/pages/self-hosting/header/index.scss
@@ -132,18 +132,7 @@
     max-width: 1120px;
     margin: 0 auto;
     z-index: 9;
-    h1 {
-      margin-top: 100px;
-      margin-bottom: 0;
-      font-size: 48px;
-      font-weight: 600;
-      .txt-title {
-        color: #379fff;
-      }
-      .txt-aid {
-        color: rgba(185, 221, 255, 1);
-      }
-    }
+
     h2 {
       margin-bottom: 0;
       color: rgba(255, 255, 255, 1);
@@ -216,11 +205,6 @@
       flex-direction: column;
       padding: 0 16px;
       z-index: 9;
-      h1 {
-        margin-top: 30px;
-        font-size: 20px;
-        font-weight: 600;
-      }
 
       h2 {
         font-weight: 600;

diff --git a/docs/website/static/global.js b/docs/website/static/global.js
@@ -5,7 +5,7 @@ document.addEventListener("DOMContentLoaded", function () {
     if (event.target.tagName === "A") {
       const href = event.target.getAttribute("href")
       const currentHostname = window.location.hostname
-      const targetHostname = (currentHostname === "sealos.io") ? "sealos.io" : "sealos.top"
+      const targetHostname = "sealos.io"
 
       if (href.includes("sealos.io") || href.includes("sealos.top") || href.includes("sealos.run")) {
         event.preventDefault()
-Original file line number
+Diff line change
@@ Expand Up / @@ -7,7 +7,7 @@ @@
           height: 12px;
         }
-        h1 {
+        h2 {
           font-size: 20px;
         }
@@ Expand Down @@