You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@hudi.apache.org by xu...@apache.org on 2022/05/26 12:31:39 UTC
[hudi] branch asf-site updated: [DOCS][MINOR] Added tags and authors list (#5680)
This is an automated email from the ASF dual-hosted git repository.
xushiyan pushed a commit to branch asf-site
in repository https://gitbox.apache.org/repos/asf/hudi.git
The following commit(s) were added to refs/heads/asf-site by this push:
new 8f8151b339 [DOCS][MINOR] Added tags and authors list (#5680)
8f8151b339 is described below
commit 8f8151b33934576bc5f0dfdadc62b2d717e28ad6
Author: yadav-jai <97...@users.noreply.github.com>
AuthorDate: Thu May 26 18:01:34 2022 +0530
[DOCS][MINOR] Added tags and authors list (#5680)
---
...-building-Lakehouse-Architecture-at-Halodoc.mdx | 3 +
...odal-Index-for-the-Lakehouse-in-Apache-Hudi.mdx | 3 +
website/src/css/custom.css | 7 +-
website/src/theme/BlogPostItem/index.js | 83 ++++++++++++++++++----
website/src/theme/BlogPostItem/styles.module.css | 62 ++++++++++++++++
5 files changed, 141 insertions(+), 17 deletions(-)
diff --git a/website/blog/2022-04-04-Key-Learnings-on-Using-Apache-HUDI-in-building-Lakehouse-Architecture-at-Halodoc.mdx b/website/blog/2022-04-04-Key-Learnings-on-Using-Apache-HUDI-in-building-Lakehouse-Architecture-at-Halodoc.mdx
index bcbd27d43a..e88358f3c7 100644
--- a/website/blog/2022-04-04-Key-Learnings-on-Using-Apache-HUDI-in-building-Lakehouse-Architecture-at-Halodoc.mdx
+++ b/website/blog/2022-04-04-Key-Learnings-on-Using-Apache-HUDI-in-building-Lakehouse-Architecture-at-Halodoc.mdx
@@ -4,6 +4,9 @@ authors:
- name: Jitendra Shah
category: blog
image: /assets/images/blog/2022-04-04-halodoc-lakehouse-architecture.png
+tags:
+ - Apache Hudi
+ - Halodoc
---
diff --git a/website/blog/2022-05-17-Introducing-Multi-Modal-Index-for-the-Lakehouse-in-Apache-Hudi.mdx b/website/blog/2022-05-17-Introducing-Multi-Modal-Index-for-the-Lakehouse-in-Apache-Hudi.mdx
index d007cf7a81..400f448ef5 100644
--- a/website/blog/2022-05-17-Introducing-Multi-Modal-Index-for-the-Lakehouse-in-Apache-Hudi.mdx
+++ b/website/blog/2022-05-17-Introducing-Multi-Modal-Index-for-the-Lakehouse-in-Apache-Hudi.mdx
@@ -5,6 +5,9 @@ authors:
- name: Ethan Guo
category: blog
image: /assets/images/blog/2022-05-17-multimodal-index.gif
+tags:
+ - Apache Hudi
+ - Onehouse
---
import Redirect from '@site/src/components/Redirect';
diff --git a/website/src/css/custom.css b/website/src/css/custom.css
index af1d677bc3..49be37cc07 100644
--- a/website/src/css/custom.css
+++ b/website/src/css/custom.css
@@ -210,14 +210,14 @@ footer .container {
.blog-list-page article {
display: inline-flex;
- width: 28%;
+ width: 45%;
margin: 1.2em;
vertical-align: bottom;
}
-@media(max-width:1145px){
+@media(max-width:1391px){
.blog-list-page article {
display: inline-flex;
- width: 40%;
+ width: 80%;
margin: 1.2em;
vertical-align: bottom;
}
@@ -239,6 +239,7 @@ footer .container {
.blogPostTitle_src-theme-BlogPostItem-styles-module{
height: 60px;
overflow: hidden;
+
}
h1.blogPostTitle_src-theme-BlogPostItem-styles-module{
diff --git a/website/src/theme/BlogPostItem/index.js b/website/src/theme/BlogPostItem/index.js
index 5c8954a825..40e44c35d7 100644
--- a/website/src/theme/BlogPostItem/index.js
+++ b/website/src/theme/BlogPostItem/index.js
@@ -16,7 +16,8 @@
import styles from './styles.module.css';
import TagsListInline from '@theme/TagsListInline';
import BlogPostAuthors from '@theme/BlogPostAuthors'; // Very simple pluralization: probably good enough for now
-
+ import Tag from '@theme/Tag';
+
function useReadingTimePlural() {
const {selectMessage} = usePluralForm();
return (readingTimeFloat) => {
@@ -62,6 +63,62 @@
const image = assets.image ?? frontMatter.image ?? '/assets/images/logo-big.png';
const truncatedPost = !isBlogPostPage && truncated;
const tagsExists = tags.length > 0;
+
+ const tagsList = () => {
+ return (
+ <>
+ <ul className={clsx(styles.tags, styles.authorTimeTags, 'padding--none', 'margin-left--sm')}>
+ {tags.map(({label, permalink: tagPermalink}) => (
+ <li key={tagPermalink} className={styles.tag}>
+ <Tag className={clsx(styles.greyLink)} name={label} permalink={tagPermalink} />
+ </li>
+ ))}
+ </ul>
+ </>
+ );
+}
+const AuthorsList = () => {
+
+ const authorsCount = authors.length;
+ if (authorsCount === 0) {
+ return (
+ <div className={clsx(styles.authorTimeTags, "row margin-top--sm margin-bottom--sm 'margin-vert--md'")}>
+ <time dateTime={date} itemProp="datePublished">
+ {formattedDate}
+ </time>
+ </div>
+ )
+
+ }
+
+ return (
+ <div className={clsx(styles.authorTimeTags, "row margin-top--sm margin-bottom--sm 'margin-vert--md'")}>
+ <time dateTime={date} itemProp="datePublished">
+ {formattedDate}
+ </time>
+ {authors.map((author, idx) => (
+
+ <div key={idx}>
+ <div className="avatar margin-bottom--sm">
+ {author.name && (
+ <div>
+ {authorsCount < 3 ?
+ <Link href={author.url} itemProp="url">
+ <span className={clsx(styles.authorsList)} itemProp="name">{author.name}</span>
+ </Link> : <Link href={author.url} itemProp="url">
+ <span className={clsx(styles.authorsListLong)} itemProp="name">{author.name}</span>
+ </Link>
+ }
+ </div>
+ )
+ }
+ </div>
+ </div>
+ ))}
+ </div>
+ );
+}
+
const renderPostHeader = () => {
const TitleHeading = isBlogPostPage ? 'h1' : 'h2';
@@ -89,9 +146,11 @@
{title}
</TitleHeading>
</Link>
+
)}
</TitleHeading>
- <div className={clsx(styles.blogPostData, 'margin-vert--md')}>
+ {AuthorsList()}
+ {/* <div className={clsx(styles.blogPostData, 'margin-vert--md')}>
<time dateTime={date} itemProp="datePublished">
{formattedDate}
</time>
@@ -102,10 +161,13 @@
{readingTimePlural(readingTime)}
</>
)}
- </div>
- {isBlogPostPage && (
- <BlogPostAuthors authors={authors} assets={assets} />
- )}
+ </div> */}
+
+
+
+ {(
+ <TagsListInline tags={tags} />
+ )}
</header>
);
};
@@ -130,14 +192,7 @@
className={clsx('row docusaurus-mt-lg', {
[styles.blogPostDetailsFull]: isBlogPostPage,
})}>
- {tagsExists && (
- <div
- className={clsx('col', {
- 'col--9': truncatedPost,
- })}>
- <TagsListInline tags={tags} />
- </div>
- )}
+
{isBlogPostPage && editUrl && (
<div className="col margin-top--sm">
diff --git a/website/src/theme/BlogPostItem/styles.module.css b/website/src/theme/BlogPostItem/styles.module.css
index c7312a3684..2ef1ef76d2 100644
--- a/website/src/theme/BlogPostItem/styles.module.css
+++ b/website/src/theme/BlogPostItem/styles.module.css
@@ -10,6 +10,7 @@
}
.blogPostPageTile{
font-size:3rem;
+ display: inline-flex;
}
.blogPostData {
@@ -23,3 +24,64 @@
.blog-list-page .container .row {
width: max-content;
}
+
+.authorsList {
+ font-size:0.9rem;
+ white-space: nowrap;
+ text-align:justify;
+ color: rgb(28, 30, 33);
+ column-gap: 5px;
+ margin-top:-10px;
+ margin-right:10px;
+ display:inline-flex;
+ justify-content: space-around;
+ margin-left:5px
+}
+
+.authorsListLong{
+ white-space: nowrap;
+ font-size:0.9rem;
+ color: rgb(28, 30, 33);
+ display:inline-flex;
+ justify-content: space-around;
+ margin-left:5px;
+
+}
+
+
+@media(max-width:1820px){
+ .authorsListLong{
+ font-size:0.75rem;
+ }
+}
+@media(max-width:1602px){
+ .authorsListLong{
+ font-size:0.6rem;
+ }
+}
+
+
+
+@media(max-width:1391px){
+ .authorsListLong{
+ font-size:0.9rem;
+ }
+}
+
+.authorTimeTags {
+ font-size: 0.9rem;
+ color: rgb(28, 30, 33);
+ display:flex;
+ margin-left:2px
+ }
+
+.tag {
+ margin: 0 12px 0.5rem -10px;
+ display: inline-block;
+ margin-top:-5px
+}
+
+.greyLink {
+ color: rgb(28, 30, 33);
+ text-decoration-color: rgb(28, 30, 33);
+}