diff --git a/landing-pages/site/assets/scss/_scroll-to-top.scss b/landing-pages/site/assets/scss/_scroll-to-top.scss new file mode 100644 index 00000000000..24070cc96d1 --- /dev/null +++ b/landing-pages/site/assets/scss/_scroll-to-top.scss @@ -0,0 +1,42 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +/* Scroll to Top Button Styles */ + +#scrollToTopBtn { + position: fixed; + bottom: 120px; + right: 40px; + background-color: #017cee; + color: white; + border: none; + border-radius: 50%; + width: 50px; + height: 50px; + padding: 0; + font-size: 24px; + cursor: pointer; + display: flex; + justify-content: center; + align-items: center; + opacity: 0; + transition: opacity 0.3s ease-in-out, background-color 0.3s ease, transform 0.2s ease; + z-index: 1000; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); +} \ No newline at end of file diff --git a/landing-pages/site/assets/scss/main-custom.scss b/landing-pages/site/assets/scss/main-custom.scss index 7073ba2c850..8220613d23d 100644 --- a/landing-pages/site/assets/scss/main-custom.scss +++ b/landing-pages/site/assets/scss/main-custom.scss @@ -57,6 +57,7 @@ @import "survey"; @import "testimonial"; @import "suggest-change"; +@import "scroll-to-top"; /* Blog Snippet Section */ .blog-snippet-list { @@ -101,4 +102,4 @@ .blog-snippet-item time { font-size: 0.8rem; opacity: 0.7; -} +} \ No newline at end of file diff --git a/landing-pages/site/layouts/_default/baseof.html b/landing-pages/site/layouts/_default/baseof.html index 8858e75f7c0..ff8b00531ab 100644 --- a/landing-pages/site/layouts/_default/baseof.html +++ b/landing-pages/site/layouts/_default/baseof.html @@ -19,26 +19,30 @@ + {{ partial "head.html" . }} + -
- {{ partial "navbar.html" . }} -
-
- {{ block "animation-header" . }}{{ end }} -
-
- {{ block "main" . }}{{ end }} -
- {{ partial "suggest-change" . }} +
+ {{ partial "navbar.html" . }} +
+
+ {{ block "animation-header" . }}{{ end }} +
+
+ {{ block "main" . }}{{ end }} +
+ {{ partial "suggest-change" . }} + {{ partial "page-scroll-button.html" . }} +
-
-{{ partialCached "footer.html" . }} -{{ partial "scripts.html" . }} + {{ partialCached "footer.html" . }} + {{ partial "scripts.html" . }} {{ with .Site.Data.webpack }} {{ end }} + diff --git a/landing-pages/site/layouts/blog/baseof.html b/landing-pages/site/layouts/blog/baseof.html index 84668775996..96371715118 100644 --- a/landing-pages/site/layouts/blog/baseof.html +++ b/landing-pages/site/layouts/blog/baseof.html @@ -32,6 +32,7 @@ {{ block "main" . }}{{ end }} {{ partial "suggest-change" . }} + {{ partial "page-scroll-button.html" . }}
{{ partialCached "footer.html" . }} diff --git a/landing-pages/site/layouts/community/baseof.html b/landing-pages/site/layouts/community/baseof.html index 6814d9bd5a3..66b721941aa 100644 --- a/landing-pages/site/layouts/community/baseof.html +++ b/landing-pages/site/layouts/community/baseof.html @@ -32,6 +32,7 @@ {{ block "main" . }}{{ end }} {{ partial "suggest-change" . }} + {{ partial "page-scroll-button.html" . }} {{ partialCached "footer.html" . }} diff --git a/landing-pages/site/layouts/docs/baseof.html b/landing-pages/site/layouts/docs/baseof.html index 5742a85d168..2833fb89b89 100644 --- a/landing-pages/site/layouts/docs/baseof.html +++ b/landing-pages/site/layouts/docs/baseof.html @@ -33,6 +33,7 @@ {{ partial "suggest-change" . }} + {{ partial "page-scroll-button.html" . }} {{ partialCached "footer.html" . }} {{ partial "scripts.html" . }} diff --git a/landing-pages/site/layouts/install/baseof.html b/landing-pages/site/layouts/install/baseof.html index 7f46604fb7a..47c9d67d2aa 100644 --- a/landing-pages/site/layouts/install/baseof.html +++ b/landing-pages/site/layouts/install/baseof.html @@ -32,6 +32,7 @@ {{ block "main" . }}{{ end }} {{ partial "suggest-change" . }} + {{ partial "page-scroll-button.html" . }} {{ partialCached "footer.html" . }} diff --git a/landing-pages/site/layouts/meetups/baseof.html b/landing-pages/site/layouts/meetups/baseof.html index 84668775996..96371715118 100644 --- a/landing-pages/site/layouts/meetups/baseof.html +++ b/landing-pages/site/layouts/meetups/baseof.html @@ -32,6 +32,7 @@ {{ block "main" . }}{{ end }} {{ partial "suggest-change" . }} + {{ partial "page-scroll-button.html" . }} {{ partialCached "footer.html" . }} diff --git a/landing-pages/site/layouts/partials/page-scroll-button.html b/landing-pages/site/layouts/partials/page-scroll-button.html new file mode 100644 index 00000000000..91362364bbe --- /dev/null +++ b/landing-pages/site/layouts/partials/page-scroll-button.html @@ -0,0 +1,26 @@ +{{/* +Licensed to the Apache Software Foundation (ASF) under one +or more contributor license agreements. See the NOTICE file +distributed with this work for additional information +regarding copyright ownership. The ASF licenses this file +to you under the Apache License, Version 2.0 (the +"License"); you may not use this file except in compliance +with the License. You may obtain a copy of the License at + +http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, +software distributed under the License is distributed on an +"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +KIND, either express or implied. See the License for the +specific language governing permissions and limitations +under the License. +*/}} + + \ No newline at end of file diff --git a/landing-pages/site/layouts/partials/suggest-change.html b/landing-pages/site/layouts/partials/suggest-change.html index 514b66cacc7..03b5349af97 100644 --- a/landing-pages/site/layouts/partials/suggest-change.html +++ b/landing-pages/site/layouts/partials/suggest-change.html @@ -14,12 +14,13 @@ "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations - under the License. -*/}} + under the License.] + */}}
- {{ $url := printf "https://github.com/apache/airflow-site/edit/main/landing-pages/site/content/%s/%s" $.Site.Language.Lang .Path }} - - {{ partial "buttons/button-with-icon" (dict "text" "Suggest a change on this page" "class" "button-fixed") }} - -
+ {{ $url := printf "https://github.com/apache/airflow-site/edit/main/landing-pages/site/content/%s/%s" + $.Site.Language.Lang .Path }} + + {{ partial "buttons/button-with-icon" (dict "text" "Suggest a change on this page" "class" "button-fixed") }} + + \ No newline at end of file diff --git a/landing-pages/site/layouts/privacy-notice/baseof.html b/landing-pages/site/layouts/privacy-notice/baseof.html index 5742a85d168..2833fb89b89 100644 --- a/landing-pages/site/layouts/privacy-notice/baseof.html +++ b/landing-pages/site/layouts/privacy-notice/baseof.html @@ -33,6 +33,7 @@ {{ partial "suggest-change" . }} + {{ partial "page-scroll-button.html" . }} {{ partialCached "footer.html" . }} {{ partial "scripts.html" . }} diff --git a/landing-pages/site/layouts/roadmap/baseof.html b/landing-pages/site/layouts/roadmap/baseof.html index ca7dcd7b2fb..54bfab985d7 100644 --- a/landing-pages/site/layouts/roadmap/baseof.html +++ b/landing-pages/site/layouts/roadmap/baseof.html @@ -66,6 +66,7 @@ {{ partial "suggest-change" . }} + {{ partial "page-scroll-button.html" . }} {{ partialCached "footer.html" . }} {{ partial "scripts.html" . }} diff --git a/landing-pages/site/layouts/taxonomy/baseof.html b/landing-pages/site/layouts/taxonomy/baseof.html index 84668775996..96371715118 100644 --- a/landing-pages/site/layouts/taxonomy/baseof.html +++ b/landing-pages/site/layouts/taxonomy/baseof.html @@ -32,6 +32,7 @@ {{ block "main" . }}{{ end }} {{ partial "suggest-change" . }} + {{ partial "page-scroll-button.html" . }} {{ partialCached "footer.html" . }} diff --git a/landing-pages/site/layouts/use-cases/baseof.html b/landing-pages/site/layouts/use-cases/baseof.html index 84668775996..96371715118 100644 --- a/landing-pages/site/layouts/use-cases/baseof.html +++ b/landing-pages/site/layouts/use-cases/baseof.html @@ -32,6 +32,7 @@ {{ block "main" . }}{{ end }} {{ partial "suggest-change" . }} + {{ partial "page-scroll-button.html" . }} {{ partialCached "footer.html" . }} diff --git a/landing-pages/src/index.js b/landing-pages/src/index.js index 3b6c772fc76..ff800740068 100644 --- a/landing-pages/src/index.js +++ b/landing-pages/src/index.js @@ -27,6 +27,7 @@ import "./js/progressTracking"; import "./js/rating"; import "./js/makeTableResponsive"; import "./js/versionSelector"; +import "./js/scroll-to-top"; if (document.querySelector("#search")) { import(/* webpackChunkName: "search" */ "./js/searchBlogPosts"); diff --git a/landing-pages/src/js/scroll-to-top.js b/landing-pages/src/js/scroll-to-top.js new file mode 100644 index 00000000000..3998427f180 --- /dev/null +++ b/landing-pages/src/js/scroll-to-top.js @@ -0,0 +1,77 @@ +/** + * Licensed to the Apache Software Foundation (ASF) under one + * or more contributor license agreements. See the NOTICE file + * distributed with this work for additional information + * regarding copyright ownership. The ASF licenses this file + * to you under the Apache License, Version 2.0 (the + * "License"); you may not use this file except in compliance + * with the License. You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + + +// Enabled button with 1000px threshold +const scrollToTopBtn = document.getElementById('scrollToTopBtn'); +const scrollThreshold = 1000; + +function toggleScrollToTopButton() { + if (!scrollToTopBtn) return; + + const scrollPosition = document.documentElement.scrollTop || document.body.scrollTop; + + if (scrollPosition <= scrollThreshold) { + if (scrollToTopBtn.style.opacity !== '0' && scrollToTopBtn.style.display !== 'none') { + scrollToTopBtn.style.opacity = '0'; + setTimeout(() => scrollToTopBtn.style.display = 'none', 300); + } + } else { + if (scrollToTopBtn.style.display === 'none') { + scrollToTopBtn.style.display = 'flex'; + setTimeout(() => scrollToTopBtn.style.opacity = '1', 10); + } + } +} + +function scrollToTop() { + window.scrollTo({ + top: 0, + behavior: 'smooth' + }); +} + +window.addEventListener('scroll', toggleScrollToTopButton); +scrollToTopBtn.addEventListener('click', scrollToTop); + +scrollToTopBtn.onmouseover = function () { + this.style.backgroundColor = '#0056b3'; + this.style.transform = 'scale(1.1)'; +}; + +scrollToTopBtn.onmouseout = function () { + this.style.backgroundColor = '#007bff'; + this.style.transform = 'scale(1)'; +}; + +scrollToTopBtn.addEventListener('mousedown', function () { + this.style.border = '1.5px solid lightgreen'; +}); +scrollToTopBtn.addEventListener('mouseup', function () { + this.style.border = 'none'; +}); + +scrollToTopBtn.addEventListener('focus', function () { + this.style.outline = '1px solid lightblue'; +}); +scrollToTopBtn.addEventListener('blur', function () { + this.style.outline = 'none'; +}); + +toggleScrollToTopButton(); \ No newline at end of file diff --git a/landing-pages/yarn.lock b/landing-pages/yarn.lock index 0d832e8ee94..caf7cb4a12c 100644 --- a/landing-pages/yarn.lock +++ b/landing-pages/yarn.lock @@ -7547,4 +7547,4 @@ yocto-queue@^1.0.0: zod@^3.25.51: version "3.25.76" resolved "https://registry.npmjs.org/zod/-/zod-3.25.76.tgz" - integrity sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ== + integrity sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ== \ No newline at end of file