add slack and stack overflow on the footer (#357)
* add slack and stack overflow on the footer
* changed the code format
* Update site.js
Co-authored-by: dailidong <dailidong66@gmail.com>
diff --git a/img/slack-selected.png b/img/slack-selected.png
new file mode 100644
index 0000000..740390d
--- /dev/null
+++ b/img/slack-selected.png
Binary files differ
diff --git a/img/slack.png b/img/slack.png
new file mode 100644
index 0000000..c601cc2
--- /dev/null
+++ b/img/slack.png
Binary files differ
diff --git a/img/stackoverflow-selected.png b/img/stackoverflow-selected.png
new file mode 100644
index 0000000..62405d7
--- /dev/null
+++ b/img/stackoverflow-selected.png
Binary files differ
diff --git a/img/stackoverflow.png b/img/stackoverflow.png
new file mode 100644
index 0000000..094024f
--- /dev/null
+++ b/img/stackoverflow.png
Binary files differ
diff --git a/site_config/home.jsx b/site_config/home.jsx
index 6df7dce..6bb7120 100644
--- a/site_config/home.jsx
+++ b/site_config/home.jsx
@@ -91,6 +91,31 @@
},
],
},
+ userreview: {
+ title: '用户评论',
+ list: [
+ {
+ img: '/img/chinaunicom-logo.png',
+ review: '提供了一个优秀的调度产品，节省了近百人月的开发成本。友好的社区沟通环境，提供了强大的后援支持。',
+ name: '—— 联通数字科技 架构师 尹正军',
+ },
+ {
+ img: '/img/qianxin-logo.svg',
+ review: '小海豚已经是我们数据项目开发管理的利器，非常好用，希望保持初心，越来越好。',
+ name: '—— 奇安信 数据总监 姜旭',
+ },
+ {
+ img: '/img/changan-logo.png',
+ review: '从EasyScheduler到DolphinScheduler，有幸见证了小海豚的成长 —— 越来越简单，越来越易用。DS已作为数据平台的基础组件服务于整个长安汽车车联网的离线开发场景，非常稳定。希望DS社区生态越来越完善，每个用户都能得益于社区，贡献于社区!',
+ name: '—— 长安汽车 数据平台工程师 黄立',
+ },
+ {
+ img: '/img/xdf-logo.jpeg',
+ review: '祝贺DolphinScheduler成为Apache顶级项目。DolphinScheduler有强大的调度功能，方便快捷的可视化工具，可信赖的高可靠性，成为了行业同类工具中的领先者，是国产大数据软件之光。新东方通过使用DolphinScheduler，提高了任务调度效率，更加方便地进行系统性能分析，数据产出时间缩短。感谢DolphinScheduler!',
+ name: '—— 新东方教育科技集团技术VP（前当当网CTO）李海涛',
+ },
+ ],
+ },
},
'en-us': {
brand: {
@@ -191,5 +216,30 @@
},
],
},
+ userreview: {
+ title: 'User Comments',
+ list: [
+ {
+ img: '/img/chinaunicom-logo.png',
+ review: 'Apache DolphinScheduler is an excellent data workflow open-source product, Its community is very friendly and gives us strong support. We save the cost of hundreds of human months by using DolphinScheduler!',
+ name: '—— Software Architect at China Unicom -- Zhengjun Yin',
+ },
+ {
+ img: '/img/qianxin-logo.svg',
+ review: 'DolphinScheduler is already a good tool for our data project development management, it works very well, hope to keep the original intention and get better and better~',
+ name: '—— Data Director of 360 --Jiang Xu',
+ },
+ {
+ img: '/img/changan-logo.png',
+ review: 'From EasyScheduler to DolphinScheduler, we have the honor to witness the growth of Little Dolphin - it is getting simpler and easier to use. DS has served the whole Changan Auto Telematics offline development scenario as the basic component of data platform and is very stable. I hope the DS community ecology is getting better and better, and every user can benefit from and contribute to the community!',
+ name: '—— Changan Automobile Data Platform Engineer -- Huang Li',
+ },
+ {
+ img: '/img/xdf-logo.jpeg',
+ review: 'Congratulations to DolphinScheduler for becoming an Apache top project. With powerful scheduling features, convenient and fast visualization tools, and reliable high reliability, DolphinScheduler has become a leader among similar tools in the industry, and is the light of big data software in China.By using DolphinScheduler, New Oriental has improved the efficiency of task scheduling, more convenient system performance analysis, and shorter data output time. Thanks to DolphinScheduler!',
+ name: '—— Technology VP of New Oriental Education & Technology Group (former CTO of Dangdang.com) -- Haitao Li',
+ },
+ ],
+ },
},
};
diff --git a/site_config/site.js b/site_config/site.js
index 8592ffa..b9323ed 100644
--- a/site_config/site.js
+++ b/site_config/site.js
@@ -177,22 +177,34 @@
},
],
},
- contact:{
- title :'About us',
- content:'Do you need feedback? Please contact us through the following ways.',
- list:[
+ contact: {
+ title: 'About us',
+ content: 'Do you need feedback? Please contact us through the following ways.',
+ list: [
{
- name:'Email List',
- img1:'/img/emailgray.png',
- img2:'/img/emailblue.png',
- link:'/en-us/community/development/subscribe.html',
+ name: 'Email List',
+ img1: '/img/emailgray.png',
+ img2: '/img/emailblue.png',
+ link: '/en-us/community/development/subscribe.html',
},
{
- name:'@ApacheDolphinScheduler',
- img1:'/img/twittergray.png',
- img2:'/img/twitterblue.png',
- link:'https://twitter.com/dolphinschedule',
- }
+ name: 'Twitter',
+ img1: '/img/twittergray.png',
+ img2: '/img/twitterblue.png',
+ link: 'https://twitter.com/dolphinschedule',
+ },
+ {
+ name: 'Stack Overflow',
+ img1: '/img/stackoverflow.png',
+ img2: '/img/stackoverflow-selected.png',
+ link: 'https://stackoverflow.com/questions/tagged/apache-dolphinscheduler',
+ },
+ {
+ name: 'Slack',
+ img1: '/img/slack.png',
+ img2: '/img/slack-selected.png',
+ link: 'https://join.slack.com/t/asf-dolphinscheduler/shared_invite/zt-omtdhuio-_JISsxYhiVsltmC5h38yfw',
+ },
],
},
copyright: 'Copyright © 2019-2021 The Apache Software Foundation. Apache DolphinScheduler, DolphinScheduler, and its feather logo are trademarks of The Apache Software Foundation.',
@@ -368,22 +380,34 @@
},
],
},
- contact:{
- title :'联系我们',
- content:'有问题需要反馈？请通过以下方式联系我们。',
- list:[
+ contact: {
+ title: '联系我们',
+ content: '有问题需要反馈？请通过以下方式联系我们。',
+ list: [
{
- name:'邮件列表',
- img1:'/img/emailgray.png',
- img2:'/img/emailblue.png',
- link:'/zh-cn/community/development/subscribe.html',
+ name: '邮件列表',
+ img1: '/img/emailgray.png',
+ img2: '/img/emailblue.png',
+ link: '/zh-cn/community/development/subscribe.html',
},
{
- name:'@ApacheDolphinScheduler',
- img1:'/img/twittergray.png',
- img2:'/img/twitterblue.png',
- link:'https://twitter.com/dolphinschedule',
- }
+ name: 'Twitter',
+ img1: '/img/twittergray.png',
+ img2: '/img/twitterblue.png',
+ link: 'https://twitter.com/dolphinschedule',
+ },
+ {
+ name: 'Stack Overflow',
+ img1: '/img/stackoverflow.png',
+ img2: '/img/stackoverflow-selected.png',
+ link: 'https://stackoverflow.com/questions/tagged/apache-dolphinscheduler',
+ },
+ {
+ name: 'Slack',
+ img1: '/img/slack.png',
+ img2: '/img/slack-selected.png',
+ link: 'https://join.slack.com/t/asf-dolphinscheduler/shared_invite/zt-omtdhuio-_JISsxYhiVsltmC5h38yfw',
+ },
],
},
copyright: 'Copyright © 2019-2021 The Apache Software Foundation. Apache DolphinScheduler, DolphinScheduler, and its feather logo are trademarks of The Apache Software Foundation.',
diff --git a/src/components/footer/index.jsx b/src/components/footer/index.jsx
index 61befc1..b21d14f 100644
--- a/src/components/footer/index.jsx
+++ b/src/components/footer/index.jsx
@@ -5,13 +5,13 @@
import './index.scss';
const propTypes = {
- logo: PropTypes.string.isRequired, // logo地址
+ // logo: PropTypes.string.isRequired, // logo地址
language: PropTypes.oneOf(['zh-cn', 'en-us']),
};
class Footer extends React.Component {
render() {
- const { logo, language } = this.props;
+ const { language } = this.props;
const dataSource = siteConfig[language];
return (
<footer className="footer-container">
@@ -25,10 +25,11 @@
{
dataSource.contact.list.map((contact, i) => (
<li key={i}>
- <img className="img-base" src={contact.img1}></img>
- <img className="img-change" src={contact.img2}></img>
+ <img className="img-base" src={contact.img1} />
+ <img className="img-change" src={contact.img2} />
<a href={getLink(contact.link)}>
- <p>{contact.name}</p></a>
+ <p>{contact.name}</p>
+ </a>
</li>
))
}
@@ -40,25 +41,25 @@
<ul>
{
dataSource.documentation.list.map((docu, i) => (
- <li key={i}>
+ <li key={i}>
<a href={getLink(docu.link)}>
- <p>{docu.text}</p></a>
+ <p>{docu.text}</p>
+ </a>
</li>
))
}
</ul>
</div>
- <div>
-
- </div>
+ <div />
<div className="asf-container">
<h4>{dataSource.asf.title}</h4>
<ul>
{
dataSource.asf.list.map((asf, i) => (
- <li key={i}>
+ <li key={i}>
<a href={getLink(asf.link)}>
- <p>{asf.text}</p></a>
+ <p>{asf.text}</p>
+ </a>
</li>
))
}
diff --git a/src/components/footer/index.scss b/src/components/footer/index.scss
index a9dc8dc..fc42a12 100644
--- a/src/components/footer/index.scss
+++ b/src/components/footer/index.scss
@@ -39,11 +39,14 @@
.contact-container{
ul{
display: flex;
- justify-content: space-between;
margin-top:80px;
margin-bottom: 40px;
- margin-left: 200px;
- margin-right: 200px;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+ align-content: center;
+ // margin-left: 200px;
+ // margin-right: 200px;
li {
list-style: none;
display:flex;
diff --git a/src/pages/home/index.jsx b/src/pages/home/index.jsx
index 80262c8..c55f23f 100644
--- a/src/pages/home/index.jsx
+++ b/src/pages/home/index.jsx
@@ -49,6 +49,35 @@
});
});
}
+
+ addClick = (length) => {
+ if (this.state.index < length - 1) {
+ this.setState({
+ ...this.state,
+ index: this.state.index + 1,
+ });
+ } else {
+ this.setState({
+ ...this.state,
+ index: 0,
+ });
+ }
+ }
+
+ minusClick =(length) => {
+ if (this.state.index > 0) {
+ this.setState({
+ ...this.state,
+ index: this.state.index - 1,
+ });
+ } else {
+ this.setState({
+ ...this.state,
+ index: length - 1,
+ });
+ }
+ }
+
render() {
const { starCount, forkCount } = this.state;
@@ -129,6 +158,28 @@
))}
</Slider>
</section>
+ <section className="review-section">
+ <h3>{dataSource.userreview.title}</h3>
+ <div className="button-section" id="buttonleft">
+ <button onClick={() => this.minusClick(dataSource.userreview.list.length)}><img src="/img/gotoleft.png" /></button>
+ <div className="overflow-section">
+ <ul>
+ {
+ dataSource.userreview.list.map((ureview, i) => (
+ <li key={i}>
+ <img src={ureview.img} />
+ <div className="name-section">
+ <p className="pr">{ureview.review}</p>
+ <p className="pn">{ureview.name}</p>
+ </div>
+ </li>
+ ))[index]
+ }
+ </ul>
+ </div>
+ <button onClick={() => this.addClick(dataSource.userreview.list.length)}><img src="/img/gotoright.png" /></button>
+ </div>
+ </section>
<Footer logo="/img/ds_gray.svg" language={language} />
</div>
);
