Refactor website structure (#2860)

Author: AlbumenJ

.github/workflows/build_and_deploy_history.yml

@@ -23,7 +23,7 @@ jobs:
       - name: Setup Hugo
         uses: peaceiris/actions-hugo@v2
         with:
-          hugo-version: 'latest'
+          hugo-version: '0.121.2'
           extended: true
       - name: Build
         env:

.github/workflows/link_check.yml

@@ -25,7 +25,7 @@ jobs:
       - name: Setup Hugo
         uses: peaceiris/actions-hugo@v2
         with:
-          hugo-version: '0.122.0'
+          hugo-version: '0.121.2'
           extended: true
       - name: Build
         env:

.htmltest.yml

@@ -1,6 +1,6 @@
 DirectoryPath: public
-IgnoreAltMissing: false
-IgnoreAltEmpty: false
+IgnoreAltMissing: true
+IgnoreAltEmpty: true
 IgnoreInternalEmptyHash: true
 IgnoreDirectoryMissingTrailingSlash: true
 IgnoreCanonicalBrokenLinks: false

assets/scss/_base.scss

@@ -149,7 +149,7 @@ main {
 // HERO
 .header-hero {
   background-image: url(/imgs/texture.png);
-  background-color: $blue;
+  background-color: $gray;
   text-align: center;
   padding-left: 0;
   padding-right: 0;
@@ -181,7 +181,7 @@ main {
 }
 
 .header-hero {
-  background-color: $blue;
+  background-color: $gray;
 
   h5 {
     margin: 20px 0;

assets/scss/_buttons.scss

@@ -0,0 +1,15 @@
+// Buttons
+
+@if $enable-rounded {
+  .btn {
+    border-radius: 1rem;
+
+    &-lg {
+      border-radius: 2rem;
+    }
+
+    &-sm {
+      border-radius: 1rem;
+    }
+  }
+}

assets/scss/_case-studies.scss

@@ -66,7 +66,7 @@ h2 {
 }
 
 body footer {
-  background-color: #585858 !important;
+  background-color: #F4F4F6 !important;
 }
 
 .section1 {

assets/scss/_custom.scss

@@ -3,6 +3,7 @@ $announcement-size-adjustment: 8px;
 /* GLOBAL */
 .td-main {
   .row {
+    --bs-gutter-x: 4rem;
     margin: 0;
   }
 
@@ -24,6 +25,10 @@ $announcement-size-adjustment: 8px;
   .ui-widget-content a {
     color: $blue;
   }
+
+  a {
+    text-decoration: none;
+  }
 }
 
 .footer-margin-0{
@@ -106,17 +111,18 @@ body.td-404 main .error-details {
 .td-navbar {
   position: fixed !important;
   width: 100%;
-  padding-bottom: 1rem !important;
+  height: 40px;
   background: transparent !important;
   transition: 0.3s;
+  padding: 1rem;
 
   .navbar-brand {
-    position: absolute;
-    width: 45px;
-    height: 44px;
+    // position: absolute;
+    width: 96px;
+    height: 20px;
     background-repeat: no-repeat;
     background-size: contain;
-    background-image: url("/imgs/favicon.png");
+    background-image: url("/imgs/nav_logo2.png");
   }
 
   #hamburger {
@@ -135,9 +141,11 @@ body.td-404 main .error-details {
   }
 }
 
+
+
 .td-navbar-nav-scroll {
   overflow: visible !important;
-  display: none;
+  // display: none;
 
   .navbar-nav {
     overflow: visible !important;
@@ -146,6 +154,7 @@ body.td-404 main .error-details {
     flex-direction: row;
     flex-wrap: wrap;
     justify-content: space-evenly;
+    padding-bottom: 0px!important;
 
     .nav-item {
       position: relative;
@@ -154,7 +163,7 @@ body.td-404 main .error-details {
       .active::after {
         position: absolute;
         width: 100%;
-        height: 2px;
+        height: 0px;
         content: "";
         bottom: -4px;
         left: 0;
@@ -163,21 +172,22 @@ body.td-404 main .error-details {
     }
   }
 
+
   @media only screen and (min-width: 768px) {
-    display: block;
-    margin-top: 3.5rem !important;
+    display: flex!important;
+    align-items: center!important;
   }
 
-  @media only screen and (min-width: 1075px) {
-    margin-top: 1rem !important;
-  }
 }
 
+
 // Flip-Nav
 .flip-nav .td-navbar {
-  background-color: white !important;
-  // box-shadow: 0 1px 2px $medium-grey;
-  border: 1px solid #ddd;
+  // background-color: #EBECEF !important;
+  .dropdown {
+    min-width: 0px;
+
+  }
   .navbar-nav {
     .nav-item {
       &.show .nav-link,
@@ -194,6 +204,24 @@ body.td-404 main .error-details {
           color: $medium-grey;
         }
       }
+      .nav-link {
+        font-size: 14px;
+        font-weight: 400;
+        color: #597371;
+        &:hover {
+          color:#49615f;
+        }
+      }
+    }
+    .nav-item-line ::after{
+      content:"";
+      position: absolute;
+      top: 50%;
+      transform: translateY(-50%);
+      left: 100%;
+      width: 1px;
+      height: 16px;
+      background-color: #8FA8A6;
     }
   }
 
@@ -659,7 +687,7 @@ body.td-documentation {
     margin-bottom: 0px;
 
     // for padding-top see _size.scss
-    padding-bottom: calc(max(2em, 2rem));
+    padding-bottom: calc(max(1em, 1rem));
 
     max-width: calc(min(1200px - 8em, 80vw));
   }
@@ -687,7 +715,7 @@ body.td-documentation {
 @media (min-width: 992px) {
   #announcement aside { // more specific
     .announcement-main {
-      padding-top: calc(max(8em, 8rem));
+      padding-top: calc(max(6em, 6rem));
     }
   }
 }
@@ -860,10 +888,27 @@ div.alert > em.javascript-required {
   margin: calc(max(4em, ( 8vh + 4em ) / 2)) 0 0.25em 0;
 }
 
-#td-sidebar-menu{
-  overflow: auto;
-  white-space: nowrap;
+#docsearch {
+  .DocSearch-Button {
+    background: #DDDEE4;
+    padding: 0 10px !important;
+  }
+  .DocSearch-Button-Container{
+    width: 15px;
+  }
+  .DocSearch-Button-Placeholder{
+    font-size: 12px;
+    display: none;
+  }
+  .DocSearch-Button-Keys{
+    display: none;
+  }
+}
+
+#language .btn-language {
+    width: 156px;
+    height: 40px;
+    margin-right: 16px;
+    margin-bottom: 12px;
+    border-radius: 24px;
 }
-.td-page-meta a{
-  display: inline-block !important;
-}

assets/scss/_skin.scss

@@ -3,3 +3,4 @@ $light-grey: #f7f7f7;
 $dark-grey: #303030;
 $medium-grey: #4c4c4c;
 $white: #ffffff;
+$gray: #EBECEF;

assets/scss/main.scss

@@ -1,24 +1,26 @@
-@import "support/functions";
+@import "../vendor/bootstrap/scss/functions";
+@import "_variables_forward";
 @import "variables_project";
 @import "variables";
 @import "support/mixins";
 
 @import "../vendor/bootstrap/scss/bootstrap";
+@import "support/bootstrap_vers_test";
 
 @import "../vendor/Font-Awesome/scss/fontawesome.scss";
 @import "../vendor/Font-Awesome/scss/solid.scss";
 @import "../vendor/Font-Awesome/scss/brands.scss";
 
 @import "support/utilities";
 @import "colors";
+@import "table";
 @import "boxes";
 @import "blog";
 @import "code";
 @import "nav";
 @import "sidebar-tree";
 @import "sidebar-toc";
 @import "buttons";
-@import "breadcrumb";
 @import "alerts";
 @import "content";
 @import "search";
@@ -27,6 +29,9 @@
 @import "section-index";
 @import "pageinfo";
 @import "taxonomy";
+@import "drawio";
+@import "shortcodes";
+@import "swagger";
 
 @if $td-enable-google-fonts {
     @import url("/css/open-sans.css");
@@ -98,4 +103,4 @@ footer {
 @import "tablet";
 @import "desktop";
 @import "reset";
-@import "size";
+@import "size";

cn_config.toml

@@ -55,7 +55,7 @@ defaultContentLanguageInSubdir = false
 [languages.en]
 title = "Apache Dubbo"
 description = "Apache Dubbo Official Website"
-languageName = "English"
+languageName = "EN"
 contentDir = "content/en"
 # Weight used for sorting.
 weight = 1
@@ -208,6 +208,26 @@ url = "mailto:dev-subscribe@dubbo.apache.org"
 icon = "fa fa-envelope"
 desc = "Discuss development issues around the project"
 
+
+[params.ecosystem]
+navLabel = "生态"
+  [params.ecosystem.navOptions]
+    [[params.ecosystem.navOptions.items]]
+        name = "Launch A Project"
+        url = "/zh-cn/blog"
+    [[params.ecosystem.navOptions.items]]
+        name = "可视化控制台"
+        url = "/zh-cn/download"
+    [[params.ecosystem.navOptions.items]]
+        name = "商城系统"
+        url = "/option-3"
+    [[params.ecosystem.navOptions.items]]
+        name = "Benchmark"
+        url = "/option-3"
+    [[params.ecosystem.navOptions.items]]
+        name = "Proxyless Mesh"
+        url = "/option-3"
+
 [sitemap]
 changefreq = "monthly"
 filename = "sitemap.xml"