diff --git a/100_projects/22-video-movie-popup/1.jpg b/100_projects/22-video-movie-popup/1.jpg deleted file mode 100644 index 844328a..0000000 Binary files a/100_projects/22-video-movie-popup/1.jpg and /dev/null differ diff --git a/100_projects/22-video-movie-popup/index.html b/100_projects/22-video-movie-popup/index.html deleted file mode 100644 index 00fcfc1..0000000 --- a/100_projects/22-video-movie-popup/index.html +++ /dev/null @@ -1,27 +0,0 @@ - - - - - - - document - - - - -
- movie -

Movie Title

-

- Lorem ipsum dolor sit amet consectetur adipisicing elit. Illum iste - necessitatibus porro explicabo illo dolorum dolores cupiditate non modi - quasi nobis, earum ab, autem esse vero sapiente minus vel! Provident?

- -
-
- - -
- - - diff --git a/100_projects/22-video-movie-popup/index.js b/100_projects/22-video-movie-popup/index.js deleted file mode 100644 index 17c9771..0000000 --- a/100_projects/22-video-movie-popup/index.js +++ /dev/null @@ -1,14 +0,0 @@ -const btnEl = document.querySelector(".btn"); -const closeIconEl = document.querySelector(".close-icon"); -const trailerContainerEl = document.querySelector(".trailer-container"); -const videoEl = document.querySelector("video"); - -btnEl.addEventListener("click", () => { - trailerContainerEl.classList.remove("active"); -}); - -closeIconEl.addEventListener("click", () => { - trailerContainerEl.classList.add("active"); - videoEl.pause(); - videoEl.currentTime = 0; -}); diff --git a/100_projects/22-video-movie-popup/style.css b/100_projects/22-video-movie-popup/style.css deleted file mode 100644 index b03ce73..0000000 --- a/100_projects/22-video-movie-popup/style.css +++ /dev/null @@ -1,124 +0,0 @@ -*{ - margin: 0; - padding: 0; - box-sizing: border-box; -} -body { - margin: 0; - box-sizing: border-box; - font-family: sans-serif; - display: flex; - justify-content: center; - height: 100vh; - align-items: center; - background-image: linear-gradient(to bottom, #000000, #2A272A, #4B4A54, #677381, #82A0AA, #A3CFCD); -} -body::before { - content: ''; - position: absolute; - top: 60px; - left: 10%; - width: 300px; - height: 300px; - background: linear-gradient(#dadde2, #fff5ff); - filter: blur(20px); -} -body::after { - content: ''; - position: absolute; - bottom: 60px; - right: 10%; - width: 300px; - height: 300px; - background: linear-gradient(#dadde2, #dadde2); - filter: blur(20px); -} -.main-container { - max-width: 550px; - padding: 10px; - text-align: center; - position: relative; - z-index: 9; -} -.main-container{ - position: absolute; - padding: 20px; - background: rgba(255, 255, 255,0.05); - box-shadow: 0 5px 15px rgba(0, 0, 0,0.1); - border-radius: 8px; - backdrop-filter: blur(10px); - z-index: 1; - transition: 0.5s; - color: #fff; -} -.main-container img { - max-width: 100%; - margin-bottom: 15px; - border-radius: 10px; -} -.main-container h1 { - color: #fff; - font-weight: 500; -} -.main-container p { - color: #fff; - margin: 15px 0; -} -.btn { - color: #fff; - background: rgba(255, 255, 255,0.05); - box-shadow: 0 5px 15px rgba(0, 0, 0,0.1); - border-radius: 8px; - backdrop-filter: blur(10px); - border: none; - font-size: 16px; - padding: 10px 20px; - cursor: pointer; - border-radius: 5px; - transition: .3s; -} -.btn:hover { - background-color: #fff; - color: #000; -} -.trailer-container { - position: fixed; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - background-color: black; - width: 100%; - height: 100%; - display: flex; - justify-content: center; - align-items: center; - opacity: 1; - transition: opacity 0.7s; - z-index: 99; -} -.active.trailer-container { - visibility: hidden; - opacity: 0; -} -.trailer-container video { - position: relative; - max-width: 900px; - outline: none; - z-index: 999; -} -@media (max-width: 991px) { - .trailer-container video { - max-width: 90%; - } -} -.close-icon { - position: absolute; - top: 30px; - right: 30px; - color: white; - cursor: pointer; - transition: .3s; -} -.close-icon:hover{ - color: #f00; -} \ No newline at end of file diff --git a/100_projects/22-video-movie-popup/trailer.mp4 b/100_projects/22-video-movie-popup/trailer.mp4 deleted file mode 100644 index 9712b6f..0000000 Binary files a/100_projects/22-video-movie-popup/trailer.mp4 and /dev/null differ