This is an automated email from the ASF dual-hosted git repository.

zregvart pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/camel-website.git


The following commit(s) were added to refs/heads/master by this push:
     new 338b9b0  CAMEL-15392: documentation and community redesign
338b9b0 is described below

commit 338b9b09cdae00e1245c306d885db370c94714f1
Author: Aashna Jena <jenaaas...@gmail.com>
AuthorDate: Fri Aug 28 00:01:53 2020 +0200

    CAMEL-15392: documentation and community redesign
    
    Based on pull request #469 by @aashnajena, rebased with fixed links.
---
 antora-ui-camel/src/css/community.css |  19 ---
 antora-ui-camel/src/css/docs.css      | 182 +++++++--------------
 antora-ui-camel/src/css/frontpage.css |  39 +++--
 antora-ui-camel/src/css/site.css      |   1 -
 content/_index.md                     |  20 +--
 content/community/_index.md           | 118 ++++++--------
 content/docs/_index.md                | 297 +++++++---------------------------
 layouts/index.html                    |   2 +-
 8 files changed, 206 insertions(+), 472 deletions(-)

diff --git a/antora-ui-camel/src/css/community.css 
b/antora-ui-camel/src/css/community.css
deleted file mode 100644
index 3efc122..0000000
--- a/antora-ui-camel/src/css/community.css
+++ /dev/null
@@ -1,19 +0,0 @@
-.community th {
-  text-align: left;
-}
-
-.community {
-  padding: 1rem 3rem;
-}
-
-@media screen and (max-width: 1023px) {
-  .community {
-    padding: 0 1rem 4rem;
-  }
-}
-
-@media screen and (min-width: 1024px) {
-  .section .description {
-    height: 10rem;
-  }
-}
diff --git a/antora-ui-camel/src/css/docs.css b/antora-ui-camel/src/css/docs.css
index abf5fe5..ef9f8d4 100644
--- a/antora-ui-camel/src/css/docs.css
+++ b/antora-ui-camel/src/css/docs.css
@@ -1,154 +1,86 @@
-.docs {
-  padding: 1rem 3rem;
-}
-
-.docs p:empty {
-  display: none;
-}
-
-.section h2 {
-  text-align: center;
-  padding-bottom: 0;
-}
-
-.camel-project {
-  width: calc(100% - 3rem);
-  display: inline-flex;
-  border: 1px solid var(--color-smoke-90);
+.docs,
+.community {
+  padding: 1rem 3rem 2rem;
+  display: flex;
+  width: 80%;
   flex-direction: column;
-  align-items: center;
-  text-align: center;
-  padding: 1rem 1rem 2rem 1rem;
-  margin: 1.5rem;
-  border-radius: 10px;
 }
 
-.camel-project .section {
-  border: none;
-  padding: 0;
-}
-
-.camel-project .section.core {
-  width: 100%;
+.docs .box,
+.community .box {
+  display: flex;
+  margin: 1rem 0;
 }
 
-.camel-project .camel-documentation .links {
-  background-color: var(--color-camel-orange-light);
-  padding: 0 0.5rem;
-  border-radius: 25px;
-  color: var(--navbar-background);
+.docs .box .content,
+.community .box .content {
+  width: 70%;
 }
 
-.camel-project .camel-documentation .links a {
-  color: var(--navbar-background);
-  font-weight: bolder;
+.docs .box img,
+.community .box img {
+  margin-top: 4rem;
+  height: 8vw;
+  max-height: 6rem;
+  margin-right: 0.5rem;
 }
 
-.section {
-  display: inline-flex;
-  border: 1px solid var(--color-smoke-90);
-  width: calc(50% - 3.2rem);
-  flex-direction: column;
-  align-items: center;
+.docs .box .icon {
+  width: 30%;
   text-align: center;
-  padding: 1rem;
-  margin: 1.5rem;
-  border-radius: 10px;
-}
-
-.section > a,
-.camel-project > a {
-  background: none;
-}
-
-.section a > img,
-.camel-project a > img {
-  display: inline-block;
-  width: auto;
-  height: 5rem;
-  margin-top: 1rem;
-}
-
-.section a > img + img {
-  padding-left: 1rem;
 }
 
-.section .description {
-  padding: 1.2rem;
+.docs .box.camel-core .icon,
+.community .box .icon {
+  width: 20%;
   text-align: center;
 }
 
-.section .list {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-}
-
-.section .links {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  margin: 1.5rem 0;
-  word-break: break-word;
-  background-color: var(--color-camel-orange-light);
-  padding: 0 0.5rem;
-  border-radius: 25px;
-  color: var(--navbar-background);
-}
-
-.section .list pre {
-  padding: 0;
-  width: 0.5rem;
-  box-shadow: none;
-  overflow-x: hidden;
-  background: none;
-}
-
-.section .list .links {
-  margin: 0.5rem;
+.icon a,
+a.button-light,
+a.button-dark {
+  background-image: none;
 }
 
-.section .links img {
-  height: 1.5rem;
-  width: 2rem;
-  margin: 0.35rem 0 0 0.25rem;
-}
-
-.section .links p {
-  margin: 0;
-}
-
-.section .links .partition {
-  background: #fff;
-  height: 2.5rem;
-  width: 0.1rem;
-  margin: 0 0.5rem;
-}
-
-.section .links a {
-  color: var(--navbar-background);
-  font-weight: bolder;
+.docs .box.camel-core .content {
+  width: 80%;
 }
 
 @media screen and (max-width: 1023px) {
-  .docs {
+  .docs,
+  .community {
     padding: 0 1rem 4rem;
+    width: 100%;
   }
 
-  .camel-project,
-  .section {
-    width: calc(100% - 1rem);
-    margin: 1.5rem -1.5rem 1.5rem 0.5rem;
+  .docs .box,
+  .community .box,
+  .docs .box .content,
+  .community .box .content,
+  .docs .box .icon,
+  .community .box .icon,
+  .docs .box.camel-core .content,
+  .docs .box.camel-core .icon {
+    flex-direction: column;
+    margin: 0 auto;
+    padding: 0;
+    text-align: center;
+    width: 90%;
   }
 
-  .camel-project .section {
-    width: calc(100% - 3rem);
-    margin: 1.5rem;
+  .docs .box img,
+  .community .box img {
+    height: 6rem;
+    max-width: 25vw;
+    margin: 2.5rem 0.5rem 0;
+  }
+
+  .docs .box.right,
+  .community .box.right {
+    flex-direction: column-reverse;
   }
-}
 
-@media screen and (min-width: 1024px) {
-  .section .description {
-    height: 12rem;
+  .docs .button-light {
+    line-height: 4rem;
   }
 }
diff --git a/antora-ui-camel/src/css/frontpage.css 
b/antora-ui-camel/src/css/frontpage.css
index 4def659..763d198 100644
--- a/antora-ui-camel/src/css/frontpage.css
+++ b/antora-ui-camel/src/css/frontpage.css
@@ -74,30 +74,32 @@ header.frontpage p {
   line-height: 1.7rem;
 }
 
-.frontpage a.button-dark,
-.frontpage a.button-dark:hover {
+a.button,
+section.frontpage a.button {
   white-space: nowrap;
-  padding: 0.7rem 1rem;
-  background-color: var(--color-camel-orange);
-  background-image: none;
-  background-repeat: no-repeat;
-  background-position: 0;
-  color: white;
-  font-weight: bold;
   margin-right: 0.5rem;
+  background-image: none;
   border-radius: 3rem;
-  outline: none;
-  display: inline-block;
-  box-shadow: 0 4px #8e480b;
+  font-weight: bold;
+  padding: 0.4rem 1rem;
 }
 
-.frontpage a.button-light {
+header.frontpage a.button {
   padding: 0.7rem 1rem;
+}
+
+a.button.dark,
+section.frontpage a.button.dark,
+section.frontpage a.button.dark:hover,
+a.button.dark:hover {
+  background-color: var(--color-camel-orange);
+  color: white;
+}
+
+a.button.light,
+a.button.light:hover {
   border: 1px solid var(--color-gray-70);
   color: var(--color-gray-70);
-  font-weight: bold;
-  border-radius: 3rem;
-  white-space: nowrap;
 }
 
 /* css for blog section */
@@ -347,6 +349,11 @@ section.frontpage.projects .project img {
     text-transform: uppercase;
     border-radius: 0;
   }
+
+  a.button,
+  section.frontpage a.button {
+    line-height: 3rem;
+  }
 }
 
 /* css for mobile view */
diff --git a/antora-ui-camel/src/css/site.css b/antora-ui-camel/src/css/site.css
index dfaf4f0..6cd960e 100644
--- a/antora-ui-camel/src/css/site.css
+++ b/antora-ui-camel/src/css/site.css
@@ -22,7 +22,6 @@
 @import 'category.css';
 @import 'release.css';
 @import 'misc.css';
-@import 'community.css';
 @import 'docs.css';
 @import 'sitemap.css';
 @import 'videos.css';
diff --git a/content/_index.md b/content/_index.md
index 2e48f48..d757fde 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -16,7 +16,7 @@ description: Camel is an open source integration framework 
that empowers you to
 
 Camel supports most of the Enterprise Integration Patterns from the excellent 
book by Gregor Hohpe and Bobby Woolf, and newer integration patterns from 
microservice architectures to help you solve your integration problem by 
applying best practices out of the box.
 
-<p><a class="button-dark" 
href="/components/latest/eips/enterprise-integration-patterns.html">Read more 
on EIP</a></p>
+<p><a class="button dark" 
href="/components/latest/eips/enterprise-integration-patterns.html">Read more 
on EIP</a></p>
 
 {{< /div >}}
 
@@ -43,7 +43,7 @@ Camel supports most of the Enterprise Integration Patterns 
from the excellent bo
 
 Apache Camel is standalone, and can be embedded as a library within Spring 
Boot, Quarkus, Application Servers, and in the clouds. Camel subprojects focus 
on making your work easy.
 
-<p><a class="button-dark" href="/docs/">Go to Camel Subprojects</a></p>
+<p><a class="button dark" href="/docs/">Go to Camel Subprojects</a></p>
 
 {{< /div >}}
 
@@ -56,7 +56,7 @@ Apache Camel is standalone, and can be embedded as a library 
within Spring Boot,
 ## Packed with Components
 Packed with several hundred components that are used to access databases, 
message queues, APIs or basically anything under the sun. Helping you integrate 
with everything.
 
-<p><a class="button-dark" href="/components/latest/">Go to Component 
Reference</a></p>
+<p><a class="button dark" href="/components/latest/">Go to Component 
Reference</a></p>
 
 {{< /div >}}
 
@@ -81,7 +81,7 @@ Packed with several hundred components that are used to 
access databases, messag
 ## Supports over 50 Data Formats
 
 Camel supports around 50 data formats, allowing to translate messages in 
multiple formats, and with support from industry standard formats from finance, 
telco, health-care, and more.
-<p><a class="button-dark" href="/components/latest/dataformats/">See Supported 
Formats</a></p>
+<p><a class="button dark" href="/components/latest/dataformats/">See Supported 
Formats</a></p>
 
 {{< /div >}}
 
@@ -105,7 +105,7 @@ Camel supports around 50 data formats, allowing to 
translate messages in multipl
 
 ## Camel Core
 Apache Camel helps you integrate various systems consuming or producing data.
-<p><a class="button-dark" href="/docs/">Read More</a></p>
+<p><a class="button dark" href="/docs/">Read More</a></p>
 
 {{< /div >}}
 
@@ -123,7 +123,7 @@ Apache Camel helps you integrate various systems consuming 
or producing data.
 
 ## Camel K
 Apache Camel K is a lightweight integration framework that runs natively on 
Kubernetes.
-<p><a class="button-dark" href="/docs/">Read More</a></p>
+<p><a class="button dark" href="/docs/">Read More</a></p>
 
 {{< /div >}}
 
@@ -141,7 +141,7 @@ Apache Camel K is a lightweight integration framework that 
runs natively on Kube
 
 ## Camel Quarkus
 Apache Camel Quarkus packages 280+ Camel components as Quarkus extensions.
-<p><a class="button-dark" href="/docs/">Read More</a></p>
+<p><a class="button dark" href="/docs/">Read More</a></p>
 
 {{< /div >}}
 
@@ -160,7 +160,7 @@ Apache Camel Quarkus packages 280+ Camel components as 
Quarkus extensions.
 ## Camel Kafka Connector
 Apache Camel Kafka Connector embeds Camel within Kafka Connect.
 
-<p><a class="button-dark" href="/docs/">Read More</a></p>
+<p><a class="button dark" href="/docs/">Read More</a></p>
 
 {{< /div >}}
 
@@ -178,7 +178,7 @@ Apache Camel Kafka Connector embeds Camel within Kafka 
Connect.
 
 ## Camel Spring Boot
 Apache Camel Spring Boot runs Camel on Spring Boot and provides starters for 
Camel components.
-<p><a class="button-dark" href="/docs/">Read More</a></p>
+<p><a class="button dark" href="/docs/">Read More</a></p>
 
 {{< /div >}}
 
@@ -196,7 +196,7 @@ Apache Camel Spring Boot runs Camel on Spring Boot and 
provides starters for Cam
 
 ## Camel Karaf
 Apache Camel Karaf makes running Apache Camel components to run in the OSGi 
environment.
-<p><a class="button-dark" href="/docs/">Read More</a></p>
+<p><a class="button dark" href="/docs/">Read More</a></p>
 
 {{< /div >}}
 
diff --git a/content/community/_index.md b/content/community/_index.md
index 5c55396..bea11e5 100644
--- a/content/community/_index.md
+++ b/content/community/_index.md
@@ -2,146 +2,134 @@
 Title: "Community"
 ---
 
-{{< div "section" >}}
+{{< div "box" >}}
 
-[![Camel](/_/img/support.svg)](/community/support/)
-
-## Support
+{{< div "icon" >}}
 
-{{< div "description" >}}
-
-If you are experiencing problems using Camel then please report your problem 
to our mailing list. This allows the entire community to help with your 
problem. 
+[![Camel](/_/img/support.svg)](/community/support/)
 
 {{< /div >}}
 
-{{< div "links" >}}
+{{< div "content" >}}
 
-[![Read](/_/img/read.svg)](/community/support/) 
+## Support
 
-{{< div "partition" >}}{{< /div >}}
+If you are experiencing problems using Camel then please report your problem 
to our mailing list. This allows the entire community to help with your 
problem. 
 
-[Read More](/community/support/) 
+<p>
+<a class="button dark" href="/community/support/">Read More</a>
+</p>
 
 {{< /div >}}
 
 {{< /div >}}
 
-{{< div "section" >}}
 
-[![Camel](/_/img/contributing.svg)](/manual/latest/contributing.html)
-
-## Contributing
+{{< div "box" >}}
 
-{{< div "description" >}}
+{{< div "icon" >}}
 
-There are many ways you can help make Camel better - please dive in and 
help!Identify areas you can contribute first. You don’t have to be an expert in 
an area, the Apache Camel developers are available to offer help and guidance.
+[![Camel](/_/img/contributing.svg)](/manual/latest/contributing.html)
 
 {{< /div >}}
 
-{{< div "links" >}}
+{{< div "content" >}}
 
-[![Read](/_/img/read.svg)](/manual/latest/contributing.html)
+## Contributing
 
-{{< div "partition" >}}{{< /div >}}
+There are many ways you can help make Camel better - please dive in and 
help!Identify areas you can contribute first. You don’t have to be an expert in 
an area, the Apache Camel developers are available to offer help and guidance.
 
-[Read More](/manual/latest/contributing.html) 
+<p>
+<a class="button dark" href="/manual/latest/contributing.html">Read More</a>
+</p>
 
 {{< /div >}}
 
 {{< /div >}}
 
+{{< div "box" >}}
 
-{{< div "section" >}}
+{{< div "icon" >}}
 
 [![Camel](/_/img/user-stories.svg)](/community/user-stories/)
 
-## User Stories
-
-{{< div "description" >}}
-
-This page is intended as a place to collect user stories and feedback on 
Apache Camel. If you are using or have tried Apache Camel please add an entry 
or comment; or post to the mailing list.
-
 {{< /div >}}
 
-{{< div "links" >}}
+{{< div "content" >}}
 
-[![Read](/_/img/read.svg)](/community/user-stories/) 
+## User Stories
 
-{{< div "partition" >}}{{< /div >}}
+This page is intended as a place to collect user stories and feedback on 
Apache Camel. If you are using or have tried Apache Camel please add an entry 
or comment; or post to the mailing list.
 
-[Read More](/community/user-stories/) 
+<p>
+<a class="button dark" href="/community/user-stories/">Read More</a>
+</p>
 
 {{< /div >}}
 
 {{< /div >}}
 
-{{< div "section" >}}
-
-[![Camel](/_/img/articles.svg)](/community/articles/)
-
-## Articles
+{{< div "box" >}}
 
-{{< div "description" >}}
+{{< div "icon" >}}
 
-Articles are divided into several sections. As the lists grow, further 
sectioning refinements may be necessary. The article section includes camel 
videos and general articles and other categories. 
+[![Camel](/_/img/articles.svg)](/community/articles/)
 
 {{< /div >}}
 
-{{< div "links" >}}
+{{< div "content" >}}
 
-[![Read](/_/img/read.svg)](/community/articles/) 
+## Articles
 
-{{< div "partition" >}}{{< /div >}}
+Articles are divided into several sections. As the lists grow, further 
sectioning refinements may be necessary. The article section includes camel 
videos and general articles and other categories.
 
-[Read More](/community/articles/) 
+<p>
+<a class="button dark" href="/community/articles/">Read More</a>
+</p>
 
 {{< /div >}}
 
 {{< /div >}}
 
-{{< div "section" >}}
-
-[![Camel](/_/img/books.svg)](/community/books/)
-
-## Books
+{{< div "box" >}}
 
-{{< div "description" >}}
+{{< div "icon" >}}
 
-This page lists the known books about Apache Camel. If you happen to know a 
book which is not listed then please contact us, for example using the 
+[![Camel](/_/img/books.svg)](/community/books/)
 
 {{< /div >}}
 
-{{< div "links" >}}
+{{< div "content" >}}
 
-[![Read](/_/img/read.svg)](/community/books/) 
+## Books
 
-{{< div "partition" >}}{{< /div >}}
+This page lists the known books about Apache Camel. If you happen to know a 
book which is not listed then please contact us.
 
-[Read More](/community/books/) 
+<p>
+<a class="button dark" href="/community/books/">Read More</a>
+</p>
 
 {{< /div >}}
 
 {{< /div >}}
 
-{{< div "section" >}}
-
-[![Camel](/_/img/team.svg)](/community/team/)
-
-## Team
+{{< div "box" >}}
 
-{{< div "description" >}}
+{{< div "icon" >}}
 
-This page lists who we are. By all means add yourself to the list - lets sort 
it in alphabetical order. When posting to the mailing lists, use plain text 
mails. Do not use HTML mails. 
+[![Camel](/_/img/team.svg)](/community/team/)
 
 {{< /div >}}
 
-{{< div "links" >}}
+{{< div "content" >}}
 
-[![Read](/_/img/read.svg)](/community/team/)
+## Team
 
-{{< div "partition" >}}{{< /div >}}
+This page lists who we are. By all means add yourself to the list - lets sort 
it in alphabetical order. When posting to the mailing lists, use plain text 
mails. Do not use HTML mails. 
 
-[Read More](/community/team/) 
+<p>
+<a class="button dark" href="/community/team/">Read More</a>
+</p>
 
 {{< /div >}}
 
diff --git a/content/docs/_index.md b/content/docs/_index.md
index 77f9e63..b214262 100644
--- a/content/docs/_index.md
+++ b/content/docs/_index.md
@@ -1,326 +1,153 @@
 ---
 Title: "Documentation"
 ---
+{{< div "box left camel-core" >}}
 
-{{< div "camel-project" >}}
+{{< div "icon" >}}
 
-[![Camel](/_/img/logo-d.svg)](/manual/latest/)
-
-## Camel Core
-
-{{< div "section core" >}}
-
-{{< div "list" >}}
-{{< div "links" >}}
-
-[![Examples](/_/img/examples.svg)](https://github.com/apache/camel-examples/)
-
-{{< div "partition" >}}{{< /div >}}
-
-[Examples](https://github.com/apache/camel-examples/)
-
-{{< /div >}}
-
-{{< div "links" >}}
-
-[![Sources](/_/img/github.svg)](https://github.com/apache/camel/)
-{{< div "partition" >}}{{< /div >}}
-
-[Source](https://github.com/apache/camel/)
-
-{{< /div >}}
-
-{{< div "links" >}}
-
-[![Documentation](/_/img/docs.svg)](https://www.javadoc.io/doc/org.apache.camel/camel-api/latest/index.html)
-
-{{< div "partition" >}}{{< /div >}}
-
-[API 
Documentation](https://www.javadoc.io/doc/org.apache.camel/camel-api/latest/index.html)
-
-{{< /div >}}
-
-{{< /div >}}
+[![Camel](/_/img/logo-d.svg)](/camel-k/latest/)
 
 {{< /div >}}
 
-{{< div "camel-documentation" >}}
+{{< div "content" >}}
 
-{{< div "section" >}}
-
-### User Manual
-
-{{< div "description" >}}
+## Camel Core
 
 The [User Manual](/manual/latest/) is a comprehensive guide meant to help you 
with the key concepts of Apache Camel and software integration, from how to 
[begin contributing](/manual/latest/contributing.html) to Apache Camel, how to 
[upgrade to Camel 3.x](/manual/latest/camel-3x-upgrade-guide.html), to 
[architecture](/manual/latest/architecture.html) or [integration 
patterns](/components/latest/eips/enterprise-integration-patterns.html).
 
-{{< /div >}}
-
-{{< div "links" >}}
-
-[![Documentation](/_/img/docs.svg)](/manual/latest/)
-
-{{< div "partition" >}}{{< /div >}}
-
-[Documentation](/manual/latest/)
-
-{{< /div >}}
-
-{{< /div >}}
+<p>
+<a class="button dark" href="/manual/latest/">Documentation</a>
+<a class="button light" href="https://github.com/apache/camel/";>Source</a>
+<a class="button light" 
href="https://github.com/apache/camel-examples";>Examples</a>
+</p>
 
-{{< div "section" >}}
-
-
-### Components
-
-{{< div "description" >}}
 
 Camel is packed with several hundred components that are used to access 
databases, message queues and APIs. The [Component 
reference](/components/latest/) provides you information about the 
functionality and configuration of each component.
 
-{{< /div >}}
-
-{{< div "links" >}}
-
-[![Documentation](/_/img/docs.svg)](/components/latest/)
-
-{{< div "partition" >}}{{< /div >}}
-
-[Documentation](/components/latest/)
+<p>
+<a class="button dark" href="/components/latest/">Component Reference</a>
+<a class="button light" 
href="https://www.javadoc.io/doc/org.apache.camel/camel-api/latest/index.html";>API
 Documentation</a>
+</p>
 
 {{< /div >}}
 
 {{< /div >}}
 
-{{< /div >}}
+{{< div "box right" >}}
 
-{{< /div >}}
-
-{{< div "section" >}}
-
-[![Camel](/_/img/logo-d.svg)![Knative](/_/img/knative.svg)](/camel-k/latest/)
+{{< div "content">}}
 
 ## Camel K
 
-{{< div "description" >}}
-
 Apache Camel K is a lightweight integration framework built on Apache Camel 
that runs natively on [Kubernetes](https://kubernetes.io/) and is specifically 
designed for serverless and micro service architectures. It allows you to run 
integration code written in Camel DSL on your cloud.
 
-{{< /div >}}
-
-{{< div "list" >}}
-{{< div "links" >}}
-
-[![Examples](/_/img/examples.svg)](https://github.com/apache/camel-k-examples)
+<p>
+<a class="button dark" href="/camel-k/latest/">Documentation</a>
+<a class="button light" href="https://github.com/apache/camel-k/";>Source</a>
+<a class="button light" 
href="https://github.com/apache/camel-k-examples";>Examples</a>
+</p>
 
-{{< div "partition" >}}{{< /div >}}
-
-[Examples](https://github.com/apache/camel-k-examples)
-
-{{< /div >}}
-
-{{< div "links" >}}
-
-[![Sources](/_/img/github.svg)](https://github.com/apache/camel-k/)
-{{< div "partition" >}}{{< /div >}}
-
-[Source](https://github.com/apache/camel-k/)
-
-{{< /div >}}
-
-{{< div "links" >}}
-
-[![Documentation](/_/img/docs.svg)](/camel-k/latest/)
-
-{{< div "partition" >}}{{< /div >}}
-
-[Documentation](/camel-k/latest/)
-
-{{< /div >}}
-
-{{< /div >}}
 {{< /div >}}
 
-{{< div "section" >}}
+{{< div "icon" >}}
 
-[![Camel](/_/img/logo-d.svg)![Kafka](/_/img/apache-kafka.svg)](/camel-kafka-connector/latest/)
-
-## Camel Kafka Connector
-
-{{< div "description" >}}
-
-Camel Kafka Connector allows you to use all Camel 
[components](/components/latest/) as [Kafka 
Connect](http://kafka.apache.org/documentation/#connect) connectors, which, as 
a result, expands Kafka Connect compatibility by allowing all Camel components 
to be used in the Kafka ecosystem.
+[![Camel](/_/img/logo-d.svg)![Knative](/_/img/knative.svg)](/camel-k/latest/)
 
 {{< /div >}}
 
-{{< div "list" >}}
-{{< div "links" >}}
-
-[![Examples](/_/img/examples.svg)](https://github.com/apache/camel-kafka-connector-examples)
-
-{{< div "partition" >}}{{< /div >}}
-
-[Examples](https://github.com/apache/camel-kafka-connector-examples)
-
 {{< /div >}}
 
-{{< div "links" >}}
+{{< div "box left" >}}
 
-[![Sources](/_/img/github.svg)](https://github.com/apache/camel-kafka-connector/)
-{{< div "partition" >}}{{< /div >}}
+{{< div "icon" >}}
 
-[Source](https://github.com/apache/camel-kafka-connector/)
+[![Camel](/_/img/logo-d.svg)![Knative](/_/img/apache-kafka.svg)](/camel-k/latest/)
 
 {{< /div >}}
 
-{{< div "links" >}}
+{{< div "content">}}
 
-[![Documentation](/_/img/docs.svg)](/camel-kafka-connector/latest/)
-
-{{< div "partition" >}}{{< /div >}}
+## Camel Kafka Connector
 
-[Documentation](/camel-kafka-connector/latest/)
+Camel Kafka Connector allows you to use all [Camel 
components](/components/latest/) as [Kafka 
Connect](http://kafka.apache.org/documentation/#connect) connectors, which, as 
a result, expands Kafka Connect compatibility by allowing all Camel components 
to be used in the Kafka ecosystem.
 
-{{< /div >}}
+<p>
+<a class="button dark" href="/camel-kafka-connector/latest/">Documentation</a>
+<a class="button light" 
href="https://github.com/apache/camel-kafka-connector/";>Source</a>
+<a class="button light" 
href="https://github.com/apache/camel-kafka-connector-examples/";>Examples</a>
+</p>
 
 {{< /div >}}
 
 {{< /div >}}
 
+{{< div "box right" >}}
 
-{{< div "section" >}}
-
-[![Camel](/_/img/logo-d.svg)![Quarkus](/_/img/quarkus.svg)](/camel-quarkus/latest/)
+{{< div "content">}}
 
 ## Camel Quarkus
 
-{{< div "description" >}}
-
 This project hosts the efforts to port and package the 280+ Camel components 
as Quarkus extensions. [Quarkus](https://quarkus.io/) is a Java platform 
offering fast boot times and low memory footprint. It targets both stock JVMs 
and GraalVM.
 
-{{< /div >}}
-
-{{< div "list" >}}
-{{< div "links" >}}
-
-[![Examples](/_/img/examples.svg)](/camel-quarkus/latest/user-guide/examples.html)
-
-{{< div "partition" >}}{{< /div >}}
-
-[Examples](/camel-quarkus/latest/user-guide/examples.html)
+<p>
+<a class="button dark" href="/camel-quarkus/latest/">Documentation</a>
+<a class="button light" 
href="https://github.com/apache/camel-quarkus/";>Source</a>
+<a class="button light" 
href="https://github.com/apache/camel-quarkus/tree/master/examples";>Examples</a>
+</p>
 
 {{< /div >}}
 
-{{< div "links" >}}
-
-[![Sources](/_/img/github.svg)](https://github.com/apache/camel-quarkus/)
-{{< div "partition" >}}{{< /div >}}
-
-[Source](https://github.com/apache/camel-quarkus/)
-
-{{< /div >}}
-
-{{< div "links" >}}
-
-[![Documentation](/_/img/docs.svg)](/camel-quarkus/latest/)
+{{< div "icon" >}}
 
-{{< div "partition" >}}{{< /div >}}
-
-[Documentation](/camel-quarkus/latest/)
+[![Camel](/_/img/logo-d.svg)![Quarkus](/_/img/quarkus.svg)](/camel-quarkus/latest/)
 
 {{< /div >}}
 
 {{< /div >}}
 
-{{< /div >}}
+{{< div "box left" >}}
 
-{{< div "section" >}}
+{{< div "icon" >}}
 
 [![Camel](/_/img/logo-d.svg)![Spring 
Boot](/_/img/spring-boot.svg)](/camel-spring-boot/latest/)
 
-## Camel Spring Boot
-
-{{< div "description" >}}
-
-Camel support for Spring Boot provides auto-configuration of the Camel context 
by auto-detecting Camel routes available in the Spring context and registers 
the key Camel utilities as beans. It also provides starters for many Camel 
components.
-
 {{< /div >}}
 
-{{< div "list" >}}
-{{< div "links" >}}
+{{< div "content">}}
 
-[![Examples](/_/img/examples.svg)](https://github.com/apache/camel-spring-boot-examples)
-
-{{< div "partition" >}}{{< /div >}}
-
-[Examples](https://github.com/apache/camel-spring-boot-examples)
-
-{{< /div >}}
-
-{{< div "links" >}}
-
-[![Sources](/_/img/github.svg)](https://github.com/apache/camel-spring-boot)
-{{< div "partition" >}}{{< /div >}}
-
-[Source](https://github.com/apache/camel-spring-boot)
-
-{{< /div >}}
-
-{{< div "links" >}}
-
-[![Documentation](/_/img/docs.svg)](/camel-spring-boot/latest/)
-
-{{< div "partition" >}}{{< /div >}}
+## Camel Spring Boot
 
-[Documentation](/camel-spring-boot/latest/)
+Camel support for Spring Boot provides auto-configuration of the Camel context 
by auto-detecting Camel routes available in the Spring context and registers 
the key Camel utilities as beans. It also provides starters for many Camel 
components.
 
-{{< /div >}}
+<p>
+<a class="button dark" href="/camel-spring-boot/latest/">Documentation</a>
+<a class="button light" 
href="https://github.com/apache/camel-spring-boot";>Source</a>
+<a class="button light" 
href="https://github.com/apache/camel-spring-boot-examples";>Examples</a>
+</p>
 
 {{< /div >}}
 
 {{< /div >}}
 
+{{< div "box right" >}}
 
-{{< div "section" >}}
-
-[![Camel](/_/img/logo-d.svg)![Karaf](/_/img/apache-karaf.svg)](/camel-karaf/latest/)
+{{< div "content">}}
 
 ## Camel Karaf
 
-{{< div "description" >}}
-
 [Apache Karaf](https://karaf.apache.org/) makes running Apache Camel in 
[OSGi](https://www.osgi.org/) container easy, which as a result, expands Apache 
Camel's compatibility by allowing all Camel components to run in the OSGi 
environment.
 
-{{< /div >}}
-
-{{< div "list" >}}
-{{< div "links" >}}
-
-[![Examples](/_/img/examples.svg)](https://github.com/apache/camel-karaf-examples)
-
-{{< div "partition" >}}{{< /div >}}
-
-[Examples](https://github.com/apache/camel-karaf-examples)
-
-{{< /div >}}
-
-{{< div "links" >}}
-
-[![Sources](/_/img/github.svg)](https://github.com/apache/camel-karaf)
-{{< div "partition" >}}{{< /div >}}
-
-[Source](https://github.com/apache/camel-karaf)
+<p>
+<a class="button dark" href="/camel-karaf/latest/">Documentation</a>
+<a class="button light" href="https://github.com/apache/camel-karaf";>Source</a>
+<a class="button light" 
href="https://github.com/apache/camel-karaf-examples";>Examples</a>
+</p>
 
 {{< /div >}}
 
-{{< div "links" >}}
-
-[![Documentation](/_/img/docs.svg)](/camel-karaf/latest/)
+{{< div "icon" >}}
 
-{{< div "partition" >}}{{< /div >}}
-
-[Documentation](/camel-karaf/latest/)
-
-{{< /div >}}
+[![Camel](/_/img/logo-d.svg)![Karaf](/_/img/apache-karaf.svg)](/camel-karaf/latest/)
 
 {{< /div >}}
 
diff --git a/layouts/index.html b/layouts/index.html
index 52bd257..dbb8196 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -8,7 +8,7 @@
       to quickly and easily integrate various systems consuming or producing 
data.
     </p>
     <p>
-    <a class="button-dark" href="/manual/latest/getting-started.html">Get 
Started</a> <a class="button-light" 
href="/manual/latest/faq/what-is-camel.html">What is Camel?</a>
+    <a class="button dark" href="/manual/latest/getting-started.html">Get 
Started</a> <a class="button light" 
href="/manual/latest/faq/what-is-camel.html">What is Camel?</a>
     </p>
   </div>
   <img alt="Computer with gears depicting data processing" 
src="./img/camel-gears.svg" />

Reply via email to