updates

new-webapp/src/App.js

@@ -12,6 +12,7 @@ return (
         <Route path="/SignIn" exact element={<SignIn/>}/>
         <Route path="/browse" exact element={<Browse/>}   /> 
         <Route path="/NetflixClone" exact element={<Signup/>}/>
+        <Route path="/Raj" exact element={<Signup/>}/>
     </Routes>
    </Router>
 </>

new-webapp/src/Signup.css

@@ -1,4 +1,4 @@
-p {
+.pT {
     font-size: x-large;
     font-weight: 400;
 }

new-webapp/src/Signup.js

@@ -10,7 +10,7 @@ return (
     <Header />
     <div className = "text" style={{marginTop:'8%'}}>
         <h1 style={{'textAlign':'center','marginBottom':'25px',fontWeight:'1000','font-size': 'xxx-large'}}>Unlimited movies,TV shows, and more</h1>
-        <p style={{'textAlign':'center','marginBottom':'25px'}}>Watch anywhere. Cancel anytime.</p>
+        <p className="pT" style={{'textAlign':'center','marginBottom':'25px'}}>Watch anywhere. Cancel anytime.</p>
         <h3 style={{'textAlign':'center','marginBottom':'15px',fontWeight:'400',fontSize:'large'}}>Ready to watch? Enter your email to create or restart your membership.</h3>
         <div style={{'display':'inline-flex','margin-left': '33%','width':'-webkit-fill-available'}}>
             <div style={{'margin-right': '1%',width: '35%'}}>

new-webapp/src/pages/SignIn.css

@@ -9,6 +9,8 @@
     height: 100vh;
     top: 0;
     left: 0;
+    display:flex;
+    flex-direction: column;
 
 display: flex;
     justify-content: center;
@@ -26,16 +28,17 @@ display: flex;
 
 .SignInContainer{
     /* margin-top: 15%;  */
-    background-color: rgb(0,0,0,0.9);
+    background-color: rgb(0,0,0,0.7);
     color:#f3f3f3;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
 
     min-height:660px;
-    width:440px;
+    width:450px;
     min-width:380px;
+    margin-bottom: 5%;
 
 
 
@@ -83,6 +86,9 @@ margin-left:43%;
     margin-left: 14%;
     margin-right: 14%;
     font-family:Netflix Sans,Helvetica Neue,Segoe UI,Roboto,Ubuntu,sans-serif;
+    color: #8c8c8c;
+    font-size: 13px;
+    margin-top: 11px;
 }
 
 .net{
@@ -111,10 +117,27 @@ margin-left:43%;
     margin-right: 14%;
     font-size: 13px;
     font-family:Netflix Sans,Helvetica Neue,Segoe UI,Roboto,Ubuntu,sans-serif; ;
+    color: #8c8c8c;
+    font-size: 13px;
+    margin-top: 11px;
 
 }
 
 .signintext{
     margin-right:48%;
     font-weight: 500;
+    font-family:Netflix Sans,Helvetica Neue,Segoe UI,Roboto,Ubuntu,sans-serif; ;
+}
+
+.logo{
+    margin:0;
+    height: 200px;
+    width:300px;
+    margin-right: 900px;
+}
+.imgL{
+    display:flex;
+    justify-content: flex-start;
+    align-items: flex-start;
+    flex-direction: row;
 }

new-webapp/src/pages/SignIn.js

@@ -1,7 +1,7 @@
 import React, { useState } from "react";
 import "./SignIn.css"
 import {useNavigate} from "react-router-dom";
-import Header from '../Header';
+import logo from '../LogoIcons&Images/Logos-Readability-Netflix-logo.png';
 
 
 function SignIn(){
@@ -25,8 +25,10 @@ function SignIn(){
     }
 
     return(
-    <div className="base">
-     <Header showButtons={false}/>
+    <div className="base ">
+    <div className="imgL" >
+    <img className="logo" src={logo}></img>
+     </div>
      <div className="SignInContainer">
      <h1 className="signintext">Sign In</h1>
      <form className="op" onSubmit={handleSignIn}>