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 e1ffc8ead6f [DOCS] Site updates (#11128)
e1ffc8ead6f is described below
commit e1ffc8ead6fa7cadc6f625d1ec4ec7e183dbf77b
Author: Bhavani Sudha Saktheeswaran <[email protected]>
AuthorDate: Tue Apr 30 06:14:39 2024 -0700
[DOCS] Site updates (#11128)
Summary:
- Add a permanent Github star reminder at the top of the page instead of a
pop up
- Edit top nav so resizing does not impact sizing and spacing of top nav
- Add Events Banner
- Add a new user in powered-by page
---
README.md | 12 ++++++++
website/docusaurus.config.js | 6 ++--
website/src/components/EventFeature/index.js | 32 ++++++++++++----------
.../src/components/EventFeature/styles.module.css | 27 ++++++++++++++----
website/src/css/custom.css | 8 +++++-
website/src/pages/index.js | 2 +-
website/src/pages/powered-by.md | 3 ++
website/src/theme/Navbar/index.js | 6 ++--
website/src/theme/Navbar/styles.module.css | 32 ++++++++++++++++++++++
9 files changed, 100 insertions(+), 28 deletions(-)
diff --git a/README.md b/README.md
index 2f27fc68189..e50b0c6ffff 100644
--- a/README.md
+++ b/README.md
@@ -157,6 +157,18 @@ Example: When you change any file in
`versioned_docs/version-0.7.0/`, it will on
## Configs
Configs can be automatically updated by following these steps documented at
../hudi-utils/README.md
+## Events Banner
+
+### How to disable Events banner in the main page - https://hudi.apache.org/?
+Remove ``<Events />`` row from the file `website/src/pages/index.js`. This
should be found below `<HomepageHeader />`. Note commenting out has no effect.
This entry has to
+be removed to turn off the banner.
+
+### How to add a new Events banner ?
+The code for displaying an event banner is already in place. Steps to add:
+1. Edit file `website/src/components/EventFeature/index.js` . Edit Event
description, date and note if it is an
+`In Person Event` or a `Linkedin Live Event`.
+2. Add `<Event />` entry after `<HomepageHeader />` (if not already present)
in the file `website/src/pages/index.js`
+
## Talks
When adding a talk, please follow these guidelines.
diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js
index 196e3bb2d74..4efe48a6fbc 100644
--- a/website/docusaurus.config.js
+++ b/website/docusaurus.config.js
@@ -448,9 +448,9 @@ module.exports = {
prismPath: require.resolve('./src/theme/prism-include-languages.js'),
},
announcementBar: {
- id: 'announcementBar-1', // Increment on change
- content:
- '⭐️ If you like Apache Hudi, give it a star on <a target="_blank"
rel="noopener noreferrer" href="https://github.com/apache/hudi">GitHub</a>! ⭐',
+ "id": "announcementBar-2",
+ "content": "⭐️ If you like <b>Apache Hudi</b>, give it a star on <a
target=\"_blank\" rel=\"noopener noreferrer\"
href=\"https://github.com/apache/hudi\"><b>GitHub!<svg
xmlns='http://www.w3.org/2000/svg\\' width='16' height='16' fill='currentColor'
class='bi bi-github' viewBox='0 -2 16 16'><path d='M8 0C3.58 0 0 3.58 0 8c0
3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38
0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01
1.08.58 1.23 [...]
+ "isCloseable": false
},
colorMode: {
defaultMode: 'light',
diff --git a/website/src/components/EventFeature/index.js
b/website/src/components/EventFeature/index.js
index 0764e59b0ec..b24d999374c 100644
--- a/website/src/components/EventFeature/index.js
+++ b/website/src/components/EventFeature/index.js
@@ -6,21 +6,25 @@ import Microphone from "./Icons/microphone.svg";
const Events = () => {
return (
- <section className="featurebanner">
+ <section>
<div className={styles.banner}>
- <div className="container">
- <div className={styles.bannercontent}>
- <h3> Upcoming Event: Build and Secure AWS Hudi Lakes
with AWS Glue & AWS Lake Formations</h3>
- <p><span
className={styles.sideMicrophone}><Microphone/></span>
- LinkedIn Live Event | <span
className={styles.sideCalendar}><Calendar/></span>
- January 25</p>
- </div>
- </div>
- <LinkButton class={styles.registerbutton} type="secondary"
to="https://www.linkedin.com/company/apache-hudi/events/?viewAsMember=true">
- Join Now
- </LinkButton>
- </div>
- </section>
+ <div className="container">
+ <div className={styles.flexContainer}>
+ <div className={styles.bannercontent}>
+ <h3> Upcoming Event: Bengaluru Apache Hudi Meetup
hosted @ Navi Technologies</h3>
+ <p className={styles.flexParagraph}><span
className={styles.sideMicrophone}><Microphone/></span>
+ In Person Event | <span
className={styles.sideCalendar}><Calendar/></span>
+ May 11</p>
+ </div>
+ <div className={styles.joinButton}>
+ <LinkButton class={styles.registerbutton}
type="secondary"
to="https://www.linkedin.com/posts/apache-hudi_dataengineering-softwareengineering-activity-7190732754311913475-t19y/">
+ Join Now
+ </LinkButton>
+ </div>
+ </div>
+ </div>
+ </div>
+ </section>
);
}
export default Events;
diff --git a/website/src/components/EventFeature/styles.module.css
b/website/src/components/EventFeature/styles.module.css
index ff6deb0db25..90dadb585d2 100644
--- a/website/src/components/EventFeature/styles.module.css
+++ b/website/src/components/EventFeature/styles.module.css
@@ -4,29 +4,44 @@
justify-content: space-between;
background: linear-gradient(to right, #2F93EF 0%, #1E5FBD 100%);
color: white;
- padding-right: 230px;
- padding-left: 210px;
padding-bottom: 0px;
- padding-top: 10px;
+ padding-top: 20px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}
.sideMicrophone {
margin-right: 10px;
+ height: 20px;
}
.sideCalendar {
margin-right: 10px;
- margin-left: 10px;
+ margin-left: 5px;
+ height: 20px;
}
+
+.joinButton {
+ margin-bottom: 20px;
+}
+
.registerbutton {
background-color: #ffffff;
color: #074D86;
border: none;
- padding: 10px 30px;
+ padding: 10px 30px;
border-radius: 10px;
cursor: pointer;
text-transform: uppercase;
font-weight: bold;
display: inline-block;
text-align: center;
- min-width: 280px
+ min-width: 140px
+}
+.flexContainer {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+}
+
+.flexParagraph {
+ display: flex;
+ align-items: center;
}
\ No newline at end of file
diff --git a/website/src/css/custom.css b/website/src/css/custom.css
index 9b5e0c3474d..efcebf3fe82 100644
--- a/website/src/css/custom.css
+++ b/website/src/css/custom.css
@@ -382,7 +382,7 @@ h1.blogPostTitle_src-theme-BlogPostItem-styles-module{
}
}
-@media(max-width:1320px){
+@media(max-width:1350px){
.navbar__item {
display: none !important;
}
@@ -393,3 +393,9 @@ h1.blogPostTitle_src-theme-BlogPostItem-styles-module{
+div[class^="announcementBar"][role="banner"] {
+ color: white;
+ background-color: #29557A;
+ padding: 5px 0;
+ height: auto;
+}
\ No newline at end of file
diff --git a/website/src/pages/index.js b/website/src/pages/index.js
index 8de055c9a9a..355993b5706 100644
--- a/website/src/pages/index.js
+++ b/website/src/pages/index.js
@@ -30,7 +30,7 @@ export default function Home() {
>
<NewReleaseMessage />
<HomepageHeader />
- {/* <Events /> */}
+ <Events />
<main>
<DataLake />
<HomepageFeatures />
diff --git a/website/src/pages/powered-by.md b/website/src/pages/powered-by.md
index 455d68d84f6..7e63f5a846b 100644
--- a/website/src/pages/powered-by.md
+++ b/website/src/pages/powered-by.md
@@ -78,6 +78,9 @@ Apache Hudi is integrated in the digital platform to meet the
real-time update n
### Logical Clocks
[Hopsworks 1.x
series](https://www.logicalclocks.com/blog/introducing-the-hopsworks-1-x-series)
supports Apache Hudi feature groups, to enable upserts and time travel.
+### Navi
+[Navi](https://navi.com/), one of India’s fastest-growing financial service
providers, offers Personal & Home Loans, UPI, Insurance, Mutual Funds, and
Gold. Powered by Apache Hudi, our Data Platform tech stack has been enhanced to
enable near-real-time data ingestion, driving AI/ML initiatives and critical
business decisions to create exceptional customer experiences.
+
### NerdWallet
[NerdWallet uses AWS and Apache Hudi to build a serverless, real-time
analytics
platform](https://aws.amazon.com/blogs/big-data/how-nerdwallet-uses-aws-and-apache-hudi-to-build-a-serverless-real-time-analytics-platform/)
diff --git a/website/src/theme/Navbar/index.js
b/website/src/theme/Navbar/index.js
index ea5d2c05637..1677fe1af5e 100644
--- a/website/src/theme/Navbar/index.js
+++ b/website/src/theme/Navbar/index.js
@@ -68,7 +68,7 @@ function useWindowSize() {
function useMobileSidebar() {
const { width } = useWindowSize(); // Mobile sidebar not visible on
hydration: can avoid SSR rendering
- const breakPoint = 1320;
+ const breakPoint = 1350;
const shouldRender = width <= breakPoint; // || windowSize === 'ssr';
const [shown, setShown] = useState(false); // Close mobile sidebar on
navigation pop
@@ -248,7 +248,7 @@ function Navbar() {
[styles.navbarHideable]: hideOnScroll,
[styles.navbarHidden]: hideOnScroll && !isNavbarVisible,
})}>
- <div className="navbar__inner">
+ <div className={clsx("navbar__inner", [styles.navbarInnerStyle])}>
<img referrerpolicy="no-referrer-when-downgrade"
src="https://static.scarf.sh/a.png?x-pxid=8f594acf-9b77-44fb-9475-3e82ead1910c"
width={0} height={0} alt=""/>
<img referrerpolicy="no-referrer-when-downgrade"
src="https://analytics.apache.org/matomo.php?idsite=47&rec=1" width={0}
height={0} alt="" />
<div className="navbar__items">
@@ -269,7 +269,7 @@ function Navbar() {
titleClassName="navbar__title"
/>
{leftItems.map((item, i) => (
- <NavbarItem {...item} key={i} />
+ <NavbarItem {...item} className={styles.navbarFontSize} key={i} />
))}
</div>
<div className="navbar__items navbar__items--right">
diff --git a/website/src/theme/Navbar/styles.module.css
b/website/src/theme/Navbar/styles.module.css
index de52b2e80fb..b8e737844cc 100644
--- a/website/src/theme/Navbar/styles.module.css
+++ b/website/src/theme/Navbar/styles.module.css
@@ -36,3 +36,35 @@ Hide toggle in small viewports
.navbarLogo {
max-width: 148px;
}
+
+@media(max-width:1820px){
+ .navbarFontSize{
+ font-size:90% !important;
+ }
+}
+@media(max-width:1602px){
+ .navbarFontSize{
+ font-size:80% !important;
+ }
+}
+@media(max-width:1440px){
+ .navbarFontSize{
+ font-size:70% !important;
+ }
+}
+@media(min-width: 1300px) {
+ div[class^="navbar__item"] {
+ font-size: 100% !important;
+ }
+}
+@media(max-width: 1350px) {
+ .navbarWrapper {
+ padding: 0 !important;
+ }
+ .navbarInnerStyle {
+ margin: 0 auto;
+ max-width: var(--ifm-container-width) !important;
+ padding: 0 var(--ifm-spacing-horizontal) !important;
+ width: 100%;
+ }
+}
\ No newline at end of file