You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@apisix.apache.org by gu...@apache.org on 2022/08/24 09:47:44 UTC

[apisix-website] branch master updated: fix: blog og:description (#1300)

This is an automated email from the ASF dual-hosted git repository.

guoqi pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/apisix-website.git


The following commit(s) were added to refs/heads/master by this push:
     new 660ae9a188a fix: blog og:description (#1300)
660ae9a188a is described below

commit 660ae9a188a711945a998dee46d8d37dd18dce3f
Author: Young <is...@outlook.com>
AuthorDate: Wed Aug 24 17:47:40 2022 +0800

    fix: blog og:description (#1300)
---
 blog/en/docusaurus.config.js          | 36 +++++++++++++++++++++--------------
 blog/src/css/customTheme.scss         |  4 ++--
 blog/src/theme/BlogPostItem/index.tsx |  2 +-
 blog/src/theme/BlogPosts/index.tsx    |  7 +++++--
 blog/zh/docusaurus.config.js          | 36 +++++++++++++++++++++--------------
 doc/src/css/customTheme.scss          |  4 ++--
 website/src/css/customTheme.scss      |  4 ++--
 7 files changed, 56 insertions(+), 37 deletions(-)

diff --git a/blog/en/docusaurus.config.js b/blog/en/docusaurus.config.js
index a48536acc10..35b30f9cb6b 100644
--- a/blog/en/docusaurus.config.js
+++ b/blog/en/docusaurus.config.js
@@ -1,5 +1,26 @@
 const { ssrTemplate } = require('../../config/ssrTemplate');
 
+const description = 'Open Source and Cloud-Native API gateway, based on the Nginx library and etcd.';
+
+const metadatas = [
+  {
+    name: 'description',
+    content: description,
+  },
+  {
+    property: 'og:description',
+    content: description,
+  },
+  {
+    name: 'robots',
+    content: 'index,follow',
+  },
+  {
+    name: 'twitter:card',
+    content: 'summary',
+  },
+];
+
 module.exports = {
   title: 'Apache APISIX® -- Cloud-Native API Gateway',
   tagline:
@@ -79,20 +100,7 @@ module.exports = {
       respectPrefersColorScheme: false,
     },
     image: 'https://static.apiseven.com/202202/apache-apisix.png',
-    metadatas: [
-      {
-        name: 'description',
-        content: 'Open Source and Cloud-Native API gateway, based on the Nginx library and etcd.',
-      },
-      {
-        name: 'robots',
-        content: 'index,follow',
-      },
-      {
-        name: 'twitter:card',
-        content: 'summary',
-      },
-    ],
+    metadatas,
     gtag: {
       trackingID: 'GTM-K24PRPS',
     },
diff --git a/blog/src/css/customTheme.scss b/blog/src/css/customTheme.scss
index a705253eb63..47a5dac4a11 100644
--- a/blog/src/css/customTheme.scss
+++ b/blog/src/css/customTheme.scss
@@ -101,8 +101,8 @@ html[data-theme="dark"] {
   font-display: optional;
 }
 
-body {
-  overflow-x: hidden;
+body, #__docusaurus {
+  overflow-x: hidden !important;
 }
 
 body,
diff --git a/blog/src/theme/BlogPostItem/index.tsx b/blog/src/theme/BlogPostItem/index.tsx
index db99d11114b..bc18eb139dd 100644
--- a/blog/src/theme/BlogPostItem/index.tsx
+++ b/blog/src/theme/BlogPostItem/index.tsx
@@ -54,7 +54,7 @@ const BlogPostItem = (props: Props): JSX.Element => {
     date, formattedDate, permalink, tags, readingTime, title, editUrl, authors,
   } = metadata;
 
-  const image = assets.image ?? frontMatter.image ?? defaultImg;
+  const image = assets.image ?? frontMatter.image ?? withBaseUrl(defaultImg, { absolute: true });
 
   const renderPostHeader = () => {
     const TitleHeading = isBlogPostPage ? 'h1' : 'h2';
diff --git a/blog/src/theme/BlogPosts/index.tsx b/blog/src/theme/BlogPosts/index.tsx
index ca3456fd593..05985ef3b25 100644
--- a/blog/src/theme/BlogPosts/index.tsx
+++ b/blog/src/theme/BlogPosts/index.tsx
@@ -15,6 +15,7 @@ import useWindowType from '@theme/hooks/useWindowSize';
 import shuffle from 'lodash.shuffle';
 import { useLocation } from '@docusaurus/router';
 import { translate } from '@docusaurus/Translate';
+import { useBaseUrlUtils } from '@docusaurus/useBaseUrl';
 
 // pickedPosts will be auto generated
 // eslint-disable-next-line import/no-unresolved
@@ -95,8 +96,9 @@ const BlogPostItem: FC<BlogPostItemProps> = (props) => {
   } = metadata;
   const windowType = useWindowType();
   const effect = windowType === 'mobile' ? 'opacity' : 'blur';
+  const { withBaseUrl } = useBaseUrlUtils();
 
-  const image = assets?.image ?? frontMatter.image ?? defaultImg;
+  const image = assets?.image ?? frontMatter.image ?? withBaseUrl(defaultImg, { absolute: true });
 
   return (
     <article
@@ -108,10 +110,11 @@ const BlogPostItem: FC<BlogPostItemProps> = (props) => {
       <Link itemProp="url" to={permalink} aria-label={`Read more about ${title}`}>
         <LazyLoadImage
           width={605}
+          style={{ minHeight: 232 }}
           alt={title}
           {...imgPropsParse({ src: image }, Placeholder)}
           effect={effect}
-          visibleByDefault={image === defaultImg}
+          visibleByDefault={image === defaultImg || defaultImg.includes(image)}
           {...delayProps}
         />
       </Link>
diff --git a/blog/zh/docusaurus.config.js b/blog/zh/docusaurus.config.js
index 3ada0485489..aea74e05c84 100644
--- a/blog/zh/docusaurus.config.js
+++ b/blog/zh/docusaurus.config.js
@@ -1,6 +1,27 @@
 const readingTime = require('reading-time');
 const { ssrTemplate } = require('../../config/ssrTemplate');
 
+const description = 'Open Source and Cloud-Native API gateway, based on the Nginx library and etcd.';
+
+const metadatas = [
+  {
+    name: 'description',
+    content: description,
+  },
+  {
+    property: 'og:description',
+    content: description,
+  },
+  {
+    name: 'robots',
+    content: 'index,follow',
+  },
+  {
+    name: 'twitter:card',
+    content: 'summary',
+  },
+];
+
 module.exports = {
   title: 'Apache APISIX® -- Cloud-Native API Gateway',
   tagline:
@@ -81,20 +102,7 @@ module.exports = {
       respectPrefersColorScheme: false,
     },
     image: 'https://static.apiseven.com/202202/apache-apisix.png',
-    metadatas: [
-      {
-        name: 'description',
-        content: 'Open Source and Cloud-Native API gateway, based on the Nginx library and etcd.',
-      },
-      {
-        name: 'robots',
-        content: 'index,follow',
-      },
-      {
-        name: 'twitter:card',
-        content: 'summary',
-      },
-    ],
+    metadatas,
     gtag: {
       trackingID: 'GTM-K24PRPS',
     },
diff --git a/doc/src/css/customTheme.scss b/doc/src/css/customTheme.scss
index 76c1f82a56d..75e0c8b63fb 100644
--- a/doc/src/css/customTheme.scss
+++ b/doc/src/css/customTheme.scss
@@ -99,8 +99,8 @@ html[data-theme="dark"] {
   font-display: optional;
 }
 
-body {
-  overflow-x: hidden;
+body, #__docusaurus {
+  overflow-x: hidden !important;
 }
 
 body,
diff --git a/website/src/css/customTheme.scss b/website/src/css/customTheme.scss
index a705253eb63..47a5dac4a11 100644
--- a/website/src/css/customTheme.scss
+++ b/website/src/css/customTheme.scss
@@ -101,8 +101,8 @@ html[data-theme="dark"] {
   font-display: optional;
 }
 
-body {
-  overflow-x: hidden;
+body, #__docusaurus {
+  overflow-x: hidden !important;
 }
 
 body,