diff --git a/src/assets/js/main.js b/src/assets/js/main.js index 6f2bc6b..d2a78cc 100644 --- a/src/assets/js/main.js +++ b/src/assets/js/main.js @@ -11,113 +11,118 @@ $main = $('#main'); // Breakpoints. - breakpoints({ - xlarge: [ '1281px', '1680px' ], - large: [ '981px', '1280px' ], - medium: [ '737px', '980px' ], - small: [ '481px', '736px' ], - xsmall: [ '361px', '480px' ], - xxsmall: [ null, '360px' ] - }); + breakpoints({ + xlarge: [ '1281px', '1680px' ], + large: [ '981px', '1280px' ], + medium: [ '737px', '980px' ], + small: [ '481px', '736px' ], + xsmall: [ '361px', '480px' ], + xxsmall: [ null, '360px' ] + }); // Play initial animations on page load. - $window.on('load', function() { - window.setTimeout(function() { - $body.removeClass('is-preload'); - }, 100); - }); + $window.on('load', function() { + window.setTimeout(function() { + $body.removeClass('is-preload'); + }, 100); + }); // Nav. - var $nav = $('#nav'); + var $nav = $('#nav'); - if ($nav.length > 0) { + if ($nav.length > 0) { - // Shrink effect. - $main - .scrollex({ - mode: 'top', - enter: function() { - $nav.addClass('alt'); - }, - leave: function() { - $nav.removeClass('alt'); - }, - }); + // Shrink effect. + $main + .scrollex({ + mode: 'top', + enter: function() { + $nav.addClass('alt'); + }, + leave: function() { + $nav.removeClass('alt'); + }, + }); - // Links. - var $nav_a = $nav.find('a'); + // Links. + var $nav_a = $nav.find('a'); + $nav_a + .scrolly({ + speed: 1000, + offset: function() { return $nav.height(); } + }) + .on('click', function() { + + var $this = $(this); + + // External link? Bail. + if ($this.attr('href').charAt(0) != '#') + return; + + // Deactivate all links. $nav_a - .scrolly({ - speed: 1000, - offset: function() { return $nav.height(); } - }) - .on('click', function() { + .removeClass('active') + .removeClass('active-locked'); - var $this = $(this); + // Activate link *and* lock it (so Scrollex doesn't try to activate other links as we're scrolling to this one's section). + $this + .addClass('active') + .addClass('active-locked'); - // External link? Bail. - if ($this.attr('href').charAt(0) != '#') - return; + }) + .each(function() { - // Deactivate all links. - $nav_a - .removeClass('active') - .removeClass('active-locked'); + var $this = $(this), + id = $this.attr('href'), + $section = $(id); - // Activate link *and* lock it (so Scrollex doesn't try to activate other links as we're scrolling to this one's section). - $this - .addClass('active') - .addClass('active-locked'); + // No section for this link? Bail. + if ($section.length < 1) + return; - }) - .each(function() { + // Scrollex. + $section.scrollex({ + mode: 'middle', + initialize: function() { - var $this = $(this), - id = $this.attr('href'), - $section = $(id); + // Deactivate section. + if (browser.canUse('transition')) + $section.addClass('inactive'); - // No section for this link? Bail. - if ($section.length < 1) - return; + }, + enter: function() { - // Scrollex. - $section.scrollex({ - mode: 'middle', - initialize: function() { + // Activate section. + $section.removeClass('inactive'); - // Deactivate section. - if (browser.canUse('transition')) - $section.addClass('inactive'); + // No locked links? Deactivate all links and activate this section's one. + if ($nav_a.filter('.active-locked').length == 0) { - }, - enter: function() { + $nav_a.removeClass('active'); + $this.addClass('active'); - // Activate section. - $section.removeClass('inactive'); + } - // No locked links? Deactivate all links and activate this section's one. - if ($nav_a.filter('.active-locked').length == 0) { + // Otherwise, if this section's link is the one that's locked, unlock it. + else if ($this.hasClass('active-locked')) + $this.removeClass('active-locked'); - $nav_a.removeClass('active'); - $this.addClass('active'); + } + }); - } + }); - // Otherwise, if this section's link is the one that's locked, unlock it. - else if ($this.hasClass('active-locked')) - $this.removeClass('active-locked'); - - } - }); - - }); - - } + } // Scrolly. - $('.scrolly').scrolly({ - speed: 1000 - }); + $('.scrolly').scrolly({ + speed: 1000 + }); + + // Easter Eggs + document.querySelector("span.logo").addEventListener("dblclick", (e) => { + e.currentTarget.classList.toggle("rotated"); + }); })(jQuery); \ No newline at end of file diff --git a/src/assets/sass/layout/_header.scss b/src/assets/sass/layout/_header.scss index b664362..7d72a64 100644 --- a/src/assets/sass/layout/_header.scss +++ b/src/assets/sass/layout/_header.scss @@ -41,6 +41,10 @@ display: block; margin: 0 0 (_size(element-margin) * 0.75) 0; + &.rotated { + transform: rotate(360deg); + } + img { display: block; margin: 0 auto;