Idea-Innovation-Cell-VSSUT-Burla · TusharPani14 · Jun 30, 2022
diff --git a/task_webDev/Tushar_Panigrahi_2102081004/index.html b/task_webDev/Tushar_Panigrahi_2102081004/index.html
@@ -0,0 +1,169 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <link
+      href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+    <link
+      rel="stylesheet"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
+      integrity="sha512-iBBXm8fW90+nuLcSKlbmrPcLa0OT92xO1BIsZ+ywDWZCvqsWgccV3gFoRBv0z+8dLJgyAHIhR35VZc2oM/gI1w=="
+      crossorigin="anonymous"
+      referrerpolicy="no-referrer"
+    />
+    <link rel="stylesheet" href="style.css" />
+
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Portfolio_Website</title>
+  </head>
+  <body>
+    <div class="tushar">
+      <nav>
+
+       <div> <h2 class="logo">Portfo<span>lio</span></h2></div>
+          <div>
+            <i class="fa fa-bars" id="bars"></i> 
+            <ul>
+              <li><a href="">Home</a></li>
+              <li><a href="">About Us</a></li>
+              <li><a href="">Services</a></li>
+              <li><a href="">Skills</a></li>
+              <li><a href="">Contact Us</a></li>
+            </ul> 
+            <div id="menulist">
+              <a href="">Home</a>
+              <a href="">About Us</a>
+              <a href="">Services</a>
+              <a href="">Skills</a>
+              <a href="">Contact Us</a>
+            </div>
+
+
+            </div>
+        <a href="#" class="btn">Subscribe</a>
+      </nav>
+      <div class="content">
+        <h4>Hello, my name is</h4>
+        <h1>Tushar Pani<span>grahi</span></h1>
+        <h3>I'am a web developer.</h3>
+        <div class="newsletter">
+          <form>
+            <input
+              type="email"
+              name="email"
+              id="mail"
+              placeholder="Enter your email"
+            />
+            <input type="submit" name="submit" value="Lets Start" />
+          </form>
+        </div>
+      </div>
+    </div>
+    <!--About section start-->
+    <section class="about">
+      <div class="main">
+        <img src="my img.jpeg" />
+        <div class="about_text">
+          <h2>About Me</h2>
+          <h5>Developer <span>& Designer</span></h5>
+          <p>
+            I am a front-end web developer. I can provide clean code and pixel
+            perfect design. I also make the website more and more interactive
+            with web animations. I'm currently a 1st year student pursuing
+            Bachelores of Technology in Information Technology from Veer
+            Surendra Sai University Of Technology, Burla, Odisha. As being an IT
+            student my interest lies is programming and learning new technical
+            stuffs. I am an enthusiastic Competitive programming learner and
+            believe in working hard and enjoying life as well
+          </p>
+          <div class="button">
+            <button type="button">Let's talk</button>
+          </div>
+        </div>
+      </div>
+    </section>
+    <!--service section start-->
+    <div class="service">
+      <div class="title">
+        <h2>Our Services</h2>
+      </div>
+
+      <div class="box">
+        <div class="card">
+          <i class="fas fa-bars"></i>
+          <h5>Web Development</h5>
+          <div class="pra">
+            <p>
+              Every website should be built with two primary goals: Firstly, it
+              needs to work across all devices. Secondly, it needs to be as fast
+              as possible.
+            </p>
+
+            <p style="text-align: center">
+              <a class="button" href="#">Read More</a>
+            </p>
+          </div>
+        </div>
+
+        <div class="card">
+          <i class="far fa-user"></i>
+          <h5>Web Development</h5>
+          <div class="pra">
+            <p>
+              Every website should be built with two primary goals: Firstly, it
+              needs to work across all devices. Secondly, it needs to be as fast
+              as possible.
+            </p>
+
+            <p style="text-align: center">
+              <a class="button" href="#">Read More</a>
+            </p>
+          </div>
+        </div>
+
+        <div class="card">
+          <i class="far fa-bell"></i>
+          <h5>Web Development</h5>
+          <div class="pra">
+            <p>
+              Every website should be built with two primary goals: Firstly, it
+              needs to work across all devices. Secondly, it needs to be as fast
+              as possible.
+            </p>
+
+            <p style="text-align: center">
+              <a class="button" href="#">Read More</a>
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!------Contact Me------>
+    <div class="contact-me">
+      <p>Let Me Get You A Beautiful Website.</p>
+      <a class="button-two" href="#">Hire Me</a>
+    </div>
+
+    <!------footer start--------->
+    <section>
+      <footer>
+        <p>Tushar Panigrahi</p>
+        <p>
+          For more HTML, CSS, and coding tutorial - please click on the link
+          below to subscribe to my channel:
+        </p>
+        <div class="social">
+          <a href="#"><i class="fab fa-facebook-f"></i></a>
+          <a href="#"><i class="fab fa-instagram"></i></a>
+          <a href="#"><i class="fab fa-dribbble"></i></a>
+        </div>
+        <p class="end">CopyRight By Tushar Panigrahi</p>
+      </footer>
+    </section>
+    <script src="script.js"></script>
+  </body>
+</html>
diff --git a/task_webDev/Tushar_Panigrahi_2102081004/my img.jpeg b/task_webDev/Tushar_Panigrahi_2102081004/my img.jpeg
diff --git a/task_webDev/Tushar_Panigrahi_2102081004/photo-1518655048521-f130df041f66.jpg b/task_webDev/Tushar_Panigrahi_2102081004/photo-1518655048521-f130df041f66.jpg
diff --git a/task_webDev/Tushar_Panigrahi_2102081004/script.js b/task_webDev/Tushar_Panigrahi_2102081004/script.js
@@ -0,0 +1,12 @@
+var x = document.getElementById("menulist");
+const bars=document.getElementById("bars");
+bars.addEventListener("click",function(){
+  if (x.style.display == "block") {
+  x.style.display = "none";
+  bars.style.backgroundColor="crimson";
+} else {
+  x.style.display = "block";
+
+  bars.style.backgroundColor="white";
+}
+})