Skip to content

Commit

Permalink
Merge pull request #13 from rajpanjabi/kawshar
Browse files Browse the repository at this point in the history
Kawshar
  • Loading branch information
kwshr authored Feb 25, 2024
2 parents 96666df + a2a4ef4 commit f85f92a
Show file tree
Hide file tree
Showing 4 changed files with 29 additions and 89 deletions.
18 changes: 0 additions & 18 deletions new-webapp/src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,34 +5,16 @@ import SignIn from "./pages/SignIn"
import Browse from "./pages/Browse"

function App(){


return (
<>


<Router>
<Routes>
<Route path="/SignIn" exact element={<SignIn/>}/>
<Route path="/browse" exact element={<Browse/>} />
<Route path="/NetflixClone" exact element={<Signup/>}/>

</Routes>
</Router>

</>

)
}

export default App;




{/* <div className="app-container">
<div className="background-container">
<Header />
<Signup/>
</div>
</div> */}
5 changes: 4 additions & 1 deletion new-webapp/src/Header.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import logo from './LogoIcons&Images/Logos-Readability-Netflix-logo.png';
import langIcon from './LogoIcons&Images/language_icon.png'
import { useNavigate } from "react-router-dom";
function Header(){
function Header({ showButtons = true }){
let navigate=useNavigate();
function HandleSignIn(){
navigate("/SignIn")
Expand All @@ -12,12 +12,15 @@ return (
<div style={{flex:1, display:'flex'}} >
<div style={{marginLeft:'6%'}}>
<img src={logo} alt="Logo" width={"40%"} style={{'marginRight':'35%'}}/></div>
{showButtons && (
<>
<div className="language-container" style={{flex:1,'margin-top':'2%','marginLeft':'26%'}}>
<button type="button" className="text" style={{'fontSize':'15px','background':'transparent', border: 'solid white', borderWidth: 'thin',borderRadius:'3px',padding:'8%',width: '100px'}}>English</button>
</div>
<div className="signUp-container" style={{flex:1,'margin-right':'13%','margin-top':'2%'}}>
<button type="button" onClick={HandleSignIn} style={{background:'rgb(229, 9, 20)','fontSize':'15px',color:'white',border:'thick',borderRadius:'3px',padding:'8%',width: '100px'}}>Sign In</button>
</div>
</>)}
</div>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion new-webapp/src/pages/SignIn.css
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
top: 0;
left: 0;

display: flex;
display: flex;
justify-content: center;
align-content: center;
align-items: center;
Expand Down
93 changes: 24 additions & 69 deletions new-webapp/src/pages/SignIn.js
Original file line number Diff line number Diff line change
@@ -1,97 +1,52 @@


import React, { useState } from "react";
import { BrowserRouter, Route, Link } from "react-router-dom";

import "./SignIn.css"
import {useNavigate} from "react-router-dom";
import Header from '../Header';


function SignIn(){

let navigate = useNavigate();


const [name,setName]= useState("");
const [password, setPassword]= useState("");


function nameChange(event){
setName(event.target.value)



}
function passChange(event){
setPassword(event.target.value)


}

function handleSignIn(e){
e.preventDefault();
console.log(e.target.name);
console.log(e.target.password);



console.log("I'm here")
console.log(name);
console.log(password);
navigate('/browse');


}

return(




<div className="base" >

<div className="net">Netflix</div>


<div className="SignInContainer">

<h1 className="signintext">Sign In</h1>

<form className="op" onSubmit={handleSignIn}>
<div className="inputs">
<input className="backGrey" onChange={nameChange} type="text" placeholder="Email or phone number" value={name} ></input>
<input className="backGrey" onChange={passChange} type="text" placeholder="Password" value={password} ></input>
<input type="submit" className="redcol" value="Sign In"></input>
</div>

<div className="entLine">

<input type="checkbox"></input>
<p>Remember me</p>

<p className="help">Need help?</p>
</div>

<div className="NewNetf">

<p> New to Netflix? Sign Up now!</p>
<p>This page is protected by Google reCAPTCHA to ensure you're not a bot. Learn more.</p>
</div>

</form>





</div>


</div>);



}

<div className="base">
<Header showButtons={false}/>
<div className="SignInContainer">
<h1 className="signintext">Sign In</h1>
<form className="op" onSubmit={handleSignIn}>
<div className="inputs">
<input className="backGrey" onChange={nameChange} type="text" placeholder="Email or phone number" value={name} ></input>
<input className="backGrey" onChange={passChange} type="text" placeholder="Password" value={password} ></input>
<input type="submit" className="redcol" value="Sign In"></input>
</div>
<div className="entLine">
<input type="checkbox"></input>
<p>Remember me</p>
<p className="help">Need help?</p>
</div>
<div className="NewNetf">
<p> New to Netflix? Sign Up now!</p>
<p>This page is protected by Google reCAPTCHA to ensure you're not a bot. Learn more.</p>
</div>
</form>
</div>
</div>);
}

export default SignIn;

0 comments on commit f85f92a

Please sign in to comment.