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.

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

Day 1 task completed! #2

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
98 changes: 98 additions & 0 deletions Arnab/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,98 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="Arnab" content="width=, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css" integrity="sha512-HK5fgLBL+xu6dm/Ii3z4xhlSUyZgTT9tuc/hSrtw6uzJOvgRr2a9jyxxT1ely+B+xFAmJKVSTbpM/CuL7qxO8w==" crossorigin="anonymous" />
<link rel="stylesheet" href="main.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap" rel="stylesheet">
<title>Arnab Chatterjee</title>
</head>
<body>
<section id="title">
<div class="introduction">
<h1 class="name">Hello, I'm Arnab Chatterjee</h1>
<p class="info">A Front End Developer from India!
</p>
<button class="btn">HIRE ME &rarr;</button>
<div class="nav">
</div>
</div>
</section>

<section id="hello">
<h2>Hello Traveller! 🙋‍♂️</h2>
<hr>
<br>
<p>I'm a 19 y/o Student and a Full Stack Web Developer currently working with<br> GeeksForGeeks KIIT as a frontend and backend developer. <br>As a Web Developer, I mostly work with React and NodeJS, <br>and multiple other JavaScript frameworks which aid in making highly responsive web pages.<br> I'm also a bot developer, having developed bots for Discord, Twitter and Chatbots.
</p>


</section>

<section id="skills">
<h2>My Skillset</h2>
<hr>
<br>
<p>I have a diverse set of skills from design to semantic and well <br>
structured HTML + reasonable and efficent CSS along with SASS and Bootstrap. <br>
I have also great experience on javascript. I love things that are open source. <br>
I use VS code as my editor and Windows as My operating System.
</p>

<button class="btn-all">Say Hello !</button>

</section>

<section id="about">
<h2>About Me</h2>
<hr>
<br>
<p><p>I'm a 19 y/o Student and a Full Stack Web Developer currently working with<br>
GeeksForGeeks KIIT as a frontend and backend developer. <br>
As a Web Developer, I mostly work with React and NodeJS, <br>
and multiple other JavaScript frameworks which aid in making highly responsive web pages.<br>
I'm also a bot developer, having developed bots for Discord, Twitter and Chatbots.
</p>



</section>

<section id="work">
<h2>My Work</h2>
<hr>
<br>
<p>Languages<br>
C • C++ • JavaScript • SQL/NoSQL<br>

Technologies<br>
React • NodeJS • Heroku • GCP • Firebase<br>

Tools<br>
Visual Studio Code • Git • Postman • Oracle DB<br>
</p>

<br>
<button class="btn-all">HIRE ME &rarr;</button>

</section>

<footer id="foot">
<div class="contact">
<a href="https://www.linkedin.com/in/arnab-chatterjee-3944341a0/">Linkedin</a>
<a href="https://twitter.com/cyanide_arnab">Twitter</a>
<h4>9696770XXX <br>
[email protected]</h4>
</div>
<div>
<p class="copy">&copy;2021 All rights reserved</p>
<p class="crafted">
👨‍💻 with ❤️ by Arnab Chatterjee
</p>
</div>
</footer>
</body>
</html>
Empty file added Arnab/index.txt
Empty file.
229 changes: 229 additions & 0 deletions Arnab/main.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,229 @@
*{
box-sizing: border-box;
padding: 0;
margin: 0;
font-family: 'Poppins', sans-serif;
}

body{
background-color: #000;
}
/* First Page */
#title{
background: url(https://pixelz.cc/wp-content/uploads/2018/12/pewdiepie-red-and-black-wavy-background-uhd-4k-wallpaper.jpg);
width: 100%;
height: auto;
opacity: 0.7;
}

.introduction{

display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
margin: 0;
/* position: relative; */
}

.name{
font-size: 5rem;
color: #fff;

}

.info
{
text-align: center;
line-height:1.3;
color: #fff;
font-size: 40px;
}

.btn{
font-size: 1.5rem;
border: 1px solid #fff;
border-radius: 30px;
padding: 10px 20px;
margin-top: 20px;
background-color: transparent;
color: #fff;
outline: none;
cursor: pointer;

}

.btn:hover{
background-color:#fff;
outline: none;
color: #000;
}

.nav{
position: absolute;
right: 0;
top: 0;
margin: 50px;
}

.nav-btn{
border-radius: 50%;
padding: 10px;
background-color: rgb(255, 255, 255);
border: 0;
cursor: pointer;
outline: 0;
}



#hello{
background-color: #fff;
text-align: center;
color: gray;
font-size: larger;
}

#hello h2{
color:gray;
padding: 20px;
}

#hello hr{
width: 10%;
margin: auto;
border-bottom: 0;
}

#hello p{
line-height: 1.2;
padding: 5px;
}

.btn-all{
font-size: 1rem;
border: 1px solid #fff;
border-radius: 30px;
padding: 10px 20px;
margin-top: 20px;
margin-bottom: 20px;
background-color: rgb(27, 26, 26);
color: gray;
outline: none;
cursor: pointer;
}

/* Skills Part */
#skills{
padding: 10px;
background-color: rgb(230, 230, 230);
text-align: center;
color: gray;
font-size: larger;
}

#skills h2{
color:gray;
padding: 20px;
}

#skills hr{
width: 10%;
margin: auto;
border-bottom: 0;
}

#skills p{
line-height: 1.2;
padding: 5px;
}


/* About page */

#about{
background-color: #fff;
text-align: center;
color: gray;
font-size: larger;
}

#about h2{
color:gray;
padding: 20px;
}

#about hr{
width: 10%;
margin: auto;
border-bottom: 0;
}

#about p{
line-height: 1.2;
padding: 5px;
}


/* Work Page */

#work{
background-color: #fff;
text-align: center;
color: gray;
font-size: larger;
}


#work h2{
color:gray;
padding: 20px;
}

#work hr{
width: 10%;
margin: auto;
border-bottom: 0;
}

#work p{
line-height: 1.2;
padding: 5px;
}


/* Footerpage */

#foot{
background-color: rgb(17, 16, 27);
}
.contact{
text-align: center;
color:darkgray;
padding: 20px;
}
.contact a{
color: darkgray;
text-decoration: none;
padding: 20px;
text-align: center;
}

.contact h4{
line-height: 1.3;
padding: 10px;
}

.copy{
padding: 20px;
color: darkgray;
font-size: 1.1rem;
text-align: left;
}
.crafted{
padding: 20px;
color: darkgray;
font-size: 1.1rem;
text-align: right;
}
Empty file added Arnab/main.txt
Empty file.