15 |
16 | Filmak is a fully responsive movie website page, Responsive for all devices, built using HTML, CSS, and JavaScript.
17 |
18 | ➥ Live Demo
19 |
20 |
21 |
22 |
23 |
24 | ### Demo Screeshots
25 |
26 | ![Filmlane Desktop Demo](https://github.com/codewithsadee/filmlane/blob/master/readme-images/desktop.png?raw=true")
27 |
28 | ### Prerequisites
29 |
30 | Before you begin, ensure you have met the following requirements:
31 |
32 | * [Git](https://git-scm.com/downloads "Download Git") must be installed on your operating system.
33 |
34 | ### Run Locally
35 |
36 | To run **Filmlane** locally, run this command on your git bash:
37 |
38 | Linux and macOS:
39 |
40 | ```bash
41 | sudo git clone https://github.com/codewithsadee/filmlane.git
42 | ```
43 |
44 | Windows:
45 |
46 | ```bash
47 | git clone https://github.com/codewithsadee/filmlane.git
48 | ```
49 |
50 | ### Contact
51 |
52 | If you want to contact with me you can reach me at [Twitter](https://twitter.com/mohameddtv).
53 |
54 | ### License
55 |
56 | This project is **free to use** and does not contains any license.
57 |
--------------------------------------------------------------------------------
/assets/js/script.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 |
4 |
5 | const navOpenBtn = document.querySelector("[data-menu-open-btn]");
6 | const navCloseBtn = document.querySelector("[data-menu-close-btn]");
7 | const navbar = document.querySelector("[data-navbar]");
8 | const overlay = document.querySelector("[data-overlay]");
9 |
10 | const navElemArr = [navOpenBtn, navCloseBtn, overlay];
11 |
12 | for (let i = 0; i < navElemArr.length; i++) {
13 |
14 | // navElemArr[i].addEventListener("click", function () {
15 |
16 | // navbar.classList.toggle("active");
17 | // overlay.classList.toggle("active");
18 | // document.body.toggle("active");
19 |
20 | // });
21 |
22 | }
23 |
24 |
25 |
26 | /**
27 | * header sticky
28 | */
29 |
30 | const header = document.querySelector("[data-header]");
31 |
32 | window.addEventListener("scroll", function () {
33 |
34 | window.scrollY >= 10 ? header.classList.add("active") : header.classList.remove("active");
35 |
36 | });
37 |
38 |
39 |
40 | /**
41 | * go top
42 | */
43 |
44 | const goTopBtn = document.querySelector("[data-go-top]");
45 |
46 | window.addEventListener("scroll", function () {
47 |
48 | window.scrollY >= 500 ? goTopBtn.classList.add("active") : goTopBtn.classList.remove("active");
49 |
50 | });
51 | let buttn = document.querySelector('.data-header .but') ;
52 | let button = document.querySelector('.sign button');
53 | let form = document.querySelector('.sign form');
54 | let input = document.querySelector('.sign input');
55 | let error = document.querySelector('.sign .error');
56 | button.addEventListener ('click', function(e) {
57 | e.preventDefault();
58 | if (input.value === '') {
59 | error.style.display = 'block';
60 | } else {
61 | window.location.href ="./index.html";
62 | // buttn.style.display = 'none';
63 | window.sessionStorage.setItem('email', input.value);
64 | }
65 | });
66 |
67 | function redirectToSignIn() {
68 | // Redirect to sign.html when the "Sign in" button is clicked
69 | window.location.href = "./sign.html";
70 | }
71 |
--------------------------------------------------------------------------------
/sign.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Sign In Page
8 |
66 |
67 |
68 |
69 |
70 |
71 | Sign In Page
72 |
73 |
74 |
75 |
216 | A bank teller called Guy realizes he is a background character in an open world video game called Free
217 | City that will
218 | soon go offline.
219 |
216 | A bank teller called Guy realizes he is a background character in an open world video game called Free
217 | City that will
218 | soon go offline.
219 |
216 | A bank teller called Guy realizes he is a background character in an open world video game called Free
217 | City that will
218 | soon go offline.
219 |
216 | A bank teller called Guy realizes he is a background character in an open world video game called Free
217 | City that will
218 | soon go offline.
219 |
219 | A bank teller called Guy realizes he is a background character in an open world video game called Free
220 | City that will
221 | soon go offline.
222 |
429 | Lorem ipsum dolor sit amet, consecetur adipiscing elseddo eiusmod tempor.There are many variations of
430 | passages of lorem
431 | Ipsum available, but the majority have suffered alteration in some injected humour.
432 |
433 |
434 |
435 |
436 |
437 |
438 |
439 |
440 |
441 |
442 |
443 |
444 |
Enjoy on Your TV.
445 |
446 |
447 | Lorem ipsum dolor sit amet, consecetur adipiscing elit, sed do eiusmod tempor.
448 |
449 |
450 |
451 |
452 |
453 |
454 |
455 |
456 |
457 |
458 |
459 |
460 |
461 |
462 |
Watch Everywhere.
463 |
464 |
465 | Lorem ipsum dolor sit amet, consecetur adipiscing elit, sed do eiusmod tempor.
466 |
13 |
14 | 
41 | 
164 |
165 |
168 |
169 | 
277 | 281 | 282 |287 | 288 | 303 | 304 |
313 | 317 | 318 |323 | 324 | 339 | 340 |
349 | 353 | 354 |359 | 360 | 375 | 376 |
385 | 389 | 390 |395 | 396 | 411 | 412 |
164 |
165 |
168 |
169 | 
164 |
165 |
168 |
169 | 
41 | 
164 |
165 |
168 |
169 | 
164 |
165 |
168 |
169 | 
42 | 
413 | 
522 | 
558 | 
594 | 
666 | 
702 | 
738 | 
774 |