From adb398b87ae4fba89c7b07b72a0e88aa4975d3ed Mon Sep 17 00:00:00 2001 From: s1nical <50817549+s1nical@users.noreply.github.com> Date: Mon, 29 Jul 2019 15:44:18 -0700 Subject: Basically update the whole site lol --- .gitignore | 1 + 404.html | 30 +++--- cars/index.html | 50 ++++++---- css/main.css | 85 ++++++++++++---- dino/index.html | 40 ++++---- doge/index.html | 32 +++--- index.html | 290 ++++++++++++++++--------------------------------------- js/app.js | 237 +++++++++++++++++---------------------------- login/index.html | 24 ++--- 9 files changed, 332 insertions(+), 457 deletions(-) diff --git a/.gitignore b/.gitignore index 344b8d6..1cead73 100644 --- a/.gitignore +++ b/.gitignore @@ -15,6 +15,7 @@ .env.development.local .env.test.local .env.production.local +.vscode npm-debug.log* yarn-debug.log* diff --git a/404.html b/404.html index 8ed330f..b35ba42 100644 --- a/404.html +++ b/404.html @@ -1,23 +1,23 @@ - - - - s1nical - 404 - - + + + + s1nical - 404 + + - + +
+

404

+

Uh, Ohh

+

Sorry we cant find what you are looking for 'cos its so dark in here

+
-
-

404

-

Uh, Ohh

-

Sorry we cant find what you are looking for 'cos its so dark in here

-
-
+
- + - + diff --git a/cars/index.html b/cars/index.html index fbf05be..164036d 100644 --- a/cars/index.html +++ b/cars/index.html @@ -1,23 +1,31 @@ + + + + + + + + - - - + + + - + + + + diff --git a/css/main.css b/css/main.css index 4d28317..51d7c69 100644 --- a/css/main.css +++ b/css/main.css @@ -1,23 +1,22 @@ -body { - background: none; - } - .bobAnimate-container { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%,-50%); - width: 375px; - } - .inline { - display: inline-block; - } - #bobAnimate { - margin-left: 5px; - transition-timing-function: ease-in-out; - transition: margin-left 2s; - } +/* There isn't actually errors, VSCode is being dumb >:( */ + +/* BACKGROUND SPARKLES CSS */ +html, body { + margin: 0 0; + padding: 0 0; + text-align: center; + font-size: 0; + background-color: #fdfcf3; +} -/* Loader */ +body svg { + position: absolute; + top: 0; + left: 0; + z-index: -1; +} + +/* LOADING ANIMATION */ /* body { text-align: center; @@ -65,8 +64,6 @@ body { } } - - .loader row:nth-child(1) span:nth-child(1) { -webkit-animation-delay: .50s; } .loader row:nth-child(1) span:nth-child(2) { -webkit-animation-delay: .70s; } .loader row:nth-child(1) span:nth-child(3) { -webkit-animation-delay: .60s; } @@ -77,8 +74,54 @@ body { .loader row:nth-child(3) span:nth-child(2) { -webkit-animation-delay: .30s; } .loader row:nth-child(3) span:nth-child(3) { -webkit-animation-delay: .40s; } +/* ORINGINAL SITE CSS */ +html { + box-sizing: border-box; + display: flex; + justify-content: center; + user-select: none; + -webkit-tap-highlight-color: transparent; +} +*, *:before, *:after { + box-sizing: inherit; +} +html, body { + height: 100%; +} +body { + font: normal 20px/1.4 'Inter', sans-serif; + margin: 0 1em; + padding: 1em 0; + color: #000; + background: none; + display: flex; +} + +@supports (font-variation-settings: normal) { + body { + font-family: 'Inter var', sans-serif; + } +} +main { + margin: auto; + font-size: 6vh; + line-height: 1.2; + max-width: 75vh; +} + +a { + color: inherit; + text-decoration: none; + background: #ffdc73; /* hsl(200, 100%, 80% */ +} +a:hover, +a:focus { + outline: none; + background: #282936; + color: #fff; +} \ No newline at end of file diff --git a/dino/index.html b/dino/index.html index 4e0f551..2ed2ed4 100644 --- a/dino/index.html +++ b/dino/index.html @@ -8,27 +8,27 @@ - -
-
-
+ +
+
+
+
+
+ + + +
-
- - - -
-
- + - - - + + + \ No newline at end of file diff --git a/doge/index.html b/doge/index.html index 1ae2f87..d0f02bc 100644 --- a/doge/index.html +++ b/doge/index.html @@ -8,23 +8,23 @@ - -
-
-
+ +
+
+
+
-
- -
-
-
+ +
+
+
+
-
- -
-
-
+ +
+
+
+
-
- + \ No newline at end of file diff --git a/index.html b/index.html index 49304fb..957b050 100644 --- a/index.html +++ b/index.html @@ -1,212 +1,92 @@ - + + + + + + + + + + + + + + + + + - - - - s1nical - About Me - - - - - - - - - - - - - - - - - - -
- s1nical
- Full-stack developer.

