Revert "CAMEL-15185: Footer design" (#440)
This reverts commit 9ecebf5d4531adca2ee4692b2bd1aed50c0a3afa.
diff --git a/antora-ui-camel/src/css/footer.css b/antora-ui-camel/src/css/footer.css
index c67a783..3bae8e3 100644
--- a/antora-ui-camel/src/css/footer.css
+++ b/antora-ui-camel/src/css/footer.css
@@ -19,46 +19,12 @@
footer .footer p {
flex-basis: 100%;
- margin: 3rem 0 0.5rem 0;
+ margin: 0.5rem 0;
padding: 0 1rem;
}
-footer .footer p.remark::after {
- content: '';
- display: block;
- position: relative;
- height: 1px;
- width: 25rem;
- margin: 2rem auto 1rem auto;
- background: var(--footer-after-background);
-}
-
footer .footer a {
- color: var(--footer-font-color);
-}
-
-footer .footer .context {
- display: inline-block;
- margin: 0 0 1rem 0;
-}
-
-footer .footer .context a {
- font-size: 15px;
- text-transform: uppercase;
-}
-
-footer .footer .context a::after {
- content: ' ';
- display: inline-block;
- border-radius: 50%;
- width: 8px;
- height: 8px;
- margin: 0 1rem;
- background: var(--footer-after-background);
-}
-
-footer .footer .context:last-child a::after {
- display: none;
+ color: var(--footer-link-font-color);
}
footer .footer figure.logo {
@@ -66,11 +32,12 @@
flex-grow: 1;
align-items: flex-start;
justify-content: center;
- margin-inline-start: 0;
+ text-align: center;
}
footer .footer figure.logo img {
width: 6rem;
+ height: 100%;
}
footer .footer dl {
@@ -78,11 +45,7 @@
flex-grow: 1;
align-items: flex-start;
justify-content: center;
- margin: 3rem 0 0 1rem;
-}
-
-footer .footer dl:first-child {
- margin-top: 0;
+ margin-left: 1rem;
}
footer .footer dl dt {
@@ -102,14 +65,16 @@
background: var(--footer-font-color);
}
-footer .footer .footer-menu {
- display: block;
-}
-
footer .footer dl dd {
margin: 0;
}
+@media screen and (max-width: 1023px) {
+ footer .footer figure.logo {
+ display: none;
+ }
+}
+
.footer-tools {
position: relative;
top: -2rem;
@@ -125,116 +90,3 @@
border-radius: 0.4rem 0.4rem 0 0;
height: 2rem;
}
-
-footer .footer .break-row-footer {
- display: block;
- flex-basis: 100%;
- height: 0;
-}
-
-footer .footer .footer-icons {
- display: flex;
- align-items: flex-end;
- justify-content: flex-end;
- line-height: 1.6;
- padding: 0.5rem;
- font-weight: bold;
-}
-
-footer .footer .footer-icons .brand-icon {
- height: 2em;
- width: 1.75em;
- margin: 0.35rem;
- fill: var(--navbar-font-color);
-}
-
-footer .footer .show-menu,
-footer .footer .hide-menu {
- display: none;
-}
-
-input[type="checkbox"] {
- width: 0;
- height: 0;
- float: right;
- visibility: hidden;
-}
-
-@media screen and (max-width: 1023px) {
- footer .footer dl {
- flex-basis: 100%;
- margin-top: 2rem;
- }
-
- footer .footer dl dt {
- margin-bottom: 0;
- }
-
- footer .footer figure.logo {
- text-align: center;
- }
-
- footer .footer figure.logo img {
- width: 4.5rem;
- }
-
- footer .footer p.remark::after {
- width: auto;
- }
-
- footer .footer .context a {
- font-size: 13.5px;
- }
-
- footer .footer .context a::after {
- width: 5px;
- height: 5px;
- }
-
- footer .footer .footer-icons .brand-icon {
- height: 1.5rem;
- }
-
- footer .footer .show-menu {
- float: right;
- height: 40px;
- margin-top: -2.5rem;
- }
-
- footer .footer .hide-menu {
- float: right;
- height: 35px;
- margin-top: -2.5rem;
- }
-
- footer .footer .footer-menu {
- margin-top: 1rem;
- }
-
- input[type="checkbox"] + label img.show-menu {
- display: block;
- }
-
- input[type="checkbox"] ~ label img.hide-menu,
- input[type="checkbox"] ~ div.footer-menu {
- display: none;
- }
-
- input[type="checkbox"]:checked + label img.show-menu {
- display: none;
- }
-
- input[type="checkbox"]:checked ~ label img.hide-menu,
- input[type="checkbox"]:checked ~ div.footer-menu {
- display: block;
- }
-
- input[type="checkbox"]:not(:checked) + label img.show-menu {
- display: block;
- }
-
- input[type="checkbox"]:not(:checked) ~ label .hide-menu,
- input[type="checkbox"]:not(:checked) ~ div.footer-menu {
- display: none;
- }
-}
diff --git a/antora-ui-camel/src/css/vars.css b/antora-ui-camel/src/css/vars.css
index e38a678..d8a0edf 100644
--- a/antora-ui-camel/src/css/vars.css
+++ b/antora-ui-camel/src/css/vars.css
@@ -129,9 +129,8 @@
--frontpage-max-width: calc(1366 / var(--rem-base) * 1rem);
/* footer */
--footer-line-height: var(--doc-line-height);
- --footer-background: var(--color-smoke-50);
+ --footer-background: var(--color-smoke-90);
--footer-font-color: var(--color-gray-70);
- --footer-after-background: var(--color-gray-50);
--footer-link-font-color: var(--color-jet-80);
--footer-height: 23rem; /* empirically corresponding current design of the foooter */
/* dimensions */
diff --git a/antora-ui-camel/src/img/hide-footer-menu.svg b/antora-ui-camel/src/img/hide-footer-menu.svg
deleted file mode 100644
index 76a440d..0000000
--- a/antora-ui-camel/src/img/hide-footer-menu.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100" version="1.1">
- <path stroke-width="5" stroke="#000" d="M32.5 50l35 35m0-35l-35 35"/>
-</svg>
\ No newline at end of file
diff --git a/antora-ui-camel/src/img/show-footer-menu.svg b/antora-ui-camel/src/img/show-footer-menu.svg
deleted file mode 100644
index a90c6f0..0000000
--- a/antora-ui-camel/src/img/show-footer-menu.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100" version="1.1">
- <path stroke="#000" stroke-width="5" d="M32.5 50h35M50 32.5v35"/>
-</svg>
\ No newline at end of file
diff --git a/antora-ui-camel/src/partials/footer-content.hbs b/antora-ui-camel/src/partials/footer-content.hbs
index 5afc4a4..12301db 100644
--- a/antora-ui-camel/src/partials/footer-content.hbs
+++ b/antora-ui-camel/src/partials/footer-content.hbs
@@ -3,86 +3,41 @@
</div>
<footer>
<div class="footer">
+ <figure class="logo">
+ <img src="{{siteRootPath}}/_/img/logo-d.svg" class="logo-small mt-60" alt="Apache Camel Logo" aria-label="white silhouette of a camel in front of a sand dune">
+ </figure>
<dl>
- <figure class="logo">
- <img src="{{siteRootPath}}/_/img/logo-d.svg" class="logo-small mt-60" alt="Apache Camel Logo"
- aria-label="white silhouette of a camel in front of a sand dune">
- </figure>
<dt>Overview</dt>
- <input type="checkbox" id="show-overview"/>
- <label for="show-overview"><img class="show-menu" src="{{siteRootPath}}/_/img/show-footer-menu.svg"></label>
- <label for="show-overview"><img class="hide-menu" src="{{siteRootPath}}/_/img/hide-footer-menu.svg"></label>
- <div class="footer-menu">
- <dd><a href="{{siteRootPath}}/blog/">Blog</a></dd>
- <dd><a href="{{siteRootPath}}/docs/">Documentation</a></dd>
- <dd><a href="{{siteRootPath}}/community/support">COmmunity</a></dd>
- <dd><a href="{{siteRootPath}}/download/">Download</a></dd>
- </div>
- </dl>
- <dl>
- <dt>Documentation</dt>
- <input type="checkbox" id="show-docs"/>
- <label for="show-docs"><img class="show-menu" src="{{siteRootPath}}/_/img/show-footer-menu.svg"></label>
- <label for="show-docs"><img class="hide-menu" src="{{siteRootPath}}/_/img/hide-footer-menu.svg"></label>
- <div class="footer-menu">
- <dd><a href="{{siteRootPath}}/manual/latest/">User Manual</a></dd>
- <dd><a href="{{siteRootPath}}/components/latest/index.html">Components</a></dd>
- <dd><a href="{{siteRootPath}}/camel-k/latest/">Camel-K</a></dd>
- <dd><a href="{{siteRootPath}}/camel-kafka-connector/latest/">Camel Kafka Connector</a></dd>
- <dd><a href="{{siteRootPath}}/camel-quarkus/latest/">Camel Quarkus</a></dd>
- <dd><a href="{{siteRootPath}}/camel-spring-boot/latest/">Camel Spring Boot</a></dd>
- <dd><a href="{{siteRootPath}}/camel-karaf/latest/">Camel Karaf</a></dd>
- <dd><a href="{{siteRootPath}}/manual/latest/faq/index.html">FAQ</a></dd>
- </div>
+ <dd><a href="{{siteRootPath}}/blog/">Blog</a></dd>
+ <dd><a href="{{siteRootPath}}/components/latest/">Components</a></dd>
+ <dd><a href="{{siteRootPath}}/download/">Download</a></dd>
+ <dd><a href="{{siteRootPath}}/manual/latest/getting-started.html">Getting started</a></dd>
+ <dd><a href="{{siteRootPath}}/manual/latest/faq/index.html">FAQ</a></dd>
</dl>
<dl>
<dt>Community</dt>
- <input type="checkbox" id="show-community"/>
- <label for="show-community"><img class="show-menu" src="{{siteRootPath}}/_/img/show-footer-menu.svg"></label>
- <label for="show-community"><img class="hide-menu" src="{{siteRootPath}}/_/img/hide-footer-menu.svg"></label>
- <div class="footer-menu">
- <dd><a href="{{siteRootPath}}/community/support/">Support</a></dd>
- <dd><a href="{{siteRootPath}}/manual/latest/contributing.html">Contributing</a></dd>
- <dd><a href="{{siteRootPath}}/manual/latest/mailing-lists.html">Mailing Lists</a></dd>
- <dd><a href="{{siteRootPath}}/community/user-stories/">User stories</a></dd>
- <dd><a href="{{siteRootPath}}/community/articles/">Articles</a></dd>
- <dd><a href="{{siteRootPath}}/community/books/">Books</a></dd>
- <dd><a href="{{siteRootPath}}/community/team/">Team</a></dd>
- </div>
+ <dd><a href="https://www.apache.org/foundation/policies/conduct">Code of conduct</a></d>
+ <dd><a href="{{siteRootPath}}/community/support/">Support</a></dd>
+ <dd><a href="{{siteRootPath}}/manual/latest/contributing.html">Contributing</a></dd>
+ <dd><a href="{{siteRootPath}}/community/user-stories/">User stories</a></dd>
+ <dd><a href="{{siteRootPath}}/community/articles/">Articles</a></dd>
+ <dd><a href="{{siteRootPath}}/community/books/">Books</a></dd>
+ <dd><a href="{{siteRootPath}}/community/team/">Team</a></dd>
</dl>
<dl>
<dt>About</dt>
- <input type="checkbox" id="show-about"/>
- <label for="show-about"><img class="show-menu" src="{{siteRootPath}}/_/img/show-footer-menu.svg"></label>
- <label for="show-about"><img class="hide-menu" src="{{siteRootPath}}/_/img/hide-footer-menu.svg"></label>
- <div class="footer-menu">
- <dd><a href="{{siteRootPath}}/acknowledgments/">Acknowledgments</a></d>
- <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/events/current-event.html" title="Apache Events">Apache Events</a></dd>
- <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/licenses/" title="License">License</a></dd>
- <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/security/" title="Security">Security</a></dd>
- <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/foundation/sponsorship.html" title="Sponsorship">Sponsorship</a></dd>
- <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/foundation/thanks.html" title="Thanks">Thanks</a></dd>
- </div>
+ <dd><a href="{{siteRootPath}}/acknowledgments/">Acknowledgments</a></d>
+ <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/events/current-event.html" title="Apache Events">Apache Events</a></dd>
+ <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/licenses/" title="License">License</a></dd>
+ <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/security/" title="Security">Security</a></dd>
+ <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/foundation/sponsorship.html" title="Sponsorship">Sponsorship</a></dd>
+ <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/foundation/thanks.html" title="Thanks">Thanks</a></dd>
</dl>
- <p class="remark">
+ <p>
© 2004-{{now_year}} The <a href="https://apache.org">Apache Software Foundation</a>.<br>
Apache Camel, Camel, Apache, the Apache feather logo, and the Apache Camel project logo are trademarks of
The Apache Software Foundation. All other marks mentioned may be trademarks or registered trademarks of
their respective owners.
</p>
- <div class="resources">
- <div class="context">
- <a href="{{siteRootPath}}/privacy-policy/">Privacy Policy</a>
- </div>
- <div class="context">
- <a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/foundation/policies/conduct">Code of Conduct</a>
- </div>
- </div>
- <div class="break-row-footer"></div>
- <div id="social-media" class="footer-icons">
- <a rel="noopener noreferrer nofollow" href="https://github.com/apache/camel/" title="Collaborate on GitHub"><svg class="brand-icon"><use xlink:href="{{uiRootPath}}/img/brand-logos.svg#github" /></svg></a>
- <a rel="noopener noreferrer nofollow" href="https://gitter.im/apache/apache-camel" title="Chat on Gitter"><svg class="brand-icon"><use xlink:href="{{uiRootPath}}/img/brand-logos.svg#gitter" /></svg></a>
- <a rel="noopener noreferrer nofollow" href="https://twitter.com/ApacheCamel" title="Follow Apache Camel on Twitter"><svg class="brand-icon"><use xlink:href="{{uiRootPath}}/img/brand-logos.svg#twitter" /></svg></a>
- </div>
</div>
</footer>
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index ab46923..a490a2c 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -6,68 +6,41 @@
</div>
<footer>
<div class="footer">
+ <figure class="logo">
+ <img class="logo" src="/_/img/logo-d.svg" alt="Apache Camel Logo" aria-label="white silhouette of a camel in front of a sand dune">
+ </figure>
+
<dl>
- <figure class="logo">
- <img class="logo" src="/_/img/logo-d.svg" alt="Apache Camel Logo"
- aria-label="white silhouette of a camel in front of a sand dune">
- </figure>
<dt>Overview</dt>
- <input type="checkbox" id="show-overview"/>
- <label for="show-overview"><img class="show-menu" src="/_/img/show-footer-menu.svg"></label>
- <label for="show-overview"><img class="hide-menu" src="/_/img/hide-footer-menu.svg"></label>
- <div class="footer-menu">
- <dd><a href="/blog/">Blog</a></dd>
- <dd><a href="/docs/">Documentation</a></dd>
- <dd><a href="/community/support/">Community</a></dd>
- <dd><a href="/blog/">Download</a></dd>
- </div>
+ <dd><a href="/blog/">Blog</a></dd>
+ <dd><a href="/components/latest/">Components</a></dd>
+ <dd><a href="/download/">Download</a></dd>
+ <dd><a href="/manual/latest/getting-started.html">Getting started</a></dd>
+ <dd><a href="/manual/latest/faq/index.html">FAQ</a></dd>
</dl>
- <dl>
- <dt>Documentation</dt>
- <input type="checkbox" id="show-docs"/>
- <label for="show-docs"><img class="show-menu" src="/_/img/show-footer-menu.svg"></label>
- <label for="show-docs"><img class="hide-menu" src="/_/img/hide-footer-menu.svg"></label>
- <div class="footer-menu">
- <dd><a href="/manual/latest/">User Manual</a></dd>
- <dd><a href="/components/latest/index.html">Components</a></dd>
- <dd><a href="/camel-k/latest/">Camel-K</a></dd>
- <dd><a href="/camel-kafka-connector/latest/">Camel Kafka Connector</a></dd>
- <dd><a href="/camel-quarkus/latest/">Camel Quarkus</a></dd>
- <dd><a href="/camel-spring-boot/latest/">Camel Spring Boot</a></dd>
- <dd><a href="/camel-karaf/latest/">Camel Karaf</a></dd>
- <dd><a href="/manual/latest/faq/index.html">FAQ</a></dd>
- </div>
- </dl>
+
<dl>
<dt>Community</dt>
- <input type="checkbox" id="show-community"/>
- <label for="show-community"><img class="show-menu" src="/_/img/show-footer-menu.svg"></label>
- <label for="show-community"><img class="hide-menu" src="/_/img/hide-footer-menu.svg"></label>
- <div class="footer-menu">
- <dd><a href="/community/support/">Support</a></dd>
- <dd><a href="/manual/latest/contributing.html">Contributing</a></dd>
- <dd><a href="/manual/latest/mailing-lists.html">Mailing Lists</a></dd>
- <dd><a href="/community/user-stories/">User stories</a></dd>
- <dd><a href="/community/articles/">Articles</a></dd>
- <dd><a href="/community/books/">Books</a></dd>
- <dd><a href="/community/team/">Team</a></dd>
- </div>
+ <dd><a href="https://www.apache.org/foundation/policies/conduct">Code of conduct</a></d>
+ <dd><a href="/community/support/">Support</a></dd>
+ <dd><a href="/manual/latest/contributing.html">Contributing</a></dd>
+ <dd><a href="/community/user-stories/">User stories</a></dd>
+ <dd><a href="/community/articles/">Articles</a></dd>
+ <dd><a href="/community/books/">Books</a></dd>
+ <dd><a href="/community/team/">Team</a></dd>
</dl>
+
<dl>
<dt>About</dt>
- <input type="checkbox" id="show-about"/>
- <label for="show-about"><img class="show-menu" src="/_/img/show-footer-menu.svg"></label>
- <label for="show-about"><img class="hide-menu" src="/_/img/hide-footer-menu.svg"></label>
- <div class="footer-menu">
- <dd><a href="/acknowledgments/">Acknowledgments</a></d>
- <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/events/current-event.html" title="Apache Events">Apache Events</a></dd>
- <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/licenses/" title="License">License</a></dd>
- <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/security/" title="Security">Security</a></dd>
- <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/foundation/sponsorship.html" title="Sponsorship">Sponsorship</a></dd>
- <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/foundation/thanks.html" title="Thanks">Thanks</a></dd>
- </div>
+ <dd><a href="/acknowledgments/">Acknowledgments</a></d>
+ <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/events/current-event.html" title="Apache Events">Apache Events</a></dd>
+ <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/licenses/" title="License">License</a></dd>
+ <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/security/" title="Security">Security</a></dd>
+ <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/foundation/sponsorship.html" title="Sponsorship">Sponsorship</a></dd>
+ <dd><a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/foundation/thanks.html" title="Thanks">Thanks</a></dd>
</dl>
- <p class="remark">
+
+ <p>
© 2004-{{ now.Format "2006" }} The <a href="https://apache.org">Apache Software Foundation</a>.<br>
Apache Camel, Camel, Apache, the Apache feather logo, and the Apache Camel project logo are trademarks of
The Apache Software Foundation. All other marks mentioned may be trademarks or registered trademarks of
@@ -76,20 +49,7 @@
<a href="https://netlify.com">This site is powered by Netlify</a>
{{ end }}
</p>
- <div class="resources">
- <div class="context">
- <a href="/privacy-policy/">Privacy Policy</a>
- </div>
- <div class="context">
- <a target="_blank" rel="noopener noreferrer nofollow" href="https://www.apache.org/foundation/policies/conduct">Code of Conduct</a>
- </div>
- </div>
- <div class="break-row-footer"></div>
- <div id="social-media" class="footer-icons">
- <a rel="noopener noreferrer nofollow" href="https://github.com/apache/camel/" title="Collaborate on GitHub"><svg class="brand-icon"><use href="{{ "_/img/brand-logos.svg#github" | relURL }}" /></svg></a>
- <a rel="noopener noreferrer nofollow" href="https://gitter.im/apache/apache-camel" title="Chat on Gitter"><svg class="brand-icon"><use href="{{ "/_/img/brand-logos.svg#gitter" | relURL }}" /></svg></a>
- <a rel="noopener noreferrer nofollow" href="https://twitter.com/ApacheCamel" title="Follow Apache Camel on Twitter"><svg class="brand-icon"><use href="{{ "/_/img/brand-logos.svg#twitter" | relURL }}" /></svg></a>
- </div>
+
</div>
</footer>
<script src="{{ path.Join "_" (index .Site.Data "rev-manifest" "js/vendor/algoliasearch.js") | relURL }}"></script>
