diff --git a/static/css/custom1.css b/static/css/custom1.css
index 8190af7..1187724 100644
--- a/static/css/custom1.css
+++ b/static/css/custom1.css
@@ -137,26 +137,28 @@ h1#javafx-15-highlights {
padding-bottom: 13px;
}
-.navbar svg {
+.navbar__icon {
width: 24px;
height: 24px;
- fill: #ffffff;
opacity: 0.5;
+
+ /* to white */
+ filter: brightness(0) invert(1);
}
-.navbar svg:hover {
+.navbar__icon:hover {
opacity: 1;
}
@media screen and (max-width: 768px) {
- .navbar svg {
+ .navbar__icon {
width: 24px;
height: 24px;
fill: #000000;
opacity: 0.5;
}
- .navbar svg:hover {
+ .navbar__icon:hover {
fill: #52d3aa;
opacity: 1;
}
diff --git a/static/images/github.svg b/static/images/github.svg
new file mode 100644
index 0000000..2334976
--- /dev/null
+++ b/static/images/github.svg
@@ -0,0 +1 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>
diff --git a/static/js/content.js b/static/js/content.js
index aa5b9ad..b40f971 100644
--- a/static/js/content.js
+++ b/static/js/content.js
@@ -43,6 +43,8 @@
});
};
+ // todo: why is this duplicate with main.js ???
+
// Page Nav
var clickMenu = function() {
$('#navbar a:not([class="external"])').click(function(event){
diff --git a/themes/hugo-elate-theme/layouts/partials/nav.html b/themes/hugo-elate-theme/layouts/partials/nav.html
index 8ad1b6e..979cbfe 100644
--- a/themes/hugo-elate-theme/layouts/partials/nav.html
+++ b/themes/hugo-elate-theme/layouts/partials/nav.html
@@ -49,8 +49,8 @@
{{ end }}
<li>
- <a class="external, icon" href="https://github.com/openjfx/openjfx.github.io">
- <svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>
+ <a class="external icon" target="_blank" href="https://github.com/openjfx/openjfx.github.io">
+ <img class="navbar__icon" src="/images/github.svg" alt="GitHub" title="GitHub" />
</a>
</li>
</ul>
diff --git a/themes/hugo-elate-theme/static/js/main.js b/themes/hugo-elate-theme/static/js/main.js
index 240af21..70c1c12 100644
--- a/themes/hugo-elate-theme/static/js/main.js
+++ b/themes/hugo-elate-theme/static/js/main.js
@@ -2,20 +2,6 @@
'use strict';
-
-
- // iPad and iPod detection
- var isiPad = function(){
- return (navigator.platform.indexOf("iPad") != -1);
- };
-
- var isiPhone = function(){
- return (
- (navigator.platform.indexOf("iPhone") != -1) ||
- (navigator.platform.indexOf("iPod") != -1)
- );
- };
-
// Parallax
var parallax = function() {
$(window).stellar();
@@ -61,28 +47,33 @@
// Page Nav
var clickMenu = function() {
+ document.querySelectorAll('#navbar a').forEach(link => {
+ if (link.classList.contains('external')) {
+ return;
+ }
- $('#navbar a:not([class="external"])').click(function(event){
- var section = $(this).data('nav-section'),
- navbar = $('#navbar');
-
- if ( $('[data-section="' + section + '"]').length ) {
- $('html, body').animate({
- scrollTop: $('[data-section="' + section + '"]').offset().top
- }, 500);
- }
+ link.addEventListener('click', (event) => {
+ event.preventDefault();
- if ( navbar.is(':visible')) {
- navbar.removeClass('in');
- navbar.attr('aria-expanded', 'false');
- $('.js-fh5co-nav-toggle').removeClass('active');
- }
+ const section = link.getAttribute('data-nav-section');
+ const navbar = $('#navbar');
- event.preventDefault();
- return false;
- });
+ const dataSection = $('[data-section="' + section + '"]');
+ if (dataSection.length) {
+ $('html, body').animate({
+ scrollTop: dataSection.offset().top
+ }, 500);
+ }
+ if (navbar.is(':visible')) {
+ navbar.removeClass('in');
+ navbar.attr('aria-expanded', 'false');
+ $('.js-fh5co-nav-toggle').removeClass('active');
+ }
+ return false;
+ });
+ });
};
// Reflect scrolling in navigation