You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@rocketmq.apache.org by du...@apache.org on 2022/09/03 01:13:52 UTC
[rocketmq-site] branch new-official-website updated: Update Home Page Content (#199)
This is an automated email from the ASF dual-hosted git repository.
duhengforever pushed a commit to branch new-official-website
in repository https://gitbox.apache.org/repos/asf/rocketmq-site.git
The following commit(s) were added to refs/heads/new-official-website by this push:
new 00e50179 Update Home Page Content (#199)
00e50179 is described below
commit 00e50179d9f83cb4261c61dc14e321ad618b042a
Author: Jack Tsai <ts...@outlook.com>
AuthorDate: Sat Sep 3 09:13:48 2022 +0800
Update Home Page Content (#199)
Co-authored-by: tsaitsung-han.tht <ts...@alibaba-inc.com>
---
docusaurus.config.js | 2 +-
i18n/en/code.json | 63 +++++++++++++++
src/css/custom.css | 19 ++++-
src/pages/components/Feature.js | 101 ++++++++++++++++++------
src/pages/components/Hero.js | 4 +-
src/pages/components/Hero.module.css | 7 ++
src/pages/components/Highlight.js | 110 ++++++++++++++++++++-------
src/pages/components/LogoCarousel.module.css | 1 +
src/pages/components/Section.module.css | 1 -
src/pages/components/highlight.module.css | 49 ++++++++++--
static/img/rmq-home-page.png | Bin 0 -> 470775 bytes
11 files changed, 294 insertions(+), 63 deletions(-)
diff --git a/docusaurus.config.js b/docusaurus.config.js
index 0d0bbd2a..2ee4d3e0 100644
--- a/docusaurus.config.js
+++ b/docusaurus.config.js
@@ -136,7 +136,7 @@ const darkCodeTheme = require("prism-react-renderer/themes/dracula");
theme: require('prism-react-renderer/themes/dracula'),
},
navbar: {
- title: "RocketMQ",
+ title: "Apache RocketMQ",
// hideOnScroll: true,
logo: {
alt: "My Site Logo",
diff --git a/i18n/en/code.json b/i18n/en/code.json
index adbb8b0c..96fdfb35 100644
--- a/i18n/en/code.json
+++ b/i18n/en/code.json
@@ -215,6 +215,9 @@
"message": "Tags",
"description": "The title of the tag list page"
},
+ "rmq_intro": {
+ "message": "A cloud native messaging and streaming platform, making it simple to build event-driven applications"
+ },
"快速开始": {
"message": "Quick Start"
},
@@ -256,5 +259,65 @@
},
"了解更多": {
"message": "Learn More"
+ },
+ "核心特性": {
+ "message": "Core Capabilities"
+ },
+ "云原生": {
+ "message": "Cloud Native"
+ },
+ "可分可合的存储计算架构": {
+ "message": "Dividable and composable storage computing architecture"
+ },
+ "高吞吐": {
+ "message": "High Throughput"
+ },
+ "保证万亿级的信息容量": {
+ "message": "Trillion-level message capacity guaranteed"
+ },
+ "低时延": {
+ "message": "Low Latency"
+ },
+ "大规模负载下低延迟": {
+ "message": "With low latency under massive loads"
+ },
+ "金融级": {
+ "message": "Finance Oriented"
+ },
+ "支持金融级别的事务消息": {
+ "message": "Financial grade transactional message"
+ },
+ "架构极简": {
+ "message": "Lightweight Model"
+ },
+ "灵活的分布式横向扩展部署架构": {
+ "message": "Flexible distributed scale-out deployment architecture"
+ },
+ "生态友好": {
+ "message": "Eco Friendly"
+ },
+ "涵盖电商、金融、物联网、大数据领域": {
+ "message": "Covering the fields of e-commerce, finance, Internet of Things, and big data"
+ },
+ "生态系统": {
+ "message": "Ecosystem"
+ },
+ "流处理": {
+ "message": "Stream Processing"
+ },
+ "提供轻量、高扩展、高性能和丰富功能的流计算引擎": {
+ "message": "Lightweight, high availability, high performance stream computing engine"
+ },
+ "连接器": {
+ "message": "Connect"
+ },
+ "配置化、低代码的方式进行数据集成，可与任意系统建立连接，可用于构建流式ETL，数据管道，数据湖等": {
+ "message": "Configurable and low-code way to integrate data, connect with any system, and build streaming ETL, data pipeline, data lake, etc."
+ },
+ "微服务": {
+ "message": "Microservice"
+ },
+ "丰富的消息类型支持和消息治理方式，以消息粒度负载均衡满足 Serverless 应用场景": {
+ "message": "Rich message type support and management to meet Serverless scenarios with message granularity load balancing"
}
}
\ No newline at end of file
diff --git a/src/css/custom.css b/src/css/custom.css
index 4b620b85..a2d0a8cb 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -241,6 +241,20 @@ a code {
background-color: transparent;
}
+/* .highlightSection {
+ width: 65rem;
+} */
+
+.featureAndEco {
+ text-align: center;
+}
+
+@media (min-width: 1441px) {
+ .highlightSection {
+ width: 69rem;
+ }
+}
+
.highlightSection .token-line {
font-size: 90% !important;
}
@@ -309,7 +323,7 @@ h1 {
.gradient-text {
color: transparent;
- font-size: 25vmin;
+ font-size: 17vmin;
text-align: center !important;
background: conic-gradient(
#068d9d 12%,
@@ -624,9 +638,6 @@ h1 {
border-radius: 2%;
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
-.markdown table{
-
-}
.markdown th{
min-width: 200px;
diff --git a/src/pages/components/Feature.js b/src/pages/components/Feature.js
index 67c06f2a..e820cabd 100644
--- a/src/pages/components/Feature.js
+++ b/src/pages/components/Feature.js
@@ -8,7 +8,8 @@ import styles from "./Feature.module.css";
import Translate, {translate} from '@docusaurus/Translate';
export default function Feature() {
return (
- <div>
+ <div>
+ <Highlight/>
{/* <div className={styles.mobileFeature}>
<div> */}
{/* <h3>
@@ -52,19 +53,14 @@ export default function Feature() {
</p>
</div>
</div> */}
- <div className={styles.webFeature}>
+ {/* <div className={styles.webFeature}>
<Highlight
img={
- <Lottie
- loop
- animationData={lottieJson1}
- play
- style={{ width: 400, height: 400, marginTop: -100, marginLeft:30 }}></Lottie>
}
reversed
title= {translate({
- message: "RocketMQ 作为主流的分布式消息中间件，于 2012 年开源，并在 2017 年成为 Apache 顶级项目",
+ message: "云原生",
description: 'The homepage icon alt message',
})}
@@ -83,15 +79,10 @@ export default function Feature() {
/>
<Highlight
img={
- <Lottie
- loop
- animationData={lottieJson2}
- play
- style={{ width: 400, height: 400, marginLeft:50,marginTop:-30 }}></Lottie>
}
reversed
title= {translate({
- message: "大规模负载下低延迟，保证万亿级的信息容量,适用于电商领域，金融领域，大数据领域，物联网",
+ message: "高吞吐",
description: 'The homepage icon alt message',
})}
@@ -110,16 +101,10 @@ export default function Feature() {
<Highlight
img={
- <Lottie
- loop
- animationData={lottieJson3}
- play
- style={{ width: 700, height: 700, marginTop:-230, marginLeft:-70, }}
- />
}
reversed
title={translate({
- message: "RocketMQ发布5.0版本包括：全新的消费模型，服务端负载均衡，无损弹性扩缩，可分可合的存储计算分离等",
+ message: "低时延",
description: 'The homepage icon alt message',
})}
@@ -137,7 +122,79 @@ export default function Feature() {
link={translate({ message:"RocketMQ 5.0 速览" })}
url="/version"
/>
- </div>
+
+ <Highlight
+ img={
+ }
+ reversed
+ title={translate({
+ message: "金融级",
+ description: 'The homepage icon alt message',
+ })}
+
+ text={
+ <>
+
+ <p>
+ RocketMQ Release 5.0: Major Architecture Refactoring, Storage
+ Compute Separation, Event Streaming
+ </p>
+
+ </>
+
+ }
+ link={translate({ message:"RocketMQ 5.0 速览" })}
+ url="/version"
+ />
+
+ <Highlight
+ img={
+ }
+ reversed
+ title={translate({
+ message: "架构极简",
+ description: 'The homepage icon alt message',
+ })}
+
+ text={
+ <>
+
+ <p>
+ RocketMQ Release 5.0: Major Architecture Refactoring, Storage
+ Compute Separation, Event Streaming
+ </p>
+
+ </>
+
+ }
+ link={translate({ message:"RocketMQ 5.0 速览" })}
+ url="/version"
+ />
+
+ <Highlight
+ img={
+ }
+ reversed
+ title={translate({
+ message: "生态友好",
+ description: 'The homepage icon alt message',
+ })}
+
+ text={
+ <>
+
+ <p>
+ RocketMQ Release 5.0: Major Architecture Refactoring, Storage
+ Compute Separation, Event Streaming
+ </p>
+
+ </>
+
+ }
+ link={translate({ message:"RocketMQ 5.0 速览" })}
+ url="/version"
+ />
+ </div> */}
</div>
);
diff --git a/src/pages/components/Hero.js b/src/pages/components/Hero.js
index 39b49213..00609ce4 100644
--- a/src/pages/components/Hero.js
+++ b/src/pages/components/Hero.js
@@ -8,9 +8,9 @@ export default function Hero(){
<header className={clsx("hero hero--primary", styles.heroBanner)}>
<div className="container">
- <h1 className={clsx("gradient-text",styles.herotitle)}>RocketMQ</h1>
+ <h1 className={clsx("gradient-text",styles.herotitle)}>Apache RocketMQ</h1>
<p className={clsx("hero__subtitle",styles.herosubtitle)}>
- A cloud native messaging and streaming platform, making it simple to build event-driven applications
+ <Translate id="rmq_intro">云原生消息事件流融合处理平台，帮助用户轻松构建事件驱动程序</Translate>
</p>
<div className={clsx('container',styles.github)}>
<iframe
diff --git a/src/pages/components/Hero.module.css b/src/pages/components/Hero.module.css
index 7a11992d..30e6a27d 100644
--- a/src/pages/components/Hero.module.css
+++ b/src/pages/components/Hero.module.css
@@ -4,6 +4,13 @@
position: relative;
overflow: hidden;
height: 100vh;
+ background-image: url('/img/rmq-home-page.png');
+ background-size: 100%;
+}
+
+.herosubtitle {
+ font-size: 1.5rem;
+ max-width: 600vw;
}
diff --git a/src/pages/components/Highlight.js b/src/pages/components/Highlight.js
index 406d054f..4cb49cde 100644
--- a/src/pages/components/Highlight.js
+++ b/src/pages/components/Highlight.js
@@ -2,43 +2,97 @@ import React from 'react'
import clsx from 'clsx'
import Link from '@docusaurus/Link'
import styles from './highlight.module.css'
+import Translate, {translate} from '@docusaurus/Translate';
export default function Highlight({ reversed, title, img, text, link,url,isDark }) {
- const left = <div className={clsx('col col--6', styles.featureImage, reversed ? styles.featureImageReversed : '')}>{img}</div>
- const right = (
- <div className={clsx('col col--6', styles.featureContent, reversed ? styles.featureContentReversed : '')}>
+ const content = (
+ <div className={clsx('col col--4', styles.featureContent, reversed ? styles.featureContentReversed : '')}>
+ <div className={styles.introimg}>{img}</div>
<h3 className={styles.highlighttitle}>{title}</h3>
<p className={styles.highlightsubtitle}>{text}</p>
- <Link
- to={url}
- className={clsx(
- 'button button--outline button--secondary button--lg',
- styles.getStarted,
- )}
- >{link}</Link>
</div>
)
return (
- <section className={clsx('highlightSection', isDark ? styles.darkSection + ' darkSection' : '')}>
- <div className={clsx("container",styles.container)}>
- <div className={clsx('row',styles.row)}>
- {reversed ? (
- <>
- {left}
- {right}
-
-
- </>
- ) : (
- <>
- {right}
- {left}
-
- </>
- )}
-
+ <section className={clsx('featureAndEco', isDark ? styles.darkSection + ' darkSection' : styles.featureAndEco)}>
+ <h2 className={styles.sectionTitle}>{translate({message: "核心特性"})}</h2>
+ <div className={clsx('row', styles.row)}>
+ <div className={clsx('col col--4', styles.featureContent)}>
+ <div className={styles.introimg}>
+ <svg t="1662019940104" class="icon" viewBox="0 0 1323 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="694" width="100" height="100"><path d="M295.885162 290.240781a163.251644 163.251644 0 0 0-37.529113 54.417215 165.753584 165.753584 0 0 0-13.13519 62.548522 160.749703 160.749703 0 0 0 0 18.764557l5.003882 36.278143-28.77232 17.513586a237.0589 237.0589 0 0 0-62.548523 53.79173 225.800166 225.800166 0 0 0-53.166244 147.614513A229.553077 229.553077 0 0 [...]
+ </div>
+ <h3 className={styles.highlighttitle}>{translate({ message: "云原生" })}</h3>
+ <p className={styles.highlightsubtitle}>{translate({ message: "可分可合的存储计算架构" })}</p>
+ </div>
+ <div className={clsx('col col--4', styles.featureContent)}>
+ <div className={styles.introimg}>
+ <svg t="1662019998302" class="icon" viewBox="0 0 1088 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1092" width="100" height="100"><path d="M554.026667 0c294.570667 0 533.333333 238.784 533.333333 533.333333 0 219.52-132.586667 408.042667-322.069333 489.856l-65.92-65.941333c41.706667-14.293333 80.64-34.581333 115.776-59.818667l-59.2-59.178666 60.330666-60.352 63.253334 63.274666A446.4 446.4 0 0 0 1000.021333 576h-104.64v-85.333333h104.661334a445.461 [...]
+ </div>
+ <h3 className={styles.highlighttitle}>{translate({ message: "高吞吐" })}</h3>
+ <p className={styles.highlightsubtitle}>{translate({ message: "保证万亿级的信息容量" })}</p>
+ </div>
+ <div className={clsx('col col--4', styles.featureContent)}>
+ <div className={styles.introimg}>
+ <svg t="1662020021534" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1351" width="100" height="100"><path d="M395.765333 586.570667h-171.733333c-22.421333 0-37.888-22.442667-29.909333-43.381334L364.768 95.274667A32 32 0 0 1 394.666667 74.666667h287.957333c22.72 0 38.208 23.018667 29.632 44.064l-99.36 243.882666h187.050667c27.509333 0 42.186667 32.426667 24.042666 53.098667l-458.602666 522.56c-22.293333 25.408-63.626667 [...]
+ </div>
+ <h3 className={styles.highlighttitle}>{translate({ message: "低时延" })}</h3>
+ <p className={styles.highlightsubtitle}>{translate({ message: "大规模负载下低延迟" })}</p>
+ </div>
+ </div>
+ <div className={clsx('row', styles.row)}>
+ <div className={clsx('col col--4', styles.featureContent)}>
+ <div className={styles.introimg}>
+ <svg t="1662020040095" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1602" width="100" height="100"><path d="M512 981.333333c-36.266667 0-70.4-12.8-96-38.4l-38.4-36.266666c-12.8-12.8-29.866667-21.333333-49.066667-21.333334l-53.333333-2.133333c-74.666667-2.133333-132.266667-61.866667-134.4-134.4l-2.133333-53.333333c0-19.2-8.533333-36.266667-21.333334-49.066667l-36.266666-38.4a136.533333 136.533333 0 0 1 0-189.866667l36. [...]
+ </div>
+ <h3 className={styles.highlighttitle}>{translate({ message: "金融级" })}</h3>
+ <p className={styles.highlightsubtitle}>{translate({ message: "支持金融级别的事务消息" })}</p>
+ </div>
+ <div className={clsx('col col--4', styles.featureContent)}>
+ <div className={styles.introimg}>
+ <svg t="1662020058130" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1830" width="100" height="100"><path d="M867.648 648.48l33.216 55.744a6.4 6.4 0 0 1-2.24 8.768l-398.912 237.76-398.944-237.76a6.4 6.4 0 0 1-2.24-8.768l33.216-55.744a6.4 6.4 0 0 1 8.8-2.24l359.136 214.048 359.2-214.016a6.4 6.4 0 0 1 8.768 2.24z m0-155.392l33.216 55.744a6.4 6.4 0 0 1-2.24 8.8l-398.912 237.76-398.944-237.76a6.4 6.4 0 0 1-2.24-8.8l33.216- [...]
+ </div>
+ <h3 className={styles.highlighttitle}>{translate({ message: "架构极简" })}</h3>
+ <p className={styles.highlightsubtitle}>{translate({ message: "灵活的分布式横向扩展部署架构" })}</p>
+ </div>
+ <div className={clsx('col col--4', styles.featureContent)}>
+ <div className={styles.introimg}>
+ <svg t="1662020073561" class="icon" viewBox="0 0 1025 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2045" width="100" height="100"><path d="M960.13 661.73c45.18-217.23-72.82-435.39-279.35-516.48C668.79 62.35 597.7 0.84 513.93 0.9 430.17 0.85 359.09 62.35 347.11 145.25 172.89 213.66 58.28 381.73 58.23 568.91c0 23.86 3.21 54.82 9.53 92.77-39.81 30.79-65.38 78.96-65.38 133.1 0.02 44.67 17.8 87.5 49.4 119.07a168.43 168.43 0 0 0 119.13 49.27c29.77 0 57.7 [...]
+ </div>
+ <h3 className={styles.highlighttitle}>{translate({ message: "生态友好" })}</h3>
+ <p className={styles.highlightsubtitle}>{translate({ message: "涵盖电商、金融、物联网、大数据领域" })}</p>
+ </div>
+ </div>
+ <div className={clsx('sectionSpace', styles.sectionSpace)}></div>
+ <h2 className={styles.sectionTitle}>{translate({message: "生态系统"})}</h2>
+ <div className={clsx('row', styles.row)}>
+ <div className={clsx('col col--4', styles.featureContent)}>
+ <div className={styles.introimg}>
+ <svg t="1662022118662" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3870" width="100" height="100"><path d="M879.674 544.51l-158.254-0.221c-8.534 2.287-17.305-2.776-19.588-11.307l-23.862-75.877-74.742 350.891c0 0-1.523 18.507-11.518 18.507s-26.9 0.281-26.9 0.281c-8.259 2.213-16.748-2.687-18.961-10.949l-92.741-457.648-70.305 330.634c-2.261 8.291-11.94 15.206-20.385 12.986l-24.876 0.339c-8.723 2.293-17.685-2.789-20.023- [...]
+ </div>
+ <h3 className={styles.highlighttitle}>{translate({ message: "流处理" })}</h3>
+ <p className={styles.highlightsubtitle}>{translate({ message: "提供轻量、高扩展、高性能和丰富功能的流计算引擎" })}</p>
+ </div>
+ <div className={clsx('col col--4', styles.featureContent)}>
+ <div className={styles.introimg}>
+ <svg t="1662022200501" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5708" width="100" height="100"><path d="M768.097681 184.192165A55.873452 55.873452 0 1 1 823.971133 128.318713 55.873452 55.873452 0 0 1 768.097681 184.192165zM568.062194 896.04553A55.873452 55.873452 0 1 1 512.188742 840.172079 55.873452 55.873452 0 0 1 568.062194 896.04553zM200.406351 128.318713A55.873452 55.873452 0 1 1 256.279803 184.192165 55.873 [...]
+ </div>
+ <h3 className={styles.highlighttitle}>{translate({ message: "连接器" })}</h3>
+ <p className={styles.highlightsubtitle}>{translate({ message: "配置化、低代码的方式进行数据集成，可与任意系统建立连接，可用于构建流式ETL，数据管道，数据湖等" })}</p>
+ </div>
+ <div className={clsx('col col--4', styles.featureContent)}>
+ <div className={styles.introimg}>
+ <svg t="1662022230456" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6048" width="100" height="100"><path d="M511.90226 722.428022c-9.330788 0-18.6343-3.719814-25.503397-11.079884-13.138113-14.080284-12.376648-36.145723 1.704773-49.283836l151.211045-141.104018c14.081421-13.141523 36.146859-12.376648 49.283836 1.704773 13.140386 14.079148 12.376648 36.144586-1.704772 49.282699L535.684972 713.051774a34.746673 34.746673 0 [...]
+ </div>
+ <h3 className={styles.highlighttitle}>{translate({ message: "微服务" })}</h3>
+ <p className={styles.highlightsubtitle}>{translate({ message: "丰富的消息类型支持和消息治理方式，以消息粒度负载均衡满足 Serverless 应用场景" })}</p>
</div>
+ {/* <div className={clsx('col col--3', styles.featureContent)}>
+ <div className={styles.introimg}>
+ <svg t="1662019940104" class="icon" viewBox="0 0 1323 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="694" width="100" height="100"><path d="M295.885162 290.240781a163.251644 163.251644 0 0 0-37.529113 54.417215 165.753584 165.753584 0 0 0-13.13519 62.548522 160.749703 160.749703 0 0 0 0 18.764557l5.003882 36.278143-28.77232 17.513586a237.0589 237.0589 0 0 0-62.548523 53.79173 225.800166 225.800166 0 0 0-53.166244 147.614513A229.553077 229.553077 0 0 [...]
+ </div>
+ <h3 className={styles.highlighttitle}>{translate({ message: "云原生" })}</h3>
+ <p className={styles.highlightsubtitle}>{translate({ message: "可分可合的存储计算分离架构" })}</p>
+ </div> */}
</div>
</section>
)
diff --git a/src/pages/components/LogoCarousel.module.css b/src/pages/components/LogoCarousel.module.css
index cd635563..a823de60 100644
--- a/src/pages/components/LogoCarousel.module.css
+++ b/src/pages/components/LogoCarousel.module.css
@@ -186,6 +186,7 @@ h3 {
.title {
margin: 0 auto 40px auto;
text-align: center;
+ font-size: 3rem;
}
.subtitle {
diff --git a/src/pages/components/Section.module.css b/src/pages/components/Section.module.css
index db9310d7..1030f5a4 100644
--- a/src/pages/components/Section.module.css
+++ b/src/pages/components/Section.module.css
@@ -1,7 +1,6 @@
.section {
padding: 7rem 7rem ;
width: 100%;
- background-color: var(--wdio-section-background-color);
}
.section h3 {
diff --git a/src/pages/components/highlight.module.css b/src/pages/components/highlight.module.css
index 63dea569..76466541 100644
--- a/src/pages/components/highlight.module.css
+++ b/src/pages/components/highlight.module.css
@@ -4,7 +4,8 @@
}
.featureContent {
- padding: var(--wdio-spacing-vertical) 0 var(--wdio-spacing-vertical) calc(var(--ifm-spacing-horizontal) + 20px)!important;
+ /* padding: var(--wdio-spacing-vertical) 1.535rem var(--wdio-spacing-vertical) calc(var(--ifm-spacing-horizontal) + 1.535rem)!important; */
+ /* margin: -2rem 0 -5rem 0; */
}
.featureContentReversed {
@@ -24,6 +25,15 @@
background-color: var(--wdio-dark-section-background-color);
}
+.sectionTitle {
+ font-size: 3rem;
+ text-align: center;
+}
+
+.sectionSpace {
+ margin: 5rem;
+}
+
@media (max-width: 996px) {
.featureContent {
/* padding: var(--wdio-spacing-vertical) 0 calc(var(--wdio-spacing-vertical) * 4) calc(var(--ifm-spacing-horizontal) + 20px)!important; */
@@ -47,7 +57,6 @@
.featureContentReversed {
/* padding: calc(var(--wdio-spacing-vertical) * 4+3000) calc(var(--ifm-spacing-horizontal) + 20px) var(--wdio-spacing-vertical) var(--ifm-spacing-horizontal)!important; */
text-align: center!important;
-
}
.featureImageReversed {
@@ -57,17 +66,47 @@
}
}
-
+@media (min-width: 1441px) {
+ .featureContent {
+ /* padding: var(--wdio-spacing-vertical) 0 var(--wdio-spacing-vertical) calc(var(--ifm-spacing-horizontal) + 10rem)!important; */
+ }
+ /* .highlighttitle {
+ font-weight: 600 !important;
+ text-align:center!important;
+ margin: 0rem 0rem 0rem 0rem !important;
+ }
+
+ .introimg {
+ text-align:center;
+ margin: 0rem 0rem 2rem 0rem !important;
+ }
+ .sectionTitle {
+ font-size: 3rem;
+ text-align: center;
+ margin: 0 0 0 12rem;
+ } */
+}
.highlighttitle {
font-weight: 600 !important;
text-align:center!important;
- }
+}
+
+.highlightsubtitle {
+ text-align: center;
+ margin: 1vw 0 1rem 0;
+}
+
+.introimg {
+ text-align:center;
+ margin: 0 0 2vw 0;
+}
.row{
text-align: center;
}
.container{
text-align: center;
+ width: 120%;
+ /* margin: var(--wdio-spacing-vertical) 0 15rem calc(var(--ifm-spacing-horizontal) + 1rem)!important; */
}
-
diff --git a/static/img/rmq-home-page.png b/static/img/rmq-home-page.png
new file mode 100644
index 00000000..b8ade832
Binary files /dev/null and b/static/img/rmq-home-page.png differ