Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feature: updated the readme file and home page #36

Merged
merged 2 commits into from
Apr 23, 2023
Merged

feature: updated the readme file and home page #36

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
f52655f
updated the readme file and home page
manavsiddharthgupta Apr 23, 2023
fcfdb7c
updated the readme file
manavsiddharthgupta Apr 23, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified README.md
View file
Open in desktop
Binary file not shown.
71 changes: 34 additions & 37 deletions client/src/App.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ function App() {
const onSetisLoggedState = () => {
setisLogged(true);
};

useEffect(() => {
const data = localStorage.getItem(localStorage_key);
console.log(data);
Expand All @@ -29,47 +29,44 @@ function App() {
}, []);

return (
<div className="h-full">

<BrowserRouter>
<Switch>
{isLogged &&(
<Route path="/home" exact >
<Navbar />
<BrowserRouter>
<Switch>
{isLogged && (
<Route path="/" exact>
<Navbar />
</Route>
)}

{!isLogged && (
<Route path="/register" exact>
<Register onsetislogged={onSetisLoggedState} />
</Route>
)}

{!isLogged && (
<Route path="/register" exact>
<Register onsetislogged={onSetisLoggedState} />
</Route>
)}
{!isLogged && (
<Route path="/login" exact>
<Login />
</Route>
)}

{!isLogged && (
<Route path="/login" exact>
<Login />
</Route>
)}

<Route path="/" exact>
<Home />
</Route>

{isLogged && (
<Route path="/profile" exact>
<Profile
name="Saurabh"
email="abcd.com"
bio="I'm a software engineer based in San Francisco."
/>
</Route>
)}
<Route path="*">
{isLogged ? <Redirect to="/home" /> : <Redirect to="/login" />}
<Route path="/home" exact>
<Home />
</Route>

{isLogged && (
<Route path="/profile" exact>
<Profile
name="Saurabh"
email="abcd.com"
bio="I'm a software engineer based in San Francisco."
/>
</Route>
</Switch>
</BrowserRouter>
</div>
)}
<Route path="*">
{isLogged ? <Redirect to="/home" /> : <Redirect to="/login" />}
</Route>
</Switch>
</BrowserRouter>
);
}

Expand Down
47 changes: 9 additions & 38 deletions client/src/components/home/Home.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,44 +1,15 @@
import React from 'react';
import classes from "./home.module.css";
import styles from "./home.module.css";

const Home = () => {
return (
<div className={classes.home}>
<div className={classes.left}>
<h1 className={classes.brandName}>
<span className={classes.devText}>DEV</span>
<span className={classes.gramText}>GRAM.</span>
</h1>

<h2 className={classes.displayText}>
Built for developers by developers /&gt;
</h2>
</div>


<div className={classes.right}>
<div className={classes.loginSignup}>
<a href="/login" className={classes.loginLink}>Log in</a>
<a href="/register" className={classes.signupLink}>Sign up</a>
</div>

<h2 className={classes.devMeaning}>
Developer
<span className={classes.devMeaningNoun}>
noun
</span>
<br />
<span className={classes.devMeaningSentence}>
-a person or thing that develops something
</span>
</h2>

<h2 className={classes.descText}>
DevGram is a web application designed for developers to connect with each other.
</h2>
</div>
</div>
<main className={styles.home_outerdiv}>
<section>main data</section>
<aside>
<div>notification</div>
<div>Trending</div>
</aside>
</main>
);
}
};

export default Home;
141 changes: 26 additions & 115 deletions client/src/components/home/home.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,115 +1,26 @@
.home {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 20px;
position: relative;
}


.left {
display: flex;
flex-direction: column;
position: fixed;
left: 20px;
top: 20px;
}

.brandName {
position: fixed;
width: 120px;
height: 12px;
font-size: 35px;
font-weight: bold;
}

.devText {
color: rgba(0, 0, 0, 0.9);
}

.gramText {
color: #999999;
}

.displayText {
font-size: 50px;
margin-top: 16%;
margin-left: 40px;
width: 40%;
word-wrap: break-word;
white-space: pre-wrap;
background-repeat: repeat;
background-color: #fff;

}

.right {
display: flex;
flex-direction: column;
align-items: center;
position: fixed;
right: 20px;
top: 25px;
}


.loginSignup {
display: flex;
align-items: center;
justify-content: flex-end;
margin-right: 40px;
}

.loginLink {
margin-right: 50px;
color: #808080;
font-size: 20px;
display: inline-block;
}

.signupLink {
color: #808080;
font-size: 20px;
display: inline-block;
}


.descText{
font-size: 15px;
position: fixed;
bottom: 70px;
margin-right: 300px;
left: auto;
width: 50%;
width: 40%;
word-wrap: break-word;
white-space: pre-wrap;
}

.devMeaning{
position: absolute;
font-size: 40px;
margin-top: 160px;
margin-right: 450px;
width: 40%;
}

.devMeaningNoun{
position: absolute;
font-size: 20px;
margin-top: 20px;
color: grey;
}

.devMeaningSentence{
position: absolute;
font-size: 20px;
margin-top: -5px;
margin-left: -10px;
font-weight:200;
width: 450%;
word-wrap: break-word;
white-space: pre-wrap;
color: grey;
}
.home_outerdiv {
border: 1px solid black;
min-height: 100vh;
position: relative;
padding: 2rem 4rem;
display: flex;
}
.home_outerdiv section {
height: 1500px;
margin-right: 300px;
border: 1px solid red;
width: 100%;
}
.home_outerdiv aside {
position: fixed;
width: 300px;
top: 2rem;
right: 4rem;
border: 2px solid black;
overflow-y: scroll;
height: 89vh;
}
.home_outerdiv aside div {
height: 300px;
border: 1px solid blue;
}
45 changes: 45 additions & 0 deletions client/src/components/landing page/LandingPage.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
import classes from "./landing.module.css";

const LandingPage = () => {
return (
<div className={classes.home}>
<div className={classes.left}>
<h1 className={classes.brandName}>
<span className={classes.devText}>DEV</span>
<span className={classes.gramText}>GRAM.</span>
</h1>

<h2 className={classes.displayText}>
Built for developers by developers /&gt;
</h2>
</div>

<div className={classes.right}>
<div className={classes.loginSignup}>
<a href="/login" className={classes.loginLink}>
Log in
</a>
<a href="/register" className={classes.signupLink}>
Sign up
</a>
</div>

<h2 className={classes.devMeaning}>
Developer
<span className={classes.devMeaningNoun}>noun</span>
<br />
<span className={classes.devMeaningSentence}>
-a person or thing that develops something
</span>
</h2>

<h2 className={classes.descText}>
DevGram is a web application designed for developers to connect with
each other.
</h2>
</div>
</div>
);
};

export default LandingPage;
Loading