This is an automated email from the ASF dual-hosted git repository.
yao pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-kyuubi-website.git
The following commit(s) were added to refs/heads/master by this push:
new 2660a7c refactor homePage (#42)
2660a7c is described below
commit 2660a7c953f942bedfcd1f715d109f93eb710621
Author: jeffery <[email protected]>
AuthorDate: Mon Mar 7 16:53:31 2022 +0800
refactor homePage (#42)
* rebuild homePage
* feature: modify homePage style
* style: modify homePage desc font size
* style: rename footer img
Co-authored-by: jipengfei01 <[email protected]>
---
.hugo_build.lock | 0
config.toml | 2 +-
data/homePage.json | 83 ++++
layouts/index.html | 170 +++++---
layouts/partials/footer.html | 52 ++-
layouts/partials/header.html | 78 +++-
layouts/partials/navbar.html | 61 ++-
static/activeShare.png | Bin 0 -> 535 bytes
static/css/homePage.css | 619 +++++++++++++++++++++++++++++
static/css/kyuubi.css | 617 +++++++++++++++++++++++++---
static/homePageImg/bannerBg_m.png | Bin 0 -> 989568 bytes
static/homePageImg/community1.png | Bin 0 -> 3993 bytes
static/homePageImg/community2.png | Bin 0 -> 7000 bytes
static/homePageImg/community3.png | Bin 0 -> 8027 bytes
static/homePageImg/ecosA1.png | Bin 0 -> 8688 bytes
static/homePageImg/ecosA2.png | Bin 0 -> 4441 bytes
static/homePageImg/ecosA3.png | Bin 0 -> 7271 bytes
static/homePageImg/ecosA4.png | Bin 0 -> 13124 bytes
static/homePageImg/ecosA5.png | Bin 0 -> 11132 bytes
static/homePageImg/ecosA6.png | Bin 0 -> 5663 bytes
static/homePageImg/ecosB1.png | Bin 0 -> 17721 bytes
static/homePageImg/ecosB2.png | Bin 0 -> 9745 bytes
static/homePageImg/ecosB3.png | Bin 0 -> 7326 bytes
static/homePageImg/ecosB4.png | Bin 0 -> 8571 bytes
static/homePageImg/ecosC1.png | Bin 0 -> 22185 bytes
static/homePageImg/ecosC2.png | Bin 0 -> 4622 bytes
static/homePageImg/ecosC3.png | Bin 0 -> 10178 bytes
static/homePageImg/ecosC4.png | Bin 0 -> 6474 bytes
static/homePageImg/ecosC5.png | Bin 0 -> 5520 bytes
static/homePageImg/ecosC6.png | Bin 0 -> 7745 bytes
static/homePageImg/indexBanner.png | Bin 0 -> 483696 bytes
static/homePageImg/kf1.png | Bin 0 -> 9476 bytes
static/homePageImg/kf2.png | Bin 0 -> 6558 bytes
static/homePageImg/kf3.png | Bin 0 -> 8224 bytes
static/incubator_feather_egg_gray_logo.png | Bin 0 -> 23021 bytes
static/share.png | Bin 0 -> 508 bytes
36 files changed, 1501 insertions(+), 181 deletions(-)
diff --git a/.hugo_build.lock b/.hugo_build.lock
new file mode 100644
index 0000000..e69de29
diff --git a/config.toml b/config.toml
index 8739ef4..5ad764d 100644
--- a/config.toml
+++ b/config.toml
@@ -13,7 +13,7 @@
#
baseurl = "https://kyuubi.apache.org";
title = "Apache Kyuubi"
-copyright = "Copyright © 2021-{year} The Apache Software Foundation"
+copyright = "Copyright © 2021-{year}"
enableEmoji = true
footnotereturnlinkcontents = "<sup>^</sup>"
uglyurls = true
diff --git a/data/homePage.json b/data/homePage.json
new file mode 100644
index 0000000..8786e3b
--- /dev/null
+++ b/data/homePage.json
@@ -0,0 +1,83 @@
+{
+ "keyFeatures": [
+ {
+ "img": "homePageImg/kf1.png",
+ "title": "Multi tenancy",
+ "desc": "Kyuubi provides end-to-end multi-tenancy for resource acquiring
and data/metadata access with a unified authentication/authorization layer."
+ },
+ {
+ "img": "homePageImg/kf2.png",
+ "title": "High Availability",
+ "desc": "Kyuubi supports a load balancing on ZooKeeper, which provides
an enterprise-grade high availability, as well as an unlimited high client
concurrency."
+ },
+ {
+ "img": "homePageImg/kf3.png",
+ "title": "Multiple Workloads",
+ "desc": "Kyuubi can easily support multiple disparate workloads with one
single platform, one copy of data, and one SQL interface."
+ }
+ ],
+ "ecosystem": [
+ {
+ "title": "Access from anywhere",
+ "list": [
+ "homePageImg/ecosA1.png",
+ "homePageImg/ecosA2.png",
+ "homePageImg/ecosA3.png",
+ "homePageImg/ecosA4.png",
+ "homePageImg/ecosA5.png",
+ "homePageImg/ecosA6.png"
+ ]
+ },
+ {
+ "title": "Deploy at any scale",
+ "list": [
+ "homePageImg/ecosB1.png",
+ "homePageImg/ecosB2.png",
+ "homePageImg/ecosB3.png",
+ "homePageImg/ecosB4.png"
+ ]
+ },
+ {
+ "title": "Connect to any data",
+ "list": [
+ "homePageImg/ecosC1.png",
+ "homePageImg/ecosC2.png",
+ "homePageImg/ecosC3.png",
+ "homePageImg/ecosC4.png",
+ "homePageImg/ecosC5.png",
+ "homePageImg/ecosC6.png"
+ ]
+ }
+ ],
+ "useCases":[
+ {
+ "title":"Interactive Analytics",
+ "desc":"Kyuubi is an advanced, enterprise-grade, rapid analytics
platform for interactive visual analytics on big data, with modern computing
frameworks under the hood, i.e., Apache Spark, Apache Flink, Trino, e.t.c. With
JDBC/ODBC, users can access kyuubi and run queries efficiently through SQL
directly or generated by BI tools. Kyuubi caches background engine instances at
the user level for better computing resource sharing and quick response. They
parallelize queries on large am [...]
+ },
+ {
+ "title":"Batch Processing",
+ "desc":"Kyuubi provides a SQL interface that you are already comfortable
with for batch processing, typically large Extract, Transform, Load (ETL)
processes. Both kyuubi and its engines are storage independent and work with
numerous data sources, and Kyuubi isolates background engine instances at the
connection level for better computing resource isolation and stability."
+ },
+ {
+ "title":"Data Lake & Lakehouses",
+ "desc":"Kyuubi supports query all traditional data warehouses, delta
lakes, like Apache Hive/HDFS, or modern lakehouses, like Apache Iceberg,
Apache Hudi, and Delta Lake, together. Kyuubi also provides multi catalog meta
APIs that present a sizeable centralized picture of all your data in front of
you and help you innovate faster. The ability to query disparate data sources
in a single entrance with the ANSI standard SQL syntaxes greatly simplifies
data insight while providing aut [...]
+ }
+ ],
+ "community": [
+ {
+ "img": "homePageImg/community1.png",
+ "title": "Mailing list",
+ "href": "https://kyuubi.apache.org/mailing_lists.html";
+ },
+ {
+ "img": "homePageImg/community2.png",
+ "title": "Source code",
+ "href": "https://github.com/apache/incubator-kyuubi";
+ },
+ {
+ "img": "homePageImg/community3.png",
+ "title": "How to contribute",
+ "href": "https://kyuubi.apache.org/contributing.html";
+ }
+ ]
+}
\ No newline at end of file
diff --git a/layouts/index.html b/layouts/index.html
index 9c8a302..ef17c60 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -11,66 +11,130 @@
See the License for the specific language governing permissions and
limitations under the License. See accompanying LICENSE file.
-->
+<!-- <link rel="stylesheet" href="{{ "css/index.css" | relURL }}"> -->
+
{{partial "header.html" .}}
- <!-- Main jumbotron for a primary marketing message or call to action -->
- <div class="jumbotron">
- <div class="container">
- {{range where .Site.Pages "Title" "Description"}}
- {{.Content}}
- {{end}}
- <p>
- <a class="btn btn-success btn-lg" href="docs/latest/quick_start"
role="button">Getting started »</a>
- <a class="btn btn-warning btn-lg" href="releases.html"
role="button">Download »</a>
- <a class="btn btn-primary btn-lg" href="docs/latest"
role="button">Learn more »</a>
+<!-- Main jumbotron for a primary marketing message or call to action -->
+<div class="contentContainer">
+ <div>
+ <div class="contentBlock">
+ <img class="bannerBg" src="{{ "homePageImg/indexBanner.png" | relURL}}"
/>
+ <div class="bannerContent">
+ <p class="bannerTitle">Serverless SQL on Lakehouse</p>
+ <p class="bannerDesc">
+ Apache Kyuubi (Incubating), a distributed and multi-tenant gateway
to provide serverless SQL on lakehouses.
</p>
+ <div class="bannerBtnContainer">
+ <a class="bannerBtn"
href="https://kyuubi.apache.org/docs/stable/quick_start";>Getting started »</a>
+ <a class="bannerBtn"
href="https://github.com/apache/incubator-kyuubi";>GitHub »</a>
+ </div>
</div>
</div>
-
-
- <div class="container">
- <!-- Example row of columns -->
- <div class="row">
-
- <div class="col-md-4">
-
- <div class="col-md-12">
- <p><a class="acevent" data-format="wide" data-mode="light"
data-width="320"></a></p>
+ </div>
+ <!-- <div>
+ <div class="contentBlock">
+ <div class="blockTitle">
+ <span>Usage</span>
+ <div class="blockTitleLine"></div>
+ </div>
+ <div class="listContainer">
+ {{range .Site.Data.homePage.usage}}
+ <div class="usageItem">
+ <img class="usageItemImg" src="{{.img | relURL}}" >
+ <p class="itemTitle">{{.title}}</p>
+ <p class="itemDesc">{{.desc}}</p>
</div>
-
- <div class="col-md-12">
- <h2>Latest news</h2>
- {{range first 5 (where (where .Site.Pages "Section" "in" (slice
"news")) ".Name" "not in" (slice "News" "Releases")) }}
- <div class="panel panel-default">
- <div class="panel-heading clearfix"><a class="pull-left"
href={{.RelPermalink}}>{{.Title}}</a> <small class="pull-right">{{dateFormat
"2006 Jan 2 " .Date}}</small></div>
- <div class="panel-body">
- {{.Content}}
- </div>
- </div>
- {{end}}
+ {{end}}
+ </div>
+ </div>
+ </div> -->
+ <div>
+ <div class="contentBlock">
+ <div class="blockTitle">
+ <span>Key Features</span>
+ <div class="blockTitleLine"></div>
+ </div>
+ <div class="listContainer">
+ {{range .Site.Data.homePage.keyFeatures}}
+ <div class="kfItem">
+ <img class="kfItemImg" src="{{.img | relURL}}" >
+ <p class="itemTitle">{{.title}}</p>
+ <p class="itemDesc">{{.desc}}</p>
</div>
-
- <div class="col-md-12">
- <h2>Archives</h2>
- <p><a class="next" href="/release.html">Release archive
→</a></p>
- <p><a class="next" href="/news.html">News archive →</a></p>
+ {{end}}
+ </div>
+ </div>
+ </div>
+ <div>
+ <div class="contentBlock">
+ <div class="blockTitle">
+ <span>Ecosystem</span>
+ <div class="blockTitleLine"></div>
+ <div class="blockTitleDesc">The figure below shows our vision for the
Kyuubi Ecosystem. Some of them have been realized, some in development, and
others would not be possible without your help.</div>
+ </div>
+ <div id="ecos" class="listContainer">
+ {{range .Site.Data.homePage.ecosystem}}
+ <div class="ecoItem">
+ <div class="ecoItemTitle">
+ <span>{{.title}}</span>
+ <span class="ecoItemBtn"></span>
+ </div>
+ <div class="ecoItemBody">
+ {{range .list}}
+ <img src={{. | relURL}}/>
+ {{end}}
+ </div>
</div>
- </div>
- <div class="col-md-8">
- {{range where .Site.Pages "Title" "Kyuubi Usage"}}
- <h2>{{.Title}}</h2>
- {{.Content}}
- {{end}}
- {{range where .Site.Pages "Title" "The Kyuubi Ecosystem (present and
future)"}}
- <h2>{{.Title}}</h2>
- {{.Content}}
- {{end}}
+ {{end}}
</div>
+ </div>
+ </div>
+ <div>
+ <div class="contentBlock">
+ <div class="blockTitle">
+ <span>Use cases</span>
+ <div class="blockTitleLine"></div>
</div>
-
- <hr>
-
-
- </div> <!-- /container -->
-
-{{partial "footer.html" .}}
+ <div class="useCaseListContainer">
+ {{range .Site.Data.homePage.useCases}}
+ <div class="useCaseItem">
+ <p class="useCaseItemTitle">{{.title}}</p>
+ <p class="useCaseItemDesc">{{.desc}}</p>
+ </div>
+ {{end}}
+ </div>
+ </div>
+ </div>
+ <div>
+ <div class="contentBlock">
+ <div class="blockTitle">
+ <span>Join the Community</span>
+ <div class="blockTitleLine"></div>
+ </div>
+ <div class="listContainer">
+ {{range .Site.Data.homePage.community}}
+ <a class="communityItem" href="{{.href}}">
+ <img class="communityItemImg" src="{{.img | relURL}}" >
+ <p class="communityItemTitle">{{.title}}</p>
+ <span class="communityLine"></span>
+ </a>
+ {{end}}
+ </div>
+ </div>
+ </div>
+</div>
+<script>
+var ecos = document.getElementById('ecos')
+ecos.addEventListener('click',function(e){
+ if(e.target){
+ var className = e.target.className
+ if(className==='ecoItemTitle'){
+ e.target.className = 'ecoItemTitle closeEcosItem'
+ }else if(className==='ecoItemTitle closeEcosItem'){
+ e.target.className = 'ecoItemTitle'
+ }
+ }
+})
+</script>
+{{partial "footer.html" .}}
\ No newline at end of file
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index ba8d617..c0d72aa 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -11,31 +11,43 @@
See the License for the specific language governing permissions and
limitations under the License. See accompanying LICENSE file.
-->
-<div class="container">
-<footer class="footer container">
- <div class="col-md-8">
- <p>
- Apache Kyuubi is an effort undergoing Incubation at The Apache Software
Foundation (ASF), sponsored by the Incubator.
- Incubation is required of all newly accepted projects until a further
review indicates that the infrastructure,
- communications, and decision making process have stabilized in a manner
consistent with other successful ASF projects.
- While incubation status is not necessarily a reflection of the
completeness or stability of the code, it does indicate
- that the project has yet to be fully endorsed by the ASF.
- </p>
- <p>
- Apache, the Apache Feather logo, and the Apache Incubator project logo
are trademarks of The Apache Software Foundation.
- </p>
- <p>{{ replace .Site.Copyright "{year}" now.Year }}</p>
- <p><a href="/privacy_policy.html">Privacy policy</a></p>
- </div>
- <div class="col-md-4">
- <img class="img-responsive" src="{{ "incubator_feather_egg_logo.png" |
relURL}}"/>
+<footer class="footer">
+ <div class="footerBox">
+ <div class="footerItem">
+ <a class="acevent" data-class="footerPcImg" data-format="wide"
data-mode="dark" data-width="310"></a>
+ <a class="acevent" data-class="footerMobileImg" data-format="wide"
data-mode="dark" data-width="114"></a>
+ <p>
+ The Official Global Conference Series of The Apache Software
Foundation, connecting open source technology enthusiasts from
+ around the world to share the latest technology developments and
practices.
+ </p>
+ </div>
+ <div class="footerItem">
+ <img class="footerImg" src="{{ "incubator_feather_egg_gray_logo.png" |
relURL}}"/>
+ <p>
+ <span class="footerSep"> Apache Kyuubi is an effort undergoing
Incubation at The Apache Software Foundation (ASF), sponsored by the Incubator.
+ Incubation is required of all newly accepted projects until a further
review indicates that the infrastructure,
+ communications, and decision making process have stabilized in a
manner consistent with other successful ASF projects.
+ While incubation status is not necessarily a reflection of the
completeness or stability of the code,
+ it does indicate that the project has yet to be fully endorsed by the
ASF.
+ </span>
+ Apache, the Apache Feather logo, and the Apache Incubator project logo
are trademarks of The Apache Software Foundation.
+ </p>
+ </div>
+ <div class="footerCopyRight">
+ <div class="footerBlock"></div>
+ <div class="footerCopyRightContent">
+ <span>{{ replace .Site.Copyright "{year}" now.Year }}</span>
+ <span class="footerP2">The Apache Software Foundation</span>
+ <a class="fgooterPrivacy" href="/privacy_policy.html">Privacy
policy</a>
+ </div>
+ </div>
</div>
</footer>
-</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
- <script src="js/vendor/jquery-1.12.4.min.js"></script>
+ <script src="https://www.apachecon.com/event-images/snippet.js";></script>
+ <script src="/js/vendor/jquery-1.12.4.min.js"></script>
<script>window.jQuery || document.write('<script
src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js";
integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
crossorigin="anonymous"></script>
<script>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 9409c61..bd772f3 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -29,8 +29,10 @@
<!-- Optional theme -->
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css";
integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp"
crossorigin="anonymous">
+ <link rel="stylesheet" href="{{ "css/homePage.css" | relURL }}">
<link rel="stylesheet" href="{{ "css/kyuubi.css" | relURL }}">
- <script src="https://www.apachecon.com/event-images/snippet.js";></script>
+
+
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media
queries -->
<!--[if lt IE 9]>
<script
src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js";></script>
@@ -39,19 +41,69 @@
</head>
<body>
+ <div id="nav_mask" class='nav_mask'style="display: none;"></div>
+ <nav id="header" class="header">
+ <a href="{{ "/" | relURL }}">
+ <img class="navbar_logo" src="{{ "kyuubi_logo_hd.png" | relURL}}">
+ </a>
+ {{ partial "navbar.html" .}}
+ <a class="shareImgContainer" href="https://www.apache.org/";>
+ Apache Software Foundation
+ <span class="shareImg"></span>
+ <img class="disappear" src="{{ "share.png" | relURL}}"/>
+ <img class="disappear" src="{{ "activeShare.png" | relURL}}"/>
+ </a>
+ </nav>
- <nav class="navbar navbar-inverse navbar-fixed-top">
- <div class="container">
- <div class="navbar-header">
- <button type="button" class="navbar-toggle collapsed"
data-toggle="collapse" data-target="#navbar" aria-expanded="false"
aria-controls="navbar">
- <span class="sr-only">Toggle navigation</span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- <span class="icon-bar"></span>
- </button>
- <img class="navbar-logo" src="{{ "favicon.ico" | relURL}}">
- <a class="navbar-brand" href="{{ "/" | relURL }}"> Apache Kyuubi</a>
- </div>
+ <nav id="header_mobile" class="header_mobile">
+ <a href="{{ "/" | relURL }}">
+ <img class="navbar_logo" src="{{ "kyuubi_logo_hd.png" | relURL}}">
+ </a>
+ <div class="phoneBtn" id="phoneBtn">
+ <span></span>
+ <span></span>
+ <span class="headerClose"></span>
+ </div>
+ <div class="mobileNavContainer">
{{ partial "navbar.html" .}}
+ <a class="shareImgContainer" href="https://www.apache.org/";>
+ Apache Software Foundation
+ <span class="shareImg"></span>
+ <img class="disappear" src="{{ "share.png" | relURL}}"/>
+ <img class="disappear" src="{{ "activeShare.png" | relURL}}"/>
+ </a>
</div>
</nav>
+ <script>
+ // mobile headerBtn Click
+ var phoneBtn = document.getElementById('phoneBtn')
+ var mask = document.getElementById('nav_mask')
+ phoneBtn.addEventListener('click', function (e) {
+ var isOpen = mask.style.display !== 'none'
+ phoneBtn.className = isOpen ? 'phoneBtn' : 'phoneBtn closeBtn'
+ mask.style.display = isOpen ? 'none' :' block'
+ })
+
+ mask.addEventListener('click', function (e) {
+ phoneBtn.className = 'phoneBtn'
+ mask.style.display = 'none'
+ })
+
+ // header_mobile
+ var header_mobile=document.getElementById('header_mobile')
+ header_mobile.addEventListener('click',function(e){
+ var className=e.target.className
+ if(className==="navLink navLinkWithChild"){
+ var navItem = e.target.parentNode
+ var isOpen = navItem.className!=='navItem'
+ navItem.className = isOpen ? 'navItem' : 'navItem openNavItem'
+ }
+ })
+
+ // listen page scrollX
+ var header = document.getElementById('header')
+ window.onscroll = function () {
+ var scrollLeft = document.documentElement.scrollLeft ||
document.body.scrollLeft;
+ header.style.left = -scrollLeft + 'px'
+ }
+ </script>
\ No newline at end of file
diff --git a/layouts/partials/navbar.html b/layouts/partials/navbar.html
index b2bb024..0eac1c1 100644
--- a/layouts/partials/navbar.html
+++ b/layouts/partials/navbar.html
@@ -11,35 +11,32 @@
See the License for the specific language governing permissions and
limitations under the License. See accompanying LICENSE file.
-->
- <div id="navbar" class="navbar-collapse collapse">
- <ul class="nav navbar-nav">
- {{ $currentPage := . }}
- {{ range .Site.Menus.main }}
- {{ if .HasChildren }}
- <li class="dropdown {{if $currentPage.HasMenuCurrent "main" . }}
active{{end}}">
- <a href="#" class="dropdown-toggle" data-toggle="dropdown"
role="button" aria-haspopup="true" aria-expanded="false">{{ .Name }} <span
class="caret"></span></a>
- <ul class="dropdown-menu">
- {{ range .Children }}
- <li {{if $currentPage.HasMenuCurrent "main" .
}}class="active"{{end}}><a href="{{.URL }}">{{.Name}}</a></li>
- {{end}}
- {{if eq .Name "Documentation"}}
- <li role="separator" class="divider"></li>
- {{range (where (where $currentPage.Site.Pages "Section"
"release") ".Params.linked" true)}}
- <li><a
href="docs/r{{.File.BaseFileName}}/">{{.File.BaseFileName}}</a></li>
- {{end}}
- {{end}}
- </ul>
- </li>
- {{ else }}
- <li class="{{if $currentPage.HasMenuCurrent "main" .
}}active{{end}}"><a href="{{ .URL }}">{{ .Name }}</a></li>
- {{ end }}
- {{end}}
- </ul>
- <ul class="nav navbar-nav navbar-right">
- <li>
- <a href="https://www.apache.org/";>Apache Software Foundation <span
class="glyphicon glyphicon-new-window" aria-hidden="true"></span></a>
- </li>
-
-
- </ul>
- </div><!--/.nav-collapse -->
+<ul class="navContainer">
+ {{ $currentPage := . }}
+ {{ range .Site.Menus.main }}
+ {{ if .HasChildren }}
+ <li class="navItem">
+ <a href="javascript:;" class="navLink navLinkWithChild" role="button"
aria-haspopup="true" aria-expanded="false">
+ {{ .Name }}
+ <span class="navAngle"></span>
+ </a>
+ <div class="childNavContainer">
+ <ul class="childNav">
+ {{ range .Children }}
+ <li><a class="childNavLink" href="{{.URL }}">{{.Name}}</a></li>
+ {{end}}
+ {{if eq .Name "Documentation"}}
+ <li role="separator" class="dividerLine"></li>
+ {{range (where (where $currentPage.Site.Pages "Section" "release")
".Params.linked" true)}}
+ <li><a class="childNavLink"
href="docs/r{{.File.BaseFileName}}/">{{.File.BaseFileName}}</a></li>
+ {{end}}
+ {{end}}
+ </ul>
+ </div>
+ </li>
+ {{ else }}
+ <li class="navItem"><a class="navLink" href="{{ .URL }}">{{ .Name }}</a></li>
+ {{ end }}
+ {{end}}
+</ul>
+<!--/.nav-collapse -->
\ No newline at end of file
diff --git a/static/activeShare.png b/static/activeShare.png
new file mode 100644
index 0000000..5f69b2a
Binary files /dev/null and b/static/activeShare.png differ
diff --git a/static/css/homePage.css b/static/css/homePage.css
new file mode 100644
index 0000000..f93f7cb
--- /dev/null
+++ b/static/css/homePage.css
@@ -0,0 +1,619 @@
+html,
+body {
+ min-width: 1250px;
+ overflow-x: auto;
+}
+
+.contentContainer>div:nth-child(2n +1) {
+ background: #F2F2F2;
+}
+
+.contentContainer>div:nth-child(2n) {
+ background-color: white;
+}
+
+.contentContainer>div:first-child {
+ overflow: hidden;
+ background: linear-gradient(270deg, rgba(225, 225, 225, 1) 0%, rgba(242,
242, 242, 0) 100%);
+}
+
+.contentBlock {
+ width: 1400px;
+ margin: 0 auto;
+ position: relative;
+ padding: 88px 0;
+}
+
+.contentContainer>div:first-child .contentBlock {
+ padding-top: 118px;
+ height: 500px;
+}
+
+.bannerBg {
+ position: absolute;
+ height: 500px;
+ width: auto;
+ top: 0;
+ left: 50%;
+ transform: translateX(-50%);
+}
+
+.bannerContent {
+ position: relative;
+}
+
+.bannerTitle {
+ font-size: 42px;
+ line-height: 59px;
+ margin-bottom: 24px;
+ color: #333333;
+ font-weight: bolder;
+}
+
+.bannerDesc {
+ font-size: 18px;
+ line-height: 26px;
+ color: #666;
+ margin-bottom: 48px;
+ width: 860px;
+}
+
+.bannerBtnContainer {
+ display: flex;
+}
+
+.bannerBtn {
+ width: 154px;
+ height: 42px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 4px;
+ margin-right: 16px;
+ font-size: 16px;
+ line-height: 22px;
+}
+
+.bannerBtn:hover {
+ text-decoration: none;
+}
+
+.bannerBtn:first-child {
+ background: #E7161A;
+ color: white;
+}
+
+.bannerBtn:last-child {
+ border: 1px solid #E7161A;
+ color: #E7161A;
+}
+
+.bannerBtn:first-child:hover {
+ background: #F42E32;
+}
+
+.bannerBtn:last-child:hover {
+ background: #E7161A;
+ color: white;
+}
+
+.blockTitle {
+ font-size: 42px;
+ line-height: 42px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ padding-bottom: 64px;
+ color: #333333;
+}
+
+.blockTitleLine {
+ width: 88px;
+ height: 4px;
+ background-color: #E7161A;
+ margin-top: 32px;
+}
+
+.blockTitleDesc {
+ margin-top: 20px;
+ font-size: 16px;
+ line-height: 22px;
+ text-align: center;
+ color: #666666;
+ width: 860px;
+}
+
+.listContainer {
+ display: flex;
+ justify-content: space-between;
+}
+
+.usageItem {
+ width: 446px;
+ height: 468px;
+ box-shadow: 0px 8px 20px 1px rgba(221, 221, 221, 0.5);
+ border-radius: 4px;
+}
+
+.usageItemImg {
+ width: 100%;
+ height: auto;
+}
+
+.useCaseListContainer {
+ padding: 0;
+}
+
+.useCaseItem {
+ border-bottom: 1px solid #666;
+ margin-bottom: 48px;
+}
+
+
+
+.useCaseItemTitle {
+ font-size: 30px;
+ line-height: 42px;
+ color: #333333;
+ margin-bottom: 20px;
+}
+
+.useCaseItemDesc {
+ font-size: 16px;
+ line-height: 22px;
+ color: #666666;
+ margin-bottom: 48px;
+}
+
+.useCaseItem:last-child {
+ border-bottom: none;
+ margin-bottom: 0;
+}
+
+.useCaseItem:last-child .useCaseItemDesc {
+ margin-bottom: 0;
+}
+
+.itemTitle {
+ margin: 0;
+ margin-top: 42px;
+ font-size: 30px;
+ line-height: 42px;
+ color: #333333;
+ padding: 0 36px;
+}
+
+.itemDesc {
+ margin: 0;
+ margin-top: 20px;
+ font-size: 16px;
+ line-height: 22px;
+ color: #666666;
+ padding: 0 36px;
+}
+
+.kfItem {
+ width: 440px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+.kfItemImg {
+ width: 94px;
+ height: 94px;
+}
+
+.ecoItem {
+ width: 446px;
+}
+
+.ecoItemTitle {
+ background: linear-gradient(104.6deg, #FF4549 4%, #E7161A 69.37%);
+ border-radius: 4px;
+ font-size: 30px;
+ line-height: 52px;
+ text-align: center;
+ color: #FFFFFF;
+ margin-bottom: 16px;
+}
+
+.ecoItemBtn {
+ display: none;
+}
+
+.ecoItemBody {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: space-between;
+}
+
+.ecoItemBody>img {
+ width: 215px;
+ margin-bottom: 16px;
+ display: block;
+ height: 68px;
+}
+
+.communityItem {
+ width: 446px;
+ height: 252px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ background: #FFFFFF;
+ border: 1px solid #E3E3E3;
+ box-sizing: border-box;
+ border-radius: 4px;
+ position: relative;
+}
+
+.communityItem:hover {
+ box-shadow: 0px 6px 20px 1px rgba(221, 221, 221, 0.7);
+ text-decoration: none;
+
+}
+
+.communityItemImg {
+ width: 94px;
+ height: 94px;
+ margin-top: 48px;
+ margin-bottom: 20px;
+}
+
+.communityItemTitle {
+ font-size: 24px;
+ line-height: 34px;
+ color: #333333;
+ transition: all 0.3s;
+}
+
+.communityItemTitle::after {
+ display: block;
+ height: 1px;
+ width: 0;
+ background-color: #E7161A;
+ /* position: absolute; */
+ transition: all 0.3s;
+ /* left: 50%; */
+ /* margin-left: -62px; */
+ /* bottom: 48px; */
+ margin-top: 8px;
+
+ content: '';
+}
+
+/* .communityLine {
+ display: block;
+ height: 1px;
+ width: 0;
+ background-color: #E7161A;
+ position: absolute;
+ transition: all 0.3s;
+ left: 50%;
+ margin-left: -62px;
+ bottom: 48px;
+} */
+
+.communityItem:hover .communityItemTitle::after {
+ width: 100%;
+}
+
+.communityItem:hover .communityItemTitle {
+ color: #E7161A;
+ text-decoration: none;
+}
+
+@media screen and (max-width:1450px) {
+ .contentBlock {
+ width: 1200px;
+ }
+
+ .bannerDesc {
+ width: 800px;
+ }
+
+ .usageItem {
+ width: 378px;
+ }
+
+ .kfItem {
+ width: 379px;
+ }
+
+ .kfItem .itemTitle {
+ padding: 0;
+ }
+
+ .ecoItem {
+ width: 378px;
+ }
+
+ .ecoItemBody>img {
+ width: 181px;
+ height: 57px;
+ }
+
+ .communityItem {
+ width: 378px;
+ }
+}
+
+@media screen and (max-width:768px) {
+
+ html,
+ body {
+ min-width: 0;
+ overflow-x: hidden;
+ }
+
+ .contentBlock {
+ width: 100%;
+ padding: 44px 30px;
+ }
+
+ .contentContainer>div:first-child .contentBlock {
+ padding-top: 44px;
+ height: auto;
+ background-image: url(/homePageImg/bannerBg_m.png);
+ background-size: cover;
+ }
+
+ .bannerBg {
+ display: none;
+ }
+
+ .bannerTitle {
+ font-size: 30px;
+ line-height: 42px;
+ color: #333333;
+ margin-bottom: 20px;
+ }
+
+ .bannerDesc {
+ width: 100%;
+ margin-bottom: 24px
+ }
+
+ .bannerBtn {
+ width: 116px;
+ height: 32px;
+ font-size: 12px;
+ line-height: 17px;
+ margin-right: 12px;
+ }
+
+ .blockTitle {
+ font-size: 28px;
+ line-height: 42px;
+ color: #333333;
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ padding-bottom: 24px;
+ }
+
+ .blockTitleLine {
+ width: 48px;
+ height: 2px;
+ background-color: #E7161A;
+ margin-top: 8px;
+ }
+
+ .blockTitleDesc {
+ margin-top: 16px;
+ font-size: 16px;
+ line-height: 22px;
+ text-align: left;
+ color: #666666;
+ width: 100%;
+ }
+
+ .listContainer {
+ display: block;
+ justify-content: space-between;
+ }
+
+ .itemTitle {
+ margin: 0;
+ margin-top: 16px;
+ font-size: 16px;
+ line-height: 22px;
+ color: #333333;
+ padding: 0 0 12px 0;
+ }
+
+ .itemDesc {
+ margin: 0;
+ margin-top: 12px;
+ font-size: 14px;
+ line-height: 19px;
+ color: #666666;
+ padding: 0 0 24px 0;
+ }
+
+ .kfItem {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ padding-bottom: 24px;
+ }
+
+ .kfItem::after {
+ content: "";
+ display: block;
+ height: 1px;
+ width: 100%;
+ transform: scaleY(0.25);
+ background-color: #999;
+ }
+
+ .kfItemImg {
+ width: 64px;
+ height: 64px;
+ }
+
+ .contentBlock>.listContainer>div:last-child {
+ padding-bottom: 0;
+ }
+
+ .contentBlock>.listContainer>div:last-child .itemDesc {
+ padding-bottom: 0;
+ }
+
+ .contentBlock>.listContainer>div:last-child::after {
+ display: none;
+ }
+
+ .ecoItem {
+ width: 100%;
+ }
+
+ .ecoItemTitle {
+ background: linear-gradient(104.6deg, #FF4549 4%, #E7161A 69.37%);
+ border-radius: 2px;
+ font-size: 16px;
+ color: #FFFFFF;
+ margin-bottom: 8px;
+ height: 38px;
+ padding: 0 24px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ }
+
+ .ecoItemTitle span {
+ pointer-events: none;
+ }
+
+ .ecoItemBtn {
+ position: relative;
+ display: block;
+ left: -7px;
+ }
+
+ .ecoItemBtn:before,
+ .ecoItemBtn:after {
+ position: absolute;
+ content: '';
+ height: 1px;
+ /* width: 10px; */
+ width: 7px;
+ background-color: white;
+ }
+
+ .ecoItemBtn:before {
+ transform: rotate(45deg);
+ /* left: -7px; */
+ left: -5px;
+ }
+
+ .ecoItemBtn:after {
+ transform: rotate(-45deg);
+ }
+
+ .ecoItemBody>img {
+ width: calc(50vw - 34px);
+ height: auto;
+ height: calc(calc(50vw - 34px) * 0.316) ;
+ margin-bottom: 8px;
+ display: block;
+ }
+
+ .closeEcosItem .ecoItemBtn:before,
+ .closeEcosItem .ecoItemBtn::after {
+ transform: rotate(0deg);
+ left: -4px;
+ width: 10px;
+ }
+
+ .closeEcosItem+div {
+ height: 0;
+ overflow: hidden;
+ }
+
+ .useCaseItem {
+ border-bottom: none;
+ margin-bottom: 24px;
+ }
+
+ .useCaseItem::after {
+ content: "";
+ display: block;
+ height: 1px;
+ width: 100%;
+ transform: scaleY(0.25);
+ background-color: #999;
+ }
+
+ .useCaseItem:last-child:after {
+ display: none;
+ }
+
+ .useCaseItemTitle {
+ font-size: 16px;
+ line-height: 22px;
+ text-align: center;
+ color: #333333;
+ margin-bottom: 12px;
+ }
+
+ .useCaseItemDesc {
+ font-size: 14px;
+ line-height: 19px;
+ color: #666666;
+ margin-bottom: 24px;
+ }
+
+ .communityItem {
+ width: 100%;
+ height: 142px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ background: #FFFFFF;
+ border: 1px solid #E3E3E3;
+ box-sizing: border-box;
+ border-radius: 4px;
+ position: relative;
+ margin-bottom: 24px;
+ box-shadow: 0px 6px 20px 1px rgba(221, 221, 221, 0.7);
+ }
+
+ .communityItem:last-child {
+ margin-bottom: 0;
+ }
+
+ .communityItemImg {
+ width: 56px;
+ height: 56px;
+ margin-top: 28px;
+ margin-bottom: 8px;
+ }
+
+ .communityItemTitle {
+ font-size: 16px;
+ line-height: 22px;
+ color: #333333;
+ }
+
+ .communityItemTitle::after {
+ content: " >";
+ display: inline;
+ height: auto;
+ width: auto;
+ background-color: transparent;
+ /* position: absolute; */
+ transition: all 0.3s;
+ /* left: 50%; */
+ /* margin-left: -62px; */
+ /* bottom: 48px; */
+ margin-top: 0;
+ }
+
+ .communityLine {
+ display: none;
+ }
+
+}
\ No newline at end of file
diff --git a/static/css/kyuubi.css b/static/css/kyuubi.css
index 58990e3..ce92f6c 100644
--- a/static/css/kyuubi.css
+++ b/static/css/kyuubi.css
@@ -15,69 +15,286 @@
* limitations under the License.
*/
/*=============================================================================
- Navbar at the top of the page
+ Navbar at the top of the page
=============================================================================*/
-
+/* @import url('./index.css'); */
+/*
+header
+*/
body {
- padding-top: 80px;
+ padding-top: 68px;
+}
+
+.disappear {
+ display: none;
+}
+
+.header {
+ padding-left: 48px;
+ padding-right: 48px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ height: 68px;
+ box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.05);
+ position: fixed;
+ background: white;
+ top: 0px;
+ width: 100%;
+ z-index: 1;
+ min-width: 1250px;
+ border-bottom: 1px solid rgb(229, 229, 229);
+}
+
+.header_mobile {
+ display: none;
+}
+
+.navbar_logo {
+ width: 104px;
+}
+
+.shareImgContainer {
+ color: rgba(51, 51, 51, 0.7);
+ font-size: 14px;
+ line-height: 22px;
+ display: flex;
+ align-items: center;
+}
+
+.shareImg {
+ width: 14px;
+ height: 14px;
+ display: inline-block;
+ background-image: url('/share.png');
+ background-size: cover;
+ margin-left: 4px;
+}
+
+.shareImgContainer:hover {
+ text-decoration: none;
+ color: #E7161A;
+}
+
+.shareImgContainer:hover .shareImg {
+ background-image: url('/activeShare.png');
+}
+
+.navContainer {
+ flex: 1;
+ display: flex;
+ height: 100%;
+ margin: 0;
+ padding-left: 125px;
+}
+
+.navContainer li {
+ list-style: none;
+}
+
+.navItem {
+ margin-right: 40px;
+ color: #666;
+ font-size: 14px;
+ line-height: 22px;
+ height: 100%;
+ position: relative;
+}
+
+.navLink {
+ display: flex;
+ align-items: center;
+ height: 100%;
+ color: #666;
+}
+
+.navAngle {
+ width: 0;
+ height: 0;
+ border-style: solid;
+ border-width: 4px 4px 0 4px;
+ border-color: #999 transparent transparent transparent;
+ margin-right: 5px;
+ margin-left: 10px;
+}
+
+.navLink:focus {
+ color: #666;
+ text-decoration: none;
}
-.jumbotron{
- margin-top: -30px;
+.navLink:hover {
+ text-decoration: none;
+ color: #E7161A;
+}
+
+.navItem:hover .navLink {
+ text-decoration: none;
+ color: #E7161A;
+}
+
+.navItem:hover .navAngle {
+ border-width: 0 4px 4px 4px;
+ border-color: transparent transparent #E7161A transparent;
+}
+
+.childNavContainer {
+ overflow: hidden;
+ position: absolute;
+ transform: translateX(-45px);
+ padding: 20px;
+ padding-top: 0;
+ top: 68px;
}
-/* Links */
-.navbar-default .navbar-nav > li > a {
- color: black;
- font-weight: bold;
+.childNav {
+ padding: 20px 32px 12px;
+ background: #FFFFFF;
+ box-shadow: 0px 6px 16px 2px rgba(0, 0, 0, 0.15);
}
-.navbar-default .navbar-nav > li > a:hover {
- background: #E7E7E7;
+
+.childNavLink {
+ display: block;
+ white-space: nowrap;
+ font-size: 14px;
+ line-height: 22px;
+ color: #666666;
+ margin-bottom: 8px;
+}
+
+.dividerLine {
+ width: 100%;
+ height: 1px;
+ background-color: rgba(153, 153, 153, .3);
+ margin-bottom: 8px;
+ transform: scaleY(0.5);
+}
+
+.childNavLink:hover {
+ text-decoration: none;
+ color: #E7161A;
}
-.navbar-collapse .dropdown-header {
- color: black;
+.navItem .childNavContainer {
+ display: none;
}
-img.navbar-logo{
- float: left;
- height: 40px;
- width: 40px;
- margin: 5px;
- margin-right: 10px;
+.navItem:hover .childNavContainer {
+ display: block;
}
+/* footer */
.footer {
- margin-top: 30px;
- padding: 10px;
- background-color: #EFEFEF;
- color: #505050;
- font-size: 80%;
+ min-width: 1250px;
+ height: 489px;
+ background: rgb(26, 26, 26);
+ padding: 88px 0;
+ font-size: 14px;
+ line-height: 20px;
+ color: #FFFFFF;
+}
+
+.footerBox {
+ width: 1400px;
+ margin: 0 auto;
+}
+
+.footerMobileImg {
+ display: none;
+}
+
+.footerItem {
+ display: flex;
+ margin-bottom: 34px;
+ align-items: center;
+ justify-content: space-between;
+}
+
+.footerItem>p {
+ margin-bottom: 0px;
+ width: 1037px;
+}
+
+.footerImg {
+ width: 310px;
+ display: block;
+}
+
+.footerSep {
+ display: block;
+}
+
+.footerCopyRight {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+}
+
+.footerBlock {
+ width: 310px;
+}
+
+.footerCopyRightContent {
+ padding-top: 10px;
+ width: 1037px;
}
-.kyuubi-logo {
+.footerP2 {
+ padding-right: 10px;
+ display: inline-block;
+}
+
+.fgooterPrivacy {
+ color: rgb(86, 164, 221);
+}
+
+.fgooterPrivacy:hover {
+ color: rgb(177, 222, 255);
+ /* text-decoration: none; */
+}
+
+@media screen and (max-width:1450px) {
+ .footerBox {
+ width: 1200px;
+ }
+ .footerItem>p {
+ width: 842px;
+ }
+
+ .footerCopyRightContent {
+ width: 842px;
+ }
}
+
/*=============================================================================
Text
=============================================================================*/
/* The auto-generated TOC anchors are hidden by the top navbar otherwise. */
-h1, h2, h3, h4, h5, h6 {
- padding-top: 70px;
- margin-top: -60px;
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+ padding-top: 70px;
+ margin-top: -60px;
}
h1 {
- font-size: 160%;
+ font-size: 160%;
}
h2 {
- font-size: 140%;
+ font-size: 140%;
}
-h3, h4, h5, h6 {
- font-size: 120%;
+h3,
+h4,
+h5,
+h6 {
+ font-size: 120%;
}
/*=============================================================================
@@ -85,56 +302,332 @@ h3, h4, h5, h6 {
=============================================================================*/
.page-toc {
- padding-bottom: 2em;
+ padding-bottom: 2em;
}
#markdown-toc {
- font-size: 90%;
-}
-
-@media (min-width: 768px) {
- #markdown-toc {
- /*width: 35%;*/
- }
+ font-size: 90%;
}
/* Custom list styling */
-#markdown-toc, #markdown-toc ul {
- list-style: none;
- display: block;
- position: relative;
- padding-left: 0;
- margin-bottom: 0;
+#markdown-toc,
+#markdown-toc ul {
+ list-style: none;
+ display: block;
+ position: relative;
+ padding-left: 0;
+ margin-bottom: 0;
}
/* All element */
-#markdown-toc li > a {
- display: block;
- padding: 5px 10px;
- border: 1px solid #E5E5E5;
- margin:-1px;
-}
-#markdown-toc li > a:hover,
-#markdown-toc li > a:focus {
+#markdown-toc li>a {
+ display: block;
+ padding: 5px 10px;
+ border: 1px solid #E5E5E5;
+ margin: -1px;
+}
+
+#markdown-toc li>a:hover,
+#markdown-toc li>a:focus {
text-decoration: none;
background-color: #eee;
}
/* 1st-level elements */
-#markdown-toc > li > a {
- font-weight: bold;
+#markdown-toc>li>a {
+ font-weight: bold;
}
/* 2nd-level element */
-#markdown-toc > li li > a {
- padding-left: 20px; /* A little more indentation*/
+#markdown-toc>li li>a {
+ padding-left: 20px;
+ /* A little more indentation*/
}
/* >= 3rd-level element */
-#markdown-toc > li li li {
- display: none; /* hide */
+#markdown-toc>li li li {
+ display: none;
+ /* hide */
}
-#markdown-toc li:last-child > a {
- border-bottom: 1px solid #E5E5E5;
+#markdown-toc li:last-child>a {
+ border-bottom: 1px solid #E5E5E5;
}
+
+/* mobile */
+@media screen and (max-width:768px) {
+ body {
+ padding-top: 48px;
+ }
+
+ .header {
+ display: none;
+ }
+
+ .header_mobile {
+ height: 48px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ background: white;
+ position: fixed;
+ top: 0;
+ z-index: 1;
+ padding: 0 18px;
+ width: 100%;
+ }
+
+ .phoneBtn {
+ height: 18px;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-around;
+ }
+
+ .phoneBtn>span {
+ width: 16px;
+ height: 2px;
+ display: block;
+ background-color: #999;
+ }
+
+ .closeBtn>span {
+ display: none;
+ }
+
+ .closeBtn .headerClose {
+ width: 18px;
+ height: 18px;
+ margin: auto;
+ position: relative;
+ display: block;
+ background-color: transparent;
+ }
+
+ .closeBtn .headerClose::before,
+ .closeBtn .headerClose::after {
+ content: "";
+ position: absolute;
+ height: 18px;
+ width: 2px;
+ top: 0px;
+ right: 9px;
+ background: #999;
+ }
+
+ .closeBtn .headerClose::before {
+ transform: rotate(45deg);
+ }
+
+ .closeBtn .headerClose::after {
+ transform: rotate(-45deg);
+ }
+
+ .mobileNavContainer {
+ position: absolute;
+ top: 48px;
+ left: 0px;
+ width: 100%;
+ background-color: white;
+ display: none;
+ }
+
+ .closeBtn+div {
+ display: block;
+ }
+
+ .navContainer {
+ flex-direction: column;
+ width: 100%;
+ padding: 0px;
+ }
+
+ .navItem {
+ margin: 0px;
+ font-size: 12px;
+ line-height: 16px;
+ position: relative;
+ min-height: 40px;
+ box-shadow: 0px -0.5px 0px rgba(0, 0, 0, 0.1);
+ }
+
+
+
+
+
+
+
+
+
+ .shareImgContainer:hover .shareImg {
+ background-image: url('/share.png');
+ }
+
+ .shareImgContainer:hover {
+ color: rgba(51, 51, 51, .7);
+ }
+
+
+
+ .navItem:hover .navLink {
+ text-decoration: none;
+ color: rgba(51, 51, 51, .7);
+ }
+
+ .navItem:hover .navAngle {
+ border-width: 4px 4px 0 4px;
+ border-color: #999 transparent transparent transparent;
+ }
+
+ .childNavLink:hover {
+ text-decoration: none;
+ color: rgba(102, 102, 102, .7);
+ }
+
+ .navLink:hover {
+ text-decoration: none;
+ color: rgba(51, 51, 51, .7);
+ }
+
+ .navItem:hover .childNavContainer {
+ display: none;
+ }
+
+ .mobileNavContainer .openNavItem .childNav li:first-child .childNavLink {
+ box-shadow: none;
+ }
+
+ .mobileNavContainer .openNavItem {
+ box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.1), 0px -0.5px 0px rgba(0, 0, 0,
0.1);
+ }
+
+ .mobileNavContainer .openNavItem .childNavContainer {
+ display: block;
+ }
+
+ .mobileNavContainer .openNavItem .navLink {
+ text-decoration: none;
+ color: #E7161A;
+ box-sizing: content-box;
+ height: 25px;
+ padding-top: 11px;
+ }
+
+ .mobileNavContainer .openNavItem .navAngle {
+ border-width: 0 4px 4px 4px;
+ border-color: transparent transparent #E7161A transparent;
+ }
+
+ .navItem:first-child {
+ box-shadow: 0px -0.5px 0px rgba(0, 0, 0, 0.3);
+ }
+
+ .navLink {
+ color: rgba(51, 51, 51, .7);
+ padding-left: 18px;
+ height: 48px;
+ font-size: 12px;
+ }
+
+ .shareImgContainer {
+ font-size: 12px;
+ line-height: 16px;
+ height: 40px;
+ box-shadow: 0px -0.5px 0px rgba(0, 0, 0, 0.1);
+ padding-left: 18px;
+ }
+
+ .childNavContainer {
+ padding: 0;
+ position: static;
+ transform: none;
+ }
+
+ .childNav {
+ padding: 0;
+ position: relative;
+ transform: none;
+ background-color: white;
+ box-shadow: none;
+ /* display: none; */
+ }
+
+ .childNavLink {
+ display: block;
+ white-space: nowrap;
+ font-size: 10px;
+ line-height: 28px;
+ color: rgba(102, 102, 102, .7);
+ margin: 0px;
+ height: 32px;
+ padding-left: 18px;
+ box-shadow: 0px -0.5px 0px rgba(0, 0, 0, 0.1);
+ }
+
+ .dividerLine {
+ display: none;
+ }
+
+ .nav_mask {
+ position: fixed;
+ top: 0;
+ left: 0;
+ height: 100%;
+ width: 100%;
+ background-color: rgba(0, 0, 0, 0.4);
+ z-index: 1;
+ }
+
+ /*footer*/
+ .footer {
+ min-width: 0;
+ height: auto;
+ padding: 44px 30px;
+ font-size: 12px;
+ line-height: 19px;
+ color: #FFFFFF;
+ }
+
+ .footerBox {
+ width: 100%;
+ }
+
+ .footerItem {
+ display: flex;
+ margin-bottom: 32px;
+ flex-direction: column-reverse;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .footerImg {
+ width: 114px;
+ display: block;
+ }
+
+ .footerItem>p {
+ margin-bottom: 24px;
+ width: 100%;
+ }
+
+ .footerSep {
+ display: inline;
+ }
+
+ .footerBlock {
+ display: none;
+ }
+ .footerMobileImg {
+ display: block;
+ }
+ .footerPcImg {
+ display: none;
+ }
+
+ .footerCopyRightContent {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ }
+}
\ No newline at end of file
diff --git a/static/homePageImg/bannerBg_m.png
b/static/homePageImg/bannerBg_m.png
new file mode 100644
index 0000000..1fd4135
Binary files /dev/null and b/static/homePageImg/bannerBg_m.png differ
diff --git a/static/homePageImg/community1.png
b/static/homePageImg/community1.png
new file mode 100644
index 0000000..0430dd4
Binary files /dev/null and b/static/homePageImg/community1.png differ
diff --git a/static/homePageImg/community2.png
b/static/homePageImg/community2.png
new file mode 100644
index 0000000..7fc8df6
Binary files /dev/null and b/static/homePageImg/community2.png differ
diff --git a/static/homePageImg/community3.png
b/static/homePageImg/community3.png
new file mode 100644
index 0000000..d020dec
Binary files /dev/null and b/static/homePageImg/community3.png differ
diff --git a/static/homePageImg/ecosA1.png b/static/homePageImg/ecosA1.png
new file mode 100644
index 0000000..a8a7e90
Binary files /dev/null and b/static/homePageImg/ecosA1.png differ
diff --git a/static/homePageImg/ecosA2.png b/static/homePageImg/ecosA2.png
new file mode 100644
index 0000000..039009e
Binary files /dev/null and b/static/homePageImg/ecosA2.png differ
diff --git a/static/homePageImg/ecosA3.png b/static/homePageImg/ecosA3.png
new file mode 100644
index 0000000..9df38d3
Binary files /dev/null and b/static/homePageImg/ecosA3.png differ
diff --git a/static/homePageImg/ecosA4.png b/static/homePageImg/ecosA4.png
new file mode 100644
index 0000000..0216536
Binary files /dev/null and b/static/homePageImg/ecosA4.png differ
diff --git a/static/homePageImg/ecosA5.png b/static/homePageImg/ecosA5.png
new file mode 100644
index 0000000..4e494f1
Binary files /dev/null and b/static/homePageImg/ecosA5.png differ
diff --git a/static/homePageImg/ecosA6.png b/static/homePageImg/ecosA6.png
new file mode 100644
index 0000000..7eab901
Binary files /dev/null and b/static/homePageImg/ecosA6.png differ
diff --git a/static/homePageImg/ecosB1.png b/static/homePageImg/ecosB1.png
new file mode 100644
index 0000000..3dd5939
Binary files /dev/null and b/static/homePageImg/ecosB1.png differ
diff --git a/static/homePageImg/ecosB2.png b/static/homePageImg/ecosB2.png
new file mode 100644
index 0000000..039744c
Binary files /dev/null and b/static/homePageImg/ecosB2.png differ
diff --git a/static/homePageImg/ecosB3.png b/static/homePageImg/ecosB3.png
new file mode 100644
index 0000000..fb1c859
Binary files /dev/null and b/static/homePageImg/ecosB3.png differ
diff --git a/static/homePageImg/ecosB4.png b/static/homePageImg/ecosB4.png
new file mode 100644
index 0000000..e35459a
Binary files /dev/null and b/static/homePageImg/ecosB4.png differ
diff --git a/static/homePageImg/ecosC1.png b/static/homePageImg/ecosC1.png
new file mode 100644
index 0000000..1196426
Binary files /dev/null and b/static/homePageImg/ecosC1.png differ
diff --git a/static/homePageImg/ecosC2.png b/static/homePageImg/ecosC2.png
new file mode 100644
index 0000000..044d9f1
Binary files /dev/null and b/static/homePageImg/ecosC2.png differ
diff --git a/static/homePageImg/ecosC3.png b/static/homePageImg/ecosC3.png
new file mode 100644
index 0000000..ad0068d
Binary files /dev/null and b/static/homePageImg/ecosC3.png differ
diff --git a/static/homePageImg/ecosC4.png b/static/homePageImg/ecosC4.png
new file mode 100644
index 0000000..61cdb53
Binary files /dev/null and b/static/homePageImg/ecosC4.png differ
diff --git a/static/homePageImg/ecosC5.png b/static/homePageImg/ecosC5.png
new file mode 100644
index 0000000..a21e31c
Binary files /dev/null and b/static/homePageImg/ecosC5.png differ
diff --git a/static/homePageImg/ecosC6.png b/static/homePageImg/ecosC6.png
new file mode 100644
index 0000000..93648c8
Binary files /dev/null and b/static/homePageImg/ecosC6.png differ
diff --git a/static/homePageImg/indexBanner.png
b/static/homePageImg/indexBanner.png
new file mode 100644
index 0000000..ee231ee
Binary files /dev/null and b/static/homePageImg/indexBanner.png differ
diff --git a/static/homePageImg/kf1.png b/static/homePageImg/kf1.png
new file mode 100644
index 0000000..26af820
Binary files /dev/null and b/static/homePageImg/kf1.png differ
diff --git a/static/homePageImg/kf2.png b/static/homePageImg/kf2.png
new file mode 100644
index 0000000..a63a7a3
Binary files /dev/null and b/static/homePageImg/kf2.png differ
diff --git a/static/homePageImg/kf3.png b/static/homePageImg/kf3.png
new file mode 100644
index 0000000..b852751
Binary files /dev/null and b/static/homePageImg/kf3.png differ
diff --git a/static/incubator_feather_egg_gray_logo.png
b/static/incubator_feather_egg_gray_logo.png
new file mode 100644
index 0000000..84f7757
Binary files /dev/null and b/static/incubator_feather_egg_gray_logo.png differ
diff --git a/static/share.png b/static/share.png
new file mode 100644
index 0000000..4b136ef
Binary files /dev/null and b/static/share.png differ
