From 15da2c2dd92dcaaaba49992681f899ae556c765e Mon Sep 17 00:00:00 2001 From: MuhammadBakhtawar Date: Wed, 7 Feb 2024 19:15:20 +0500 Subject: [PATCH] redesign --- index.html | 75 ++++++++--------------- style.css | 176 +++++++++++++++++++---------------------------------- 2 files changed, 89 insertions(+), 162 deletions(-) diff --git a/index.html b/index.html index 02070cb..e21ca8a 100644 --- a/index.html +++ b/index.html @@ -1,60 +1,35 @@ - - - - Document - - + + + + Netflix + + + + - -
-
+
+ +
+ +
+ +
NETFLIX
- -
-
-

Unlimited movies, TV shows, and more

-

Watch anywhere. Cancel anytime.

- -

- Ready to watch? Enter your email to create or restart your - membership. -

-
-

- -

-

- -

-
-
-
-
-
- -
-
- -

Enjoy on your TV

-

- Watch on Smart TVs, Playstation, Xbox, Chromecast, Apple TV, Blu-ray - players, and more. -

+
+

Unlimited movies, TV shows, and more

+

Watch anywhere. Cancel anytime.

+
-
- -
- - +
+ + + \ No newline at end of file diff --git a/style.css b/style.css index ac33453..b3190a5 100644 --- a/style.css +++ b/style.css @@ -1,118 +1,70 @@ -* { - margin: 0px; - padding: 0px; - box-sizing: border-box; - } - - body { - background-color: rgb(56, 55, 55); - } - - .minicontainer1 { - width: 100vw; - height: 700px; - /* background-color: black; */ - } - - .background { - height: 100%; - width: 100%; - background-image: url("https://assets.nflxext.com/ffe/siteui/vlv3/9134db96-10d6-4a64-a619-a21da22f8999/e1a226fa-a69c-4bb8-a028-57187cc2d894/PK-en-20240115-trifectadaily-perspective_alpha_website_small.jpg"); - background-size: cover; - } - - .navbar { - padding-top: 1%; - width: 100vw; - display: flex; - justify-content: center; - justify-content: space-around; - /* padding: 5%; */ - /* align-content: center; */ - /* background-color: white; */ - } - - .navtext { - color: rgb(229, 9, 20); - font-family: Netflix Sans, Helvetica Neue, Segoe UI, Roboto, Ubuntu, - sans-serif; - font-size: 20pt; - } - - .navbtn button { - background-color: rgb(229, 9, 20); - padding: 3px; - border: none; - border-radius: 2px; - color: white; - } - - .part1sec2 { - justify-content: center; - color: white; - font-family: Netflix Sans, Helvetica Neue, Segoe UI, Roboto, Ubuntu, - sans-serif; - } - - .part2-1-1 { - font-size: 30pt; - /* color: white; */ - margin-top: 10%; - } - - .part2-1-2 { - margin-top: 1%; - } +*{ + margin: 0%; + padding: 0%; +} +body{ + background-color: gray; +} +/* .container{ + +} */ +.sec1{ + position: absolute; + width: 100vw; + height: 700px; + background-image: url("https://assets.nflxext.com/ffe/siteui/vlv3/4da5d2b1-1b22-498d-90c0-4d86701dffcc/2151f7fd-6774-492c-8821-99c3b23be48d/PK-en-20240129-popsignuptwoweeks-perspective_alpha_website_large.jpg"); + /* background-size: cover; */ + z-index: -2; - .part2-2-1 { - margin-top: 2%; - } +} +.opacity{ + position: absolute; + width: 100%; + height: 100%; + background-color: black; + opacity: 0.5; + /* position: relative; */ + z-index: -1; +} +.text{ + width: 100%; + height: 100%; + + z-index: 2; + + z-index: 1; +} +.navbar { +padding-top: 1%; +width: 100vw; +display: flex; +justify-content: center; +justify-content: space-around; +/* padding: 5%; */ +/* align-content: center; */ +/* background-color: white; */ +} - .part2-2-2 input { - height: 8vh; - width: 30vw; - margin-right: 8px; - padding-left: 5%; - outline: none; - } +.navtext { +color: rgb(229, 9, 20); +font-family: Netflix Sans, Helvetica Neue, Segoe UI, Roboto, Ubuntu, + sans-serif; +font-size: 20pt; +} - .part2-2-3 button { - height: 8vh; - width: 10vw; - background-color: rgb(229, 9, 20); - color: white; - border: none; - font-size: 10pt; - } +.navbtn button { +background-color: rgb(229, 9, 20); +padding: 4px; +border: none; +border-radius: 2px; +color: white; +} +.sec1text{ +color: white; - .part1input { - display: flex; - /* border: 1px solid; */ - justify-content: center; - margin-top: 1%; - } - .minicontainer2 { - /* height: 300px; */ - width: 100vw; - margin-top: 1%; - padding: 72px 0px; - background-color: black; - color: white; - display: flex; - } - .container2text{ - width: 50%; - /* background-color: red; */ - padding: 0px 6px 0px 0px; - text-align: left; - color: rgb(255,255,255); - font-family: Netflix Sans,Helvetica Neue,Segoe UI,Roboto,Ubuntu,sans-serif; } - - - .container2pic{ - width: 50%; - /* height: 100px; */ - /* background-color: yellow; */ - } \ No newline at end of file +.text-heading{ + font-size: 40pt; + margin-top: 10%; +} \ No newline at end of file