diff --git a/100_projects/responsive-404-page-not-found/assets/css/styles.css b/100_projects/responsive-404-page-not-found/assets/css/styles.css deleted file mode 100644 index cf2d2ce..0000000 --- a/100_projects/responsive-404-page-not-found/assets/css/styles.css +++ /dev/null @@ -1,241 +0,0 @@ -/*=============== GOOGLE FONTS ===============*/ -@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&display=swap"); -:root { - --header-height: 3.5rem; - --first-color: #d5cabd; - --text-color: #2f4858; - --body-font: 'Space Grotesk', sans-serif; - --biggest-font-size: 2.375rem; - --normal-font-size: .938rem; - --smaller-font-size: .75rem; -} -@media screen and (min-width: 1024px) { - :root { - --biggest-font-size: 5rem; - --normal-font-size: 1rem; - --smaller-font-size: .813rem; - } -} -* { - box-sizing: border-box; - padding: 0; - margin: 0; -} -body { - font-family: var(--body-font); - font-size: var(--normal-font-size); - font-weight: 500; - color: var(--text-color); -} -ul { - list-style: none; -} -a { - text-decoration: none; -} -img { - max-width: 100%; - height: auto; -} -.container { - max-width: 1024px; - margin-left: 1.5rem; - margin-right: 1.5rem; -} -.main { - overflow: hidden; /* For the animations ScrollReveal */ -} -.header { - position: fixed; - width: 100%; - background-color: transparent; - top: 0; - left: 0; - z-index: 100; -} -.nav { - height: var(--header-height); - display: flex; - justify-content: space-between; - align-items: center; -} -.nav__logo, -.nav__toggle { - color: var(--text-color); - display: inline-flex; -} -.nav__logo { - font-weight: 700; - display: flex; - justify-content: center; - align-items: center; - gap: 5px; - font-size: 21px; - transition: .3s; -} -.nav__logo:hover{ - color:#fff; -} -.nav__toggle { - font-size: 1.25rem; - cursor: pointer; -} -@media screen and (max-width: 767px) { - .nav__menu { - position: fixed; - background-color: var(--first-color); - left: 0; - top: -100%; - width: 100%; - padding: 5rem 0 4rem; - border-radius: 0 0 1.5rem 1.5rem; - box-shadow: 0 2px 4px hsla(38, 4%, 15%, .15); - transition: .4s; - } -} -.nav__list { - text-align: center; - display: flex; - flex-direction: column; - row-gap: 2rem; -} -.nav__link { - color: var(--text-color); -} -.nav__close { - position: absolute; - top: 1rem; - right: 1.5rem; - font-size: 1.5rem; - color: var(--text-color); - cursor: pointer; -} -.show-menu { - top: 0; -} -.home { - background-color: var(--first-color); - padding: 9rem 0 2rem; - height: 100vh; - display: grid; -} -.home__container { - display: grid; - align-content: center; - row-gap: 2.5rem; -} -.home__data { - text-align: center; -} -.home__title { - font-size: var(--biggest-font-size); - margin: .75rem 0; -} -.home__button { - margin-top: 2rem; - display: inline-block; - background-color: var(--text-color); - color: #fff; - padding: .80rem 1.5rem; - border-radius: 3rem; - transition: .4s; -} -.home__button:hover { - box-shadow: 0 4px 12px hsla(38, 69%, 8%, .2); -} -.home__img img { - width: 230px; - animation: floaty 1.8s infinite alternate; -} -.home__img { - justify-self: center; -} -.home__shadow { - width: 130px; - height: 24px; - background-color: hsla(38, 21%, 19%, .16); - margin: 0 auto; - border-radius: 50%; - filter: blur(7px); - animation: shadow 1.8s infinite alternate; -} -.home__footer { - display: flex; - justify-content: center; - column-gap: .5rem; - font-size: var(--smaller-font-size); - align-self: flex-end; -} -@keyframes floaty { - 0% { - transform: translateY(0); - } - 100% { - transform: translateY(15px); - } -} - -@keyframes shadow { - 0% { - transform: scale(1, 1); - } - 100% { - transform: scale(.85, .85); - } -} -@media screen and (max-width: 320px) { - .home { - padding-top: 7rem; - } -} -@media screen and (min-width: 767px) { - .nav { - height: calc(var(--header-height) + 1.5rem); - } - .nav__toggle, - .nav__close { - display: none; - } - .nav__list { - flex-direction: row; - column-gap: 3.5rem; - } -} -@media screen and (min-width: 1024px) { - .home__container { - grid-template-columns: repeat(2, 1fr); - align-items: center; - column-gap: 2rem; - } - .home__data { - text-align: initial; - } - .home__img img { - width: 400px; - } - .home__shadow { - width: 250px; - height: 40px; - } -} -@media screen and (min-width: 1048px) { - .container { - margin-left: auto; - margin-right: auto; - } -} -@media screen and (min-width: 2048px) { - body { - zoom: 1.7; - } - - .home { - height: initial; - row-gap: 4rem; - } -} -@media screen and (min-width: 3840px) { - body { - zoom: 3.1; - } -} \ No newline at end of file diff --git a/100_projects/responsive-404-page-not-found/assets/img/ghost-img.png b/100_projects/responsive-404-page-not-found/assets/img/ghost-img.png deleted file mode 100644 index 1261dc1..0000000 Binary files a/100_projects/responsive-404-page-not-found/assets/img/ghost-img.png and /dev/null differ diff --git a/100_projects/responsive-404-page-not-found/assets/js/main.js b/100_projects/responsive-404-page-not-found/assets/js/main.js deleted file mode 100644 index e968e49..0000000 --- a/100_projects/responsive-404-page-not-found/assets/js/main.js +++ /dev/null @@ -1,37 +0,0 @@ -/*=============== SHOW MENU ===============*/ -const navMenu = document.getElementById('nav-menu'), - navToggle = document.getElementById('nav-toggle'), - navClose = document.getElementById('nav-close') - -/*MENU SHOW*/ -if(navToggle){ - navToggle.addEventListener('click', () =>{ - navMenu.classList.add('show-menu') - }) -} - -/*MENU HIDDEN */ -if(navClose){ - navClose.addEventListener('click', () =>{ - navMenu.classList.remove('show-menu') - }) -} - -/*REMOVE MENU MOBILE*/ -const navLink = document.querySelectorAll('.nav__link') - -function linkAction(){ - const navMenu = document.getElementById('nav-menu') - // When we click on each nav__link, we remove the show-menu class - navMenu.classList.remove('show-menu') -} -navLink.forEach(n => n.addEventListener('click', linkAction)) - -/*SCROLL REVEAL ANIMATION*/ -const sr = ScrollReveal({ - distance: '90px', - duration: 3000, -}) -sr.reveal(`.home__data`, {origin: 'top', delay: 400}) -sr.reveal(`.home__img`, {origin: 'bottom', delay: 600}) -sr.reveal(`.home__footer`, {origin: 'bottom', delay: 800}) \ No newline at end of file diff --git a/100_projects/responsive-404-page-not-found/assets/js/scrollreveal.min.js b/100_projects/responsive-404-page-not-found/assets/js/scrollreveal.min.js deleted file mode 100644 index 5428bbd..0000000 --- a/100_projects/responsive-404-page-not-found/assets/js/scrollreveal.min.js +++ /dev/null @@ -1,12 +0,0 @@ -/*! @license ScrollReveal v4.0.9 - - Copyright 2021 Fisssion LLC. - - Licensed under the GNU General Public License 3.0 for - compatible open source projects and non-commercial use. - - For commercial sites, themes, projects, and applications, - keep your source code private/proprietary by purchasing - a commercial license from https://scrollrevealjs.org/ -*/ -var ScrollReveal=function(){"use strict";var r={delay:0,distance:"0",duration:600,easing:"cubic-bezier(0.5, 0, 0, 1)",interval:0,opacity:0,origin:"bottom",rotate:{x:0,y:0,z:0},scale:1,cleanup:!1,container:document.documentElement,desktop:!0,mobile:!0,reset:!1,useDelay:"always",viewFactor:0,viewOffset:{top:0,right:0,bottom:0,left:0},afterReset:function(){},afterReveal:function(){},beforeReset:function(){},beforeReveal:function(){}};var n={success:function(){document.documentElement.classList.add("sr"),document.body?document.body.style.height="100%":document.addEventListener("DOMContentLoaded",function(){document.body.style.height="100%"})},failure:function(){return document.documentElement.classList.remove("sr"),{clean:function(){},destroy:function(){},reveal:function(){},sync:function(){},get noop(){return!0}}}};function o(e){return"object"==typeof window.Node?e instanceof window.Node:null!==e&&"object"==typeof e&&"number"==typeof e.nodeType&&"string"==typeof e.nodeName}function u(e,t){if(void 0===t&&(t=document),e instanceof Array)return e.filter(o);if(o(e))return[e];if(n=e,i=Object.prototype.toString.call(n),"object"==typeof window.NodeList?n instanceof window.NodeList:null!==n&&"object"==typeof n&&"number"==typeof n.length&&/^\[object (HTMLCollection|NodeList|Object)\]$/.test(i)&&(0===n.length||o(n[0])))return Array.prototype.slice.call(e);var n,i;if("string"==typeof e)try{var r=t.querySelectorAll(e);return Array.prototype.slice.call(r)}catch(e){return[]}return[]}function s(e){return null!==e&&e instanceof Object&&(e.constructor===Object||"[object Object]"===Object.prototype.toString.call(e))}function f(n,i){if(s(n))return Object.keys(n).forEach(function(e){return i(n[e],e,n)});if(n instanceof Array)return n.forEach(function(e,t){return i(e,t,n)});throw new TypeError("Expected either an array or object literal.")}function h(e){for(var t=[],n=arguments.length-1;0=[].concat(r.body).shift())return j.call(this,n,i,-1,t),c.call(this,e,{reveal:!0,pristine:t});if(!n.blocked.foot&&i===[].concat(o.foot).shift()&&i<=[].concat(r.body).pop())return j.call(this,n,i,1,t),c.call(this,e,{reveal:!0,pristine:t})}}function E(e){var t=Math.abs(e);if(isNaN(t))throw new RangeError("Invalid sequence interval.");this.id=b(),this.interval=Math.max(t,16),this.members=[],this.models={},this.blocked={head:!1,foot:!1}}function d(e,i,r){var o=this;this.head=[],this.body=[],this.foot=[],f(e.members,function(e,t){var n=r.elements[e];n&&n[i]&&o.body.push(t)}),this.body.length&&f(e.members,function(e,t){var n=r.elements[e];n&&!n[i]&&(t - - - - - - - Document - - -
- -
-
-
-
-
- Error 404 -

Hey Buddy

-

- We can't seem to find the page
you are looking for. -

- - Go Home - -
- -
- -
-
-
-
- (554) 987-654 - | - info@company.com -
-
-
- - - - \ No newline at end of file