diff --git a/css/style.css b/css/style.css index 83f2d7d..d26848b 100755 --- a/css/style.css +++ b/css/style.css @@ -26,7 +26,7 @@ body { left: 0; width: 100%; height: 100%; - animation: fade-in 1750ms ease-out forwards; + animation: fade-in 2750ms ease-out forwards; opacity: 0; } @@ -106,9 +106,32 @@ h1 { font-weight: 900; } +.links { + display: flex; + justify-content: space-between; + font-weight: 900; + align-items: center; +} + +a { + color: #ddd; + transition: color 100ms ease; + height: 20px; +} + +a:hover { + color: #eee; +} + p { margin: 0; - font-weight: 900; +} + +svg { + width: 20px; + height: 20px; + border-radius: 3px; + fill: currentColor; } @keyframes fade-in { diff --git a/index.html b/index.html index e1829df..333b225 100755 --- a/index.html +++ b/index.html @@ -6,8 +6,7 @@ Travis Heinström - - + @@ -21,8 +20,29 @@ Travis
Heinström -

travis@heinstrom.com

-

LinkedIn

+ diff --git a/js/main.js b/js/main.js index bcc389f..4248ede 100644 --- a/js/main.js +++ b/js/main.js @@ -128,9 +128,18 @@ }); }; + this.debounceLeaveFn = function (e) { + e.stopPropagation(); + clearTimeout(self.timeout); + self.timeout = setTimeout(() => { + self.mouseleaveFn(); + }, 5); + }; + this.DOM.el.addEventListener("mousemove", this.mousemoveFn); this.DOM.el.addEventListener("mouseleave", this.mouseleaveFn); this.DOM.el.addEventListener("mouseenter", this.mouseenterFn); + this.DOM.el.addEventListener("touchend", this.debounceLeaveFn); }; TiltFx.prototype._layout = function (ev) {