You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@camel.apache.org by zr...@apache.org on 2020/04/08 09:39:00 UTC

[camel-website] branch master updated (3a5aea3 -> e0116c1)

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

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


    from 3a5aea3  Improve search results layout (#317)
     new 4b44260  chore: work done on #270
     new e0116c1  CAMEL-14772: showcase Camel projects

The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 antora-ui-camel/src/css/frontpage.css    | 56 ++++++++++++----------------
 antora-ui-camel/src/img/apache-kafka.svg |  1 +
 antora-ui-camel/src/img/apache-karaf.svg |  1 +
 antora-ui-camel/src/img/knative.svg      |  1 +
 antora-ui-camel/src/img/quarkus.svg      |  1 +
 antora-ui-camel/src/img/spring-boot.svg  |  1 +
 content/_index.md                        | 64 ++++++++++++++++++++++++--------
 7 files changed, 77 insertions(+), 48 deletions(-)
 create mode 100644 antora-ui-camel/src/img/apache-kafka.svg
 create mode 100644 antora-ui-camel/src/img/apache-karaf.svg
 create mode 100644 antora-ui-camel/src/img/knative.svg
 create mode 100644 antora-ui-camel/src/img/quarkus.svg
 create mode 100644 antora-ui-camel/src/img/spring-boot.svg


[camel-website] 02/02: CAMEL-14772: showcase Camel projects

Posted by zr...@apache.org.
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

commit e0116c18a3403819e6e27831f1ca92398d60857f
Author: Zoran Regvart <zr...@apache.org>
AuthorDate: Tue Apr 7 15:29:12 2020 +0200

    CAMEL-14772: showcase Camel projects
    
    This builds on previous work by @jyotiattri to showcase Camel projects
    on the frontpage.
    
    Also removes the border around feature boxes as it makes the design a
    bit busy with the following section.
    
    Ref. https://issues.apache.org/jira/browse/CAMEL-14772
---
 antora-ui-camel/src/css/frontpage.css | 120 ++++++---------------------------
 content/_index.md                     | 123 +++++++++++++++++-----------------
 2 files changed, 84 insertions(+), 159 deletions(-)

diff --git a/antora-ui-camel/src/css/frontpage.css b/antora-ui-camel/src/css/frontpage.css
index bae3313..29feb9f 100644
--- a/antora-ui-camel/src/css/frontpage.css
+++ b/antora-ui-camel/src/css/frontpage.css
@@ -149,31 +149,35 @@ section.frontpage.columns {
 
 section.frontpage.projects {
   display: flex;
-  flex-direction: column;
-  border-top: 1px solid var(--color-smoke-50);
+  flex-flow: wrap;
   padding-top: 3rem;
+  border-top: 1px solid var(--color-smoke-50);
 }
 
 section.frontpage.projects .project {
   display: flex;
-  flex-direction: row;
+  flex: 1 0 33%;
+  flex-direction: column;
+  align-items: center;
+  padding: 1rem;
 }
 
-section.frontpage.projects .project h1 {
-  text-align: right;
-  padding: 0 1rem;
-  flex: 1;
+section.frontpage.projects .project a img {
+  display: inline-block;
+  width: auto;
+  height: 5rem;
 }
 
-section.frontpage.projects .project p {
-  flex: 1;
-  margin: 1rem;
+section.frontpage.projects .project .links {
+  white-space: nowrap;
 }
 
-section.frontpage.projects .project a.significant {
-  margin: 0.5rem 0;
-  padding: 0.4rem 1rem;
-  font-size: 0.8rem;
+section.frontpage.projects .project a img + img {
+  padding-left: 1rem;
+}
+
+section.frontpage.projects .project h1 + p {
+  height: 100%;
 }
 
 section.frontpage.apache {
@@ -220,7 +224,6 @@ section.frontpage h2 {
   padding: 1.8rem;
   text-align: center;
   margin: 1rem;
-  border: 1px solid var(--color-smoke-50);
   height: 100%;
 }
 
@@ -245,7 +248,7 @@ section.frontpage h2 {
 
 @media screen and (max-width: 626px) {
   .split,
-  .homepage .frontpage .platforms {
+  .frontpage {
     flex: 100%;
     margin: 0 1rem;
   }
@@ -260,9 +263,8 @@ section.frontpage h2 {
     padding: 1rem 0;
   }
 
-  .homepage .frontpage .platforms .ProjectImageRight {
-    right: 15%;
-    z-index: 1;
+  section.frontpage.projects .project {
+    flex: 100%;
   }
 }
 
@@ -289,84 +291,4 @@ section.frontpage h2 {
   .box {
     min-width: 51vw;
   }
-
-  section.frontpage.projects .project h1 {
-    text-align: center;
-  }
-
-  section.frontpage.projects .project {
-    flex-direction: column;
-  }
-
-  section.frontpage.projects .project p:nth-child(2) {
-    text-align: center;
-  }
-
-  section.frontpage.projects .project p:nth-child(3) {
-    text-align: center;
-  }
-
-  .frontpage .platforms {
-    flex: 50%;
-  }
-}
-
-section.frontpage.camelProjects {
-  display: flex;
-  flex-wrap: wrap;
-}
-
-.frontpage .platforms {
-  flex: 33%;
-  padding: 0.5rem 0;
-}
-
-.frontpage .platforms div {
-  padding: 0 1rem;
-}
-
-.frontpage .platforms h2 {
-  text-align: center;
-  text-transform: capitalize;
-  width: 100%;
-  color: var(--heading-font-color);
-}
-
-.frontpage .platforms p {
-  text-align: center;
-}
-
-.frontpage .platforms .ProjectImages {
-  position: relative;
-  width: 100%;
-  height: 180px;
-}
-
-.frontpage .platforms .camelImage,
-.frontpage .platforms .ProjectImageRight {
-  width: 6rem;
-  height: 180px;
-  position: absolute;
-}
-
-.frontpage .platforms .ProjectImages img {
-  margin: 10px -3px;
-  padding: 0;
-}
-
-.frontpage .platforms .ProjectImageRight {
-  right: 10%;
-  z-index: 1;
-}
-
-.frontpage .platforms .camelImage {
-  left: 25%;
-}
-
-.frontpage .platforms .camelImagelogo {
-  width: 6rem;
-  margin: 0 auto;
-  position: relative;
-  left: 33%;
-  height: 180px;
 }
diff --git a/content/_index.md b/content/_index.md
index 0873b0c..774f083 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -53,84 +53,87 @@ Camel supports around 50 data formats, allowing to <mark>translate messages</mar
 
 {{< /section >}}
 
-{{< section "frontpage camelProjects" >}}
-# Platforms Camel runs on
-{{< div "platforms" >}}
-{{< div >}}
-{{< div "ProjectImages">}}
-<a class="" href="./camel-k/latest/"> 
-<img src="./_/img/logo-d.svg" class="camelImage" alt="Apache Camel Logo">
-<img src="./_/img/knative.svg" class="ProjectImageRight" alt="Apache Camel K">
-{{< /div >}}
-## Camel K
-</a>
+{{< section "frontpage projects" >}}
+
+{{< div "project" >}}
+
+[![Camel](/_/img/logo-d.svg)![Knative](/_/img/knative.svg)](/camel-k/latest/)
+
+# Camel K
 
 **Apache Camel K** is a lightweight integration framework built from Apache Camel that runs natively on [Kubernetes](https://kubernetes.io/) and is specifically designed for **serverless** and **microservice architectures**.
-{{< /div >}}
-{{< /div >}}
-{{< div "platforms" >}}
-{{< div >}}
-{{< div "ProjectImages">}}
-<a class="" href="./manual/latest/"> 
-<img src="./_/img/logo-d.svg" class="camelImagelogo" alt="Apache Camel Logo">
-{{< /div >}}
-## Camel
-</a>
 
-**Apache Camel** is the *Swiss knife* of integration.
-{{< /div >}}
-{{< /div >}}
-{{< div "platforms" >}}
-{{< div >}}
-{{< div "ProjectImages">}}
-<a class="" href="./camel-quarkus/latest/"> 
-<img src="./_/img/logo-d.svg" class="camelImage" alt="Apache Camel Logo">
-<img src="./_/img/quarkus.svg" class="ProjectImageRight" alt="Camel Quarkus">
+{{< div "links" >}}
+[Documentation](/camel-k/latest/)
 {{< /div >}}
-## Camel Quarkus
-</a>
 
-**Apache Camel Quarkus** is a set of extensions for [Quarkus](https://quarkus.io), a Java platform offering fast boot times and low memory footprint. It targets both stock JVMs and [GraalVM](https://www.graalvm.org/). 
 {{< /div >}}
+
+{{< div "project" >}}
+
+[![Camel](/_/img/logo-d.svg)](/camel/latest/)
+
+# Camel
+
+**Apache Camel** is the *Swiss knife* of integration. 
+
+{{< div "links" >}}
+[Documentation](/manual/latest) | [Components](/components/latest/) | [Patterns](/components/latest/eips/enterprise-integration-patterns.html)
 {{< /div >}}
-{{< div "platforms" >}}
-{{< div >}}
-{{< div "ProjectImages">}}
-<a class="" href="./camel-karaf/latest/"> 
-<img src="./_/img/logo-d.svg" class="camelImage" alt="Apache Camel Logo">
-<img src="./_/img/apache-karaf.svg" class="ProjectImageRight" alt="Camel Karaf">
+
 {{< /div >}}
-## Camel Karaf
-</a>
 
-**Apache Camel Karaf** run Camel in [OSGi](https://www.osgi.org/) container using [Apache Karaf](https://karaf.apache.org/).
+{{< div "project" >}}
+
+[![Camel](/_/img/logo-d.svg)![Quarkus](/_/img/quarkus.svg)](/camel-quarkus/latest/)
+
+# Quarkus
+
+**Apache Camel Quarkus** is a set of extensions for [Quarkus](https://quarkus.io), a Java platform offering fast boot times and low memory footprint. It targets both stock JVMs and [GraalVM](https://www.graalvm.org/).
+
+{{< div "links" >}}
+[Documentation](/camel-quarkus/latest/)
 {{< /div >}}
+
 {{< /div >}}
-{{< div "platforms" >}}
-{{< div >}}
-{{< div "ProjectImages">}}
-<a class="" href="./camel-spring-boot/latest/"> 
-<img src="./_/img/logo-d.svg" class="camelImage" alt="Apache Camel Logo">
-<img src="./_/img/spring-boot.svg" class="ProjectImageRight" alt="Camel Spring Boot">
+
+{{< div "project" >}}
+
+[![Camel](/_/img/logo-d.svg)![Kafka](/_/img/apache-kafka.svg)](/camel-kafka-connector/latest/)
+
+# Kafka
+
+**Apache Camel Kafka Connector** embeds Camel within [Kafka Connect](https://kafka.apache.org/documentation/#connect), enabling declarative use of Camel components as sources or sinks to Kafka topics.
+
+[Documentation](/camel-kafka-connector/latest/)
 {{< /div >}}
-## Camel Spring Boot
-</a>
+
+{{< div "project" >}}
+
+[![Camel](/_/img/logo-d.svg)![Spring Boot](/_/img/spring-boot.svg)](/camel-spring-boot/latest/)
+
+# Spring Boot
 
 **Apache Camel Spring Boot** run Camel on [Spring Boot](https://spring.io/projects/spring-boot).
+
+{{< div "links" >}}
+[Documentation](/camel-spring-boot/latest/)
 {{< /div >}}
+
 {{< /div >}}
-{{< div "platforms" >}}
-{{< div >}}
-{{< div "ProjectImages">}}
-<a class="" href="./camel-kafka-connector/latest/"> 
-<img src="./_/img/logo-d.svg" class="camelImage" alt="Apache Camel Logo">
-<img src="./_/img/apache-kafka.svg" class="ProjectImageRight" alt="Camel Kafka Connector">
-{{< /div >}}
-## Camel Kafka Connector
-</a>
 
-**Apache Camel Kafka Connector** embeds Camel within [Kafka Connect](https://kafka.apache.org/documentation/#connect), enabling declarative use of Camel components as sources or sinks to Kafka topics.
+{{< div "project" >}}
+
+[![Camel](/_/img/logo-d.svg)![Karaf](/_/img/apache-karaf.svg)](/camel-karaf/latest/)
+
+# Karaf
+
+**Apache Camel Karaf** run Camel in [OSGi](https://www.osgi.org/) container using [Apache Karaf](https://karaf.apache.org/).
+
+{{< div "links" >}}
+[Documentation](/camel-karaf/latest/)
 {{< /div >}}
+
 {{< /div >}}
 
 {{< /section >}}


[camel-website] 01/02: chore: work done on #270

Posted by zr...@apache.org.
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

commit 4b442601507b4aaa1bcd4ec03f9e009fe5777842
Author: jyotiattri <36...@users.noreply.github.com>
AuthorDate: Tue Apr 7 13:58:03 2020 +0200

    chore: work done on #270
    
    This is work done by @jyotiattri on pull request #270 to add Camel sub
    projects to the frontpage.
---
 antora-ui-camel/src/css/frontpage.css    |  72 +++++++++++++++++++++-
 antora-ui-camel/src/img/apache-kafka.svg |   1 +
 antora-ui-camel/src/img/apache-karaf.svg |   1 +
 antora-ui-camel/src/img/knative.svg      |   1 +
 antora-ui-camel/src/img/quarkus.svg      |   1 +
 antora-ui-camel/src/img/spring-boot.svg  |   1 +
 content/_index.md                        | 101 ++++++++++++++++++++-----------
 7 files changed, 141 insertions(+), 37 deletions(-)

diff --git a/antora-ui-camel/src/css/frontpage.css b/antora-ui-camel/src/css/frontpage.css
index efd6706..bae3313 100644
--- a/antora-ui-camel/src/css/frontpage.css
+++ b/antora-ui-camel/src/css/frontpage.css
@@ -244,7 +244,8 @@ section.frontpage h2 {
 }
 
 @media screen and (max-width: 626px) {
-  .split {
+  .split,
+  .homepage .frontpage .platforms {
     flex: 100%;
     margin: 0 1rem;
   }
@@ -258,6 +259,11 @@ section.frontpage h2 {
   .box {
     padding: 1rem 0;
   }
+
+  .homepage .frontpage .platforms .ProjectImageRight {
+    right: 15%;
+    z-index: 1;
+  }
 }
 
 @media screen and (max-width: 1023px) {
@@ -299,4 +305,68 @@ section.frontpage h2 {
   section.frontpage.projects .project p:nth-child(3) {
     text-align: center;
   }
+
+  .frontpage .platforms {
+    flex: 50%;
+  }
+}
+
+section.frontpage.camelProjects {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.frontpage .platforms {
+  flex: 33%;
+  padding: 0.5rem 0;
+}
+
+.frontpage .platforms div {
+  padding: 0 1rem;
+}
+
+.frontpage .platforms h2 {
+  text-align: center;
+  text-transform: capitalize;
+  width: 100%;
+  color: var(--heading-font-color);
+}
+
+.frontpage .platforms p {
+  text-align: center;
+}
+
+.frontpage .platforms .ProjectImages {
+  position: relative;
+  width: 100%;
+  height: 180px;
+}
+
+.frontpage .platforms .camelImage,
+.frontpage .platforms .ProjectImageRight {
+  width: 6rem;
+  height: 180px;
+  position: absolute;
+}
+
+.frontpage .platforms .ProjectImages img {
+  margin: 10px -3px;
+  padding: 0;
+}
+
+.frontpage .platforms .ProjectImageRight {
+  right: 10%;
+  z-index: 1;
+}
+
+.frontpage .platforms .camelImage {
+  left: 25%;
+}
+
+.frontpage .platforms .camelImagelogo {
+  width: 6rem;
+  margin: 0 auto;
+  position: relative;
+  left: 33%;
+  height: 180px;
 }
diff --git a/antora-ui-camel/src/img/apache-kafka.svg b/antora-ui-camel/src/img/apache-kafka.svg
new file mode 100644
index 0000000..4c9fb93
--- /dev/null
+++ b/antora-ui-camel/src/img/apache-kafka.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 65.184 105.833" height="400" width="246.363"><path d="M51.387 58.618c-4.121 0-7.816 1.826-10.346 4.701l-6.484-4.59a17.701 17.701 0 001.084-6.06 17.7 17.7 0 00-1.047-5.96l6.469-4.54c2.53 2.86 6.215 4.676 10.324 4.676 7.607 0 13.797-6.189 13.797-13.797 0-7.608-6.19-13.796-13.797-13.796S37.591 25.44 37.591 33.048c0 1.362.205 2.675.575 3.919l-6.474 4.543a17.809 17.809 0 00-11.033-6.412v-7.802c6.25-1.312 10.958-6.865 10.958-13.5C31.617 6.19 [...]
\ No newline at end of file
diff --git a/antora-ui-camel/src/img/apache-karaf.svg b/antora-ui-camel/src/img/apache-karaf.svg
new file mode 100644
index 0000000..3504495
--- /dev/null
+++ b/antora-ui-camel/src/img/apache-karaf.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 115.725 105.833" height="400" width="437.387"><defs><linearGradient gradientTransform="rotate(-65.001 -998.094 -1339.207) scale(.26458)" y2="1395.619" x2="-4570.116" y1="697.555" x1="-5167.096" gradientUnits="userSpaceOnUse" id="a"><stop offset="0" stop-color="#f69923"/><stop offset=".312" stop-color="#f79a23"/><stop offset=".838" stop-color="#e97826"/></linearGradient><linearGradient gradientTransform="rotate(-65.001 -998.094 -1339.20 [...]
\ No newline at end of file
diff --git a/antora-ui-camel/src/img/knative.svg b/antora-ui-camel/src/img/knative.svg
new file mode 100644
index 0000000..a2dcf2f
--- /dev/null
+++ b/antora-ui-camel/src/img/knative.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 131.057 105.833" height="400" width="495.333"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path d="M0 612h792V0H0z"/></clipPath></defs><g transform="matrix(.74438 0 0 -.74438 -53.311 401.97)" clip-path="url(#a)"><path d="M142.88 539.65l-55.512-26.734a3.6 3.6 0 01-1.948-2.442l-13.711-60.07a3.599 3.599 0 01.695-3.046l38.417-48.173a3.6 3.6 0 012.814-1.355h61.616a3.6 3.6 0 012.814 1.355l38.417 48.173c.683.856.939 1.978.695 3.045l [...]
\ No newline at end of file
diff --git a/antora-ui-camel/src/img/quarkus.svg b/antora-ui-camel/src/img/quarkus.svg
new file mode 100644
index 0000000..4bfc539
--- /dev/null
+++ b/antora-ui-camel/src/img/quarkus.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="svg8" version="1.1" viewBox="0 0 105.822 105.833" height="400" width="399.958"><defs id="defs2"><clipPath clipPathUnits="userSpaceOnUse" id="clipPath992"><path d="M0 612h792V0H0z" id="path990"/></clipPath><style id="style1298">.cls-1{fill:#091313}.cls-2{fill:#4695eb}.cls-3{fill:#ff004a}</style></defs><g transform="translate(-77.34 -174.303)" id="layer1"><g id="g6189"><path class="cls-2" id="polygon1318" transform="matrix(.55346 0 0 .55346 76.78 [...]
\ No newline at end of file
diff --git a/antora-ui-camel/src/img/spring-boot.svg b/antora-ui-camel/src/img/spring-boot.svg
new file mode 100644
index 0000000..8c99dc0
--- /dev/null
+++ b/antora-ui-camel/src/img/spring-boot.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 117.9 105.833" height="400" width="445.605"><path d="M116.386 46.564L93.164 6.348C91.148 2.858 86.201 0 82.17 0H35.73c-4.034 0-8.983 2.857-10.995 6.348L1.514 46.564c-2.019 3.495-2.019 9.208 0 12.7l23.221 40.219c2.016 3.49 6.966 6.35 11 6.35h46.434c4.032 0 8.98-2.86 11-6.35l23.217-40.225c2.018-3.486 2.018-9.199 0-12.694zM53.933 22.239a4.788 4.788 0 119.576 0v28.604a4.788 4.788 0 11-9.576 0zM58.72 83.3c-17.896 0-32.458-14.564-32.458-32.4 [...]
\ No newline at end of file
diff --git a/content/_index.md b/content/_index.md
index cced457..0873b0c 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -53,55 +53,84 @@ Camel supports around 50 data formats, allowing to <mark>translate messages</mar
 
 {{< /section >}}
 
-{{< section "frontpage projects" >}}
-{{< div "project" >}}
-# Camel
-
-**Apache Camel** is the *Swiss knife* of integration. 
-
-<a class="significant" href="./manual/latest/">Read the docs</a>
-<a class="significant" href="./components/latest/eips/enterprise-integration-patterns.html">EIP reference</a>
-<a class="significant" href="./components/latest/">Component reference</a>
+{{< section "frontpage camelProjects" >}}
+# Platforms Camel runs on
+{{< div "platforms" >}}
+{{< div >}}
+{{< div "ProjectImages">}}
+<a class="" href="./camel-k/latest/"> 
+<img src="./_/img/logo-d.svg" class="camelImage" alt="Apache Camel Logo">
+<img src="./_/img/knative.svg" class="ProjectImageRight" alt="Apache Camel K">
 {{< /div >}}
-
-{{< div "project" >}}
-# Camel K
+## Camel K
+</a>
 
 **Apache Camel K** is a lightweight integration framework built from Apache Camel that runs natively on [Kubernetes](https://kubernetes.io/) and is specifically designed for **serverless** and **microservice architectures**.
-
-<a class="significant" href="./camel-k/latest/">Read the docs</a>
 {{< /div >}}
-
-{{< div "project" >}}
-# Camel Quarkus
-
-**Apache Camel Quarkus** is a set of extensions for [Quarkus](https://quarkus.io), a Java platform offering fast boot times and low memory footprint. It targets both stock JVMs and [GraalVM](https://www.graalvm.org/).
-
-<a class="significant" href="./camel-quarkus/latest/">Read the docs</a>
 {{< /div >}}
+{{< div "platforms" >}}
+{{< div >}}
+{{< div "ProjectImages">}}
+<a class="" href="./manual/latest/"> 
+<img src="./_/img/logo-d.svg" class="camelImagelogo" alt="Apache Camel Logo">
+{{< /div >}}
+## Camel
+</a>
 
-{{< div "project" >}}
-# Camel Kafka Connector
-
-**Apache Camel Kafka Connector** embeds Camel within [Kafka Connect](https://kafka.apache.org/documentation/#connect), enabling declarative use of Camel components as sources or sinks to Kafka topics.
+**Apache Camel** is the *Swiss knife* of integration.
+{{< /div >}}
+{{< /div >}}
+{{< div "platforms" >}}
+{{< div >}}
+{{< div "ProjectImages">}}
+<a class="" href="./camel-quarkus/latest/"> 
+<img src="./_/img/logo-d.svg" class="camelImage" alt="Apache Camel Logo">
+<img src="./_/img/quarkus.svg" class="ProjectImageRight" alt="Camel Quarkus">
+{{< /div >}}
+## Camel Quarkus
+</a>
 
-<a class="significant" href="./camel-kafka-connector/latest/">Read the docs</a>
+**Apache Camel Quarkus** is a set of extensions for [Quarkus](https://quarkus.io), a Java platform offering fast boot times and low memory footprint. It targets both stock JVMs and [GraalVM](https://www.graalvm.org/). 
+{{< /div >}}
 {{< /div >}}
+{{< div "platforms" >}}
+{{< div >}}
+{{< div "ProjectImages">}}
+<a class="" href="./camel-karaf/latest/"> 
+<img src="./_/img/logo-d.svg" class="camelImage" alt="Apache Camel Logo">
+<img src="./_/img/apache-karaf.svg" class="ProjectImageRight" alt="Camel Karaf">
+{{< /div >}}
+## Camel Karaf
+</a>
 
-{{< div "project" >}}
-# Camel Spring Boot
+**Apache Camel Karaf** run Camel in [OSGi](https://www.osgi.org/) container using [Apache Karaf](https://karaf.apache.org/).
+{{< /div >}}
+{{< /div >}}
+{{< div "platforms" >}}
+{{< div >}}
+{{< div "ProjectImages">}}
+<a class="" href="./camel-spring-boot/latest/"> 
+<img src="./_/img/logo-d.svg" class="camelImage" alt="Apache Camel Logo">
+<img src="./_/img/spring-boot.svg" class="ProjectImageRight" alt="Camel Spring Boot">
+{{< /div >}}
+## Camel Spring Boot
+</a>
 
 **Apache Camel Spring Boot** run Camel on [Spring Boot](https://spring.io/projects/spring-boot).
-
-<a class="significant" href="./camel-spring-boot/latest/">Read the docs</a>
 {{< /div >}}
+{{< /div >}}
+{{< div "platforms" >}}
+{{< div >}}
+{{< div "ProjectImages">}}
+<a class="" href="./camel-kafka-connector/latest/"> 
+<img src="./_/img/logo-d.svg" class="camelImage" alt="Apache Camel Logo">
+<img src="./_/img/apache-kafka.svg" class="ProjectImageRight" alt="Camel Kafka Connector">
+{{< /div >}}
+## Camel Kafka Connector
+</a>
 
-{{< div "project" >}}
-# Camel Karaf
-
-**Apache Camel Karaf** run Camel in [OSGi](https://www.osgi.org/) container using [Apache Karaf](https://karaf.apache.org/).
-
-<a class="significant" href="./camel-karaf/latest/">Read the docs</a>
+**Apache Camel Kafka Connector** embeds Camel within [Kafka Connect](https://kafka.apache.org/documentation/#connect), enabling declarative use of Camel components as sources or sinks to Kafka topics.
+{{< /div >}}
 {{< /div >}}
 
 {{< /section >}}