- Follow me on Twitter. - View my code on GitHub. + s1nical
+ Full-stack developer.

+ Follow me on Twitter. + View my code on GitHub.
- - -
-
-
- - - - - - - - - - - - - - - - -
-
- - -
-
- - -
-
- - - - - - - - - - - - - - - -
+ - + +
+
+ + + + + + + + + + + + + + + +
+
+ + diff --git a/js/app.js b/js/app.js index b943d69..308a55d 100644 --- a/js/app.js +++ b/js/app.js @@ -1,149 +1,90 @@ -window.onload = ()=>{ - animate() +// LOADER ANIM +$(window).on("load",function(){ + $(".loader-wrapper").fadeOut("slow"); +}) + +// BACKGROUND SPARKLES +// SCRIPT #1 + +// set up the base pattern +var pattern = Trianglify({ + height: window.innerHeight, // White: #fdfbfb, Salmon: #cc3300 + width: window.innerWidth, + x_colors: ['#040404', '#f9f9f9', '#fffff4', '#fbf7f5', '#d55454'], // Cappuccino: ['#854442', '#3c2f2f', '#fff4e6', '#be9b7b', '#4b3832'] + y_colors: ['#f9f1f1', '#f9f9f9', '#fffff4', '#fbf7f5', '#f9f1f1'], + variance: 10, + seed: '666', + cell_size: 160}); + +// // canvas +// document.body.appendChild(pattern.canvas()) + +// svg +document.body.appendChild(pattern.svg()) + + + +// // png +// var png = document.createElement('img') +// png.src = pattern.png() +// document.body.appendChild(png) + +// SCRIPT #2 + +$('.title-wrapper').css('width', window.innerWidth); +$('.title-wrapper').css('height', window.innerHeight); + + +var time = 10, + $paths = $('body').find('svg').find('path'), + pathCollection = $paths.get(), + count = $paths.length; + +console.log(count); + +pathCollection.sort(function() { + return Math.random()*10 > 5 ? 1 : -1; +}); + +function showText(){ +var title = $('h1'), + subtitle = $('h2'); + +title.removeClass('hidden'); +setTimeout( function(){ + subtitle.removeClass('hidden'); +}, 500); +} + +setTimeout( function(){ +$.each(pathCollection,function(i,el) { + var $path = $(this); + setTimeout( function(){ + + $path.css('opacity','1'); + }, time) + time += 10; + + if (i+1 === count) { + setTimeout( function(){ + showText(); + }, 2000); +} + +}); +}, 2000); + +// LOADER ANIMATION END FOR WINDOW LOAD +$(window).on("load",function(){ + $(".loader-wrapper").fadeOut("slow"); +}) + +// HONESTLY I HAVE NO IDEA WHAT THIS IS BUT IT WAS IN THE ORIGINAL SRC +(async () => { + if( navigator.webdriver || document.visibilityState === 'prerender' || !location.hostname ) + { + return; } - - function animate() { - animateFrame( "bobAnimate", 70, [ - { // run right - move: ()=>{ bobAnimate.style.marginLeft = "300px" }, - frames: [ bob_right, bob_right_walk1, bob_right_walk2 ], - delay: 100, - limitFrames: 15, - }, - { // stop blink , blink - frames: [ bob_right_blink, bob_right, bob_right_blink, bob_right, bob_left ], - delay: 150, - limitFrames: 5, - }, - { // turn left, blink - frames: [ bob_left_blink, bob_left ], - delay: 500, - limitFrames: 2, - }, - { // run left - move: ()=>{ bobAnimate.style.marginLeft = "80px" }, - frames: [ bob_left_walk1, bob_left_walk2, bob_left ], - delay: 100, - limitFrames: 15 - }, - { // stop blink - frames: [ bob_left, bob_left_blink, bob_left ], - delay: 500, - limitFrames: 3, - }, - { // turn & blink, blink - frames: [ bob_right, bob_right_blink, bob_right, bob_right_blink, bob_right ], - delay: 100, - limitFrames: 5, - }, - { // run right - move: ()=>{ bobAnimate.style.marginLeft = "200px" }, - frames: [ bob_right, bob_right_walk1, bob_right_walk2 ], - delay: 100, - limitFrames: 13, - }, - { // turn, turn, turn - frames: [ bob_left, bob_right, bob_left ], - delay: 250, - limitFrames: 3, - }, - { // angry, angry - frames: [ bob_left_angry, bob_left, bob_left_angry, bob_left ], - delay: 150, - limitFrames: 4, - }, - { // run left - move: ()=>{ bobAnimate.style.marginLeft = "0px" }, - frames: [ bob_left_walk1, bob_left_walk2, bob_left ], - delay: 100, - limitFrames: 15 - }, - { // turn slow, blnk slow - frames: [ bob_right, bob_right_blink, bob_right ], - delay: 1000, - limitFrames: 3, - }, - { // RESTART - move: ()=>{ animate() }, frames: [], delay: 0, limitFrames: 0 - }, - ]) - } - - function buildFrame(elmId, frameWidth, frame) { - const pW = frameWidth/8 - const elm = document.getElementById(elmId) - elm.innerHTML = ` - - - - - - - - - - - - - - - - - ` - setPixels(elmId, frame) - } - - function setPixels(elmId, frame) { - const g = document.getElementById("g-"+elmId) - g.innerHTML = "" - frame.pixels.map( p => { - g.innerHTML += /*html*/` - - - ` - }) - } - - function animateFrame(elmId, size, anime){ - - buildFrame("bobAnimate", size, anime[0].frames[0]) - anime[0].frames.push(anime[0].frames[0]) - anime[0].frames.shift() - - const g = document.getElementById("g-"+elmId) - - function animate(anime) { - - const int = setInterval(function(){ - if (anime[0].limitFrames === 0) { - clearInterval(int) - anime.shift() - if (anime.length > 0) { - if (anime[0].move) anime[0].move() - animate(anime) - } - } else { - setPixels(elmId, anime[0].frames[0]) - anime[0].frames.push(anime[0].frames[0]) - anime[0].frames.shift() - anime[0].limitFrames-- - } - }, anime[0].delay) - - } - - if (anime[0].move) anime[0].move() - animate(anime) - - } - \ No newline at end of file + + document.querySelector( 'a[href="/cdn-cgi/l/email-protection"]' ).href = `\x6dailto:hi\x40${location.hostname}`; +})(); \ No newline at end of file diff --git a/login/index.html b/login/index.html index 88eb7eb..8d8e1a3 100644 --- a/login/index.html +++ b/login/index.html @@ -7,17 +7,17 @@ s1nical - Hidden 404 - -
-
-

The page you are looking for cannot be found, follow this link to go back to the archive index, or press "back" in your browser to return to a previously known page.

-

La página que estás buscando no puede ser encontrada, sigue éste enlace para volver al índice del archivo, o usa el botón de "volver" en tu navegador para regresar a la última página conocida.

-

La page que vous recherchez ne peut être trouvée, suivez ce lien pour revenir à l'index de l'archive, ou appuyez sur "retour" dans votre navigateur pour revenir à une page précédemment connu.

-

Die Seite, die Sie suchen, kann nicht gefunden werden, folgen Sie diesem Link zum Archiv Index zurück zu gehen, oder drücken Sie "wieder" in Ihren Browser auf eine bereits bekannte Seite zurückzukehren.

-

La pagina che stai cercando non può essere trovato, segui questo link per tornare all'indice archivio, oppure "premere" di nuovo nel tuo browser per tornare alla pagina precedentemente conosciuto.

-

あなたは見つけることができません探しているページは、以前から知られているページに戻るに戻ってブラウザでこのアーカイブインデックスに戻るためのリンク、またはプレスに従ってください。

-

您正在寻找无法找到该网页,请点击此链接返回到存档的索引,或者按回到你的浏览器“返回”到先前已知网页。

+ +
+
+

The page you are looking for cannot be found, follow this link to go back to the archive index, or press "back" in your browser to return to a previously known page.

+

La página que estás buscando no puede ser encontrada, sigue éste enlace para volver al índice del archivo, o usa el botón de "volver" en tu navegador para regresar a la última página conocida.

+

La page que vous recherchez ne peut être trouvée, suivez ce lien pour revenir à l'index de l'archive, ou appuyez sur "retour" dans votre navigateur pour revenir à une page précédemment connu.

+

Die Seite, die Sie suchen, kann nicht gefunden werden, folgen Sie diesem Link zum Archiv Index zurück zu gehen, oder drücken Sie "wieder" in Ihren Browser auf eine bereits bekannte Seite zurückzukehren.

+

La pagina che stai cercando non può essere trovato, segui questo link per tornare all'indice archivio, oppure "premere" di nuovo nel tuo browser per tornare alla pagina precedentemente conosciuto.

+

あなたは見つけることができません探しているページは、以前から知られているページに戻るに戻ってブラウザでこのアーカイブインデックスに戻るためのリンク、またはプレスに従ってください。

+

您正在寻找无法找到该网页,请点击此链接返回到存档的索引,或者按回到你的浏览器“返回”到先前已知网页。

+
-
- + \ No newline at end of file -- cgit v1.2.3