TinkerHubKMCTCE · shilpaajeeshm · Aug 16, 2020 · Aug 16, 2020 · Aug 16, 2020 · Aug 17, 2020
diff --git a/IMG_20200815_212927(1).JPG b/IMG_20200815_212927(1).JPG
diff --git a/cal.html b/cal.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="calstyle.css">
+    <script src="calculator.js"></script>
+</head>
+<body>
+    <div class="main-body">
+        <div class="calc">
+            <div class="output">
+                <input type="text" id="screen">
+
+        </div>
+        <div class="buttons">
+            <button onclick="displayClear()" class="btn">clear</button>
+            <div class="row">
+                <button onclick="buttonClick(7)" class="btn">7</button>
+                <button onclick="buttonClick(8)" class="btn">8</button>
+                <button onclick="buttonClick(9)" class="btn">9</button>
+                <button onclick="buttonClick('/')" class="btn">/</button>
+            </div>
+            <div class="row">
+                <button onclick="buttonClick(4)" class="btn">4</button>
+                <button onclick="buttonClick(5)" class="btn">5</button>
+                <button onclick="buttonClick(6)" class="btn">6</button>
+                <button onclick="buttonClick('*')" class="btn">x</button> 
+            </div>
+            <div class="row">
+                <button onclick="buttonClick(1)" class="btn">1</button>
+                <button onclick="buttonClick(2)" class="btn">2</button>
+                <button onclick="buttonClick(3)" class="btn">3</button>
+                <button onclick="buttonClick('-')" class="btn">-</button>
+            </div>
+            <div class="row">
+                <button onclick="buttonClick(0)" class="btn">0</button>
+                <button onclick="buttonClick('.')" class="btn">.</button>
+                <button onclick="buttonClick('+')" class="btn">+</button>
+                <button onclick="equalClick('=')" class="btn">=</button>
+            </div>
+        </div>
+    </div>
+</body>
+</html>
diff --git a/calculator.js b/calculator.js
@@ -0,0 +1,12 @@
+function buttonClick(val)
+{
+    document.getElementById("screen").value=document.getElementById("screen").value+val;
+}
+function displayClear(){
+    document.getElementById("screen").value=""
+}
+function equalClick(){
+ var text=document.getElementById("screen").value
+ var result=eval(text)
+ document.getElementById('screen').value=result
+}
diff --git a/calstyle.css b/calstyle.css
@@ -0,0 +1,21 @@
+.calc{
+    width: 400px;
+    height:600px;
+    background:gray;
+    margin-left:400px;
+}
+#screen{
+    width:80%;
+    margin-left:36px;
+    height:40px;
+    margin-top:30px;
+    pointer-events:none;
+}
+.btn{
+    width:60px;
+    height:45px;
+    margin-left:30px;
+    margin-top:30px;
+    background:rgb(65, 121, 143);
+
+}
diff --git a/circle.jpg b/circle.jpg
diff --git a/cross.jpg b/cross.jpg
diff --git a/form.html b/form.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title> REGISTRATION FORM </title>
+</head>
+<body bgcolor="coralwhite">
+    <center>
+    <h1><font color="black"><u>REGISTRATION FORM</u></font></h1><br>
+    <h2>Fill up your informations in the registration form in order to access our website </h2>
+    <form>
+        <label for="FIRST NAME">FIRST NAME:</label>
+        <input id="FIRST NAME" type="text" name="FIRST NAME" place holder="FIRST NAME" required=""><br>
+        <label for="LAST NAME">LAST NAME:</label>
+        <input id="LAST NAME" type="text" name="LAST NAME" place holder="LAST NAME" required=""><br>
+    <div>
+        <label for="Male">MALE</label>
+        <input type="radio" name="Gender" id="Male" required="">
+        <label for="Female">FEMALE</label>
+        <input type="radio" name="Gender" id="Female" required="">
+        <label for="Others">OTHERS</label>
+        <input type="radio" name="Gender" id="Others" required="">
+    </div>
+    <div>
+        <label>EMAIL</label>
+        <input type="email" required ><br><br>
+    </div>
+    <div>
+        <label for="pass">PASSWORD( Minimum 10 characters):</label>
+        <input type="password" id="pass" name="password" minlength="10" required><br><br>
+    </div>
+    <div>
+        <label for="start" >BIRTHDAY:
+        <input type="date" id="start" name="trip-start" value="." min="01-01-1980" max="">
+        </label><br><br>
+    </div>
+    <div>
+        <p>I agree with the terms and conditions
+            <input type="checkbox" required=""><br>
+        </p>
+        <a href=""> CLICK HERE TO SEE THE TERMS AND CONDITIONS</a><br><br>
+    </div>
+    <input type="submit" value="submit">
+    <input type="reset" value="reset">
+    </form>
+    </center>
+</body>
+</html>
diff --git a/index.html b/index.html
@@ -1,25 +1,236 @@
-
-<html><head>
-    <title>amrutha</title>
-</head>
-    <body>
-<h1><i>HELLO WORLD</i></h1><hr>
-<H2><u>HELLO WORLD</u></H2>
-<H3>HELLO WORLD</H3>
-<H4>HELLO WORLD</H4>
-<H5>HELLO WORLD</H5>
-<H6>HELLO WORLD</H6>
-<P>HGYFYFJKUUDDYHBNHGDTDR<b>TYYGHBHHGYTDTDYGHGHJDTJD</b>GYGKVHHDFGYS
-    GFJJDVBDVDFTFUDHGfaygydfuhcjhgvgcygyvggfygvyg<br>dvygjvhcjvggjcgjvgcgtuddggxgjzgzffuzfuzf
-    uzxftfdyjxgcgjhgxc</P>
-<p>rttr<del>yyfyyh</del>trgfsfsfsrsrsrsgffdttttffyfyfffyyuyuyufgfgfffygyyfttttffyygytttighjgjgkgkkggk
-    jhkjkhkhkhkhkhkhkuhuhkuhkuhkuhukhukhukhukyitititiyiuyiuyuyiuyuiyt7t6t6rtrttrftrtyrtrtr</p>
-<button>click here</button><br>
-<a href="http://google.com">google</a><br>
-<img src="sophia.jpg" width="120px" height="120px">
-
-
-
-</body>
-</html>
-
+<!DOCTYPE html>
+<html lang="en" style="scroll-behavior: smooth;">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>SHILPA AJEESH M </title>
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
+</head>
+<body>
+<header class="bg-info" style="position:fixed; width:100%; z-index:1;">
+    <div class="row text-white">
+        <div class="col-md-6 col-9 p-3 pl-5">
+            <h2>SHILPA AJEESH M</h2>
+        </div>
+        <div class="col-md-6 col-3 my-auto ">
+            <nav class="navbar navbar-expand-lg navbar-light ">
+                <button class="navbar-toggler ml-auto" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+                  <span class="navbar-toggler-icon"></span>
+                </button>
+
+                <div class="collapse navbar-collapse" id="navbarSupportedContent">
+                  <ul class="navbar-nav ml-auto">
+                    <li class="nav-item active">
+                      <a class="nav-link text-white" href="#home-section">Home <span class="sr-only">(current)</span></a>
+                    </li> 
+                   <li class="nav-item active">
+                      <a class="nav-link text-white" href="#skills-section">Skills<span class="sr-only">(current)</span></a>
+                   </li> 
+                   <li class="nav-item active">
+                      <a class="nav-link text-white" href="#education-section">Education<span class="sr-only">(current)</span></a>
+                   </li> 
+
+                   <li class="nav-item active">
+                      <a class="nav-link text-white" href="#contact me-section">Contact Me <span class="sr-only">(current)</span></a>
+                   </li>
+                  </ul>
+
+                </div>
+              </nav>
+        </div>
+    </div>
+</header>
+<section class=" bg-dark text-white" id="home-section" style="padding-top:10em; padding-bottom:5em;">
+  <div class="container">
+    <div class="row align-items-center">
+      <div class="col-md-6">
+        <img src="https://lh3.googleusercontent.com/pw/ACtC-3fFgKBM5AOy_3cPD6QkihMzRax62pKQJsDQPQUU3Ft-NYK91oex14TSkCl7KwDinVrjE7tGGuEMlO_xMTTcJ9WQ2gFeMV_hOo6vkFRIc4eRWHhRifgZQPnMJfHOMeDKvEX5EIzEe0-Cc13dk1f7Jiz3=w352-h625-no?authuser=0 " alt="" class="img-fluid rounded">
+      </div>
+      <div class="col-md-6 ">
+        <h1 class="text-danger">Welcome To My Website</h1><br><br>
+        <h3>  Hi , I am SHILPA AJEESH M    </h3>
+        <h4> Computer Science & Engineering Student<br> KMCT CEW <br> Third year<br> Calicut,Kerala,India</h4>
+        <h5>Hobbies:Music,Dance,Reading,Drawing</h5>
+      </div>
+    </div>
+  </div>
+</section>
+<section class=" bg-light p-5"id="skills-section" >
+  <div class="container">
+    <h1 class="text-center">Skills</h1>
+    <div class="row pt-2">
+      <div class="col-md-4">
+      <div class="card" style="width: 18rem;">
+        <img class="card-img-top" src="https://lh3.googleusercontent.com/pw/ACtC-3cgkeGt-QfupvvF1Y-wTl-4XYim74gGI1T0VjpYbeqMTqOlW1SNXsMvLVKo38Gxk8VXTEns7BWgbhO4cwdBXK0HEZlMLZYjWbtGtah-JfpmBFcAr83M-BEuXYyJUxkLWtP_vynbt5cvmlMUEr-AL0Ee=s625-no?authuser=0 " width="150"  height="150" alt="Card image cap">
+        <div class="card-body">
+          <h3 class="card-title ">HTML</h3>
+        </div>
+      </div>
+      </div>
+      <div class="col-md-4">
+        <div class="card" style="width: 18rem;">
+          <img class="card-img-top" src="https://lh3.googleusercontent.com/pw/ACtC-3e79JyCn54EbpJGWDOVZsGrh3q6a-SYRKkwXmteUkuM5cwS-i8ne3arKmcOicjrOBpb2S3ygWVyl0wvtE9N89dAIY_KbPdUKJFcXjcHwAiBJ5ZOQrpzGYEql0zL6Ja9F550OeywAyESoKczRPLbMsGQ=w1125-h625-no?authuser=0 " width="150"  height="150"  alt="Card image cap">
+          <div class="card-body">
+            <h3 class="card-title ">CSS</h3>
+          </div>
+        </div>
+        </div>
+        <div class="col-md-4">
+          <div class="card" style="width: 18rem;">
+          <img class="card-img-top" src="https://lh3.googleusercontent.com/pw/ACtC-3eTIfZbenTfq6ijSFxInDQicwxiOHlhH1bE_3SWjk80WShjhRsmfCto6E8bELvA5x6OuzEhaegofwsohzUZ9kDi2yJSl3mWBHdksLoCrkV0pHY-xufDsnL9JYzurlFvKQgyaxj402ujaG8STxo4XrUh=w750-h422-no?authuser=0 " width="150"  height="150" alt="Card image cap">
+          <div class="card-body">
+            <h3 class="card-title ">C Programming</h3>
+          </div>
+          </div>
+        </div>
+    </div>
+    <div class="row pt-3">
+        <div class="col-md-4">
+          <div class="card" style="width: 18rem;">
+            <img class="card-img-top" src="https://lh3.googleusercontent.com/pw/ACtC-3cACD8OQjme7Hss3-DUzPnJfzh-RUnc3KHUiX5doOifqiYNL1yMRtkkaVHVllrDiigTFKnPeBvZtLg8IVpo-bR2qFLygoTvSsajerVPad7SUgle4mxHdiw2I-0TVra6JpWk6L5zdHNNOZI1Lcidn-T0=w1024-h579-no?authuser=0 " width="150"  height="150" alt="Card image cap">
+            <div class="card-body">
+              <h3 class="card-title ">PHP</h3>
+            </div>
+          </div>
+        </div>
+        <div class="col-md-4">
+          <div class="card" style="width: 18rem;">
+            <img class="card-img-top" src="https://lh3.googleusercontent.com/pw/ACtC-3dd9h6XYJugBMcOfMb_lhUlkkeFaDx6QndoaroNVhrq53YLHx126M9TKoNa7SzC1v0oJonXbA0rO5DNBMywtgtIANc_5IgGSp40BMJAK3YmfpSFMIuU4Xze7goTGrKHqISjTv2e5ZiKPMnC173_Kmre=w860-h480-no?authuser=0 " width="150"  height="150" alt="Card image cap">
+              <div class="card-body">
+                <h3 class="card-title ">Python</h3>
+              </div>
+          </div>
+        </div>
+        <div class="col-md-4">
+          <div class="card" style="width: 18rem;">
+            <img class="card-img-top" src="https://lh3.googleusercontent.com/pw/ACtC-3fFruxwnmsk3fZLEBnfwIhlxI5eWmEqavridREpWbBObJgFR2_VXDtZFD2kb8lyKP2_1XwMapswDPUy6pZ8Ez_fb-CTjQiSL8IV44amjTpepO8xkI_4uJLVUxPhLp9yoH45Amm8fv_3owD822m0UyqH=w744-h492-no?authuser=0 " width="150"  height="150" alt="Card image cap">
+              <div class="card-body">
+                <h3 class="card-title ">Java</h3>
+              </div>
+          </div>
+        </div> 
+    </div>               
+  </div>
+  </div>
+  <div class="container">
+    HTML 
+    <div class="progress">
+        <div class="progress-bar bg-primary" role="progressbar" style="width: 95%;" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100">95%</div>
+    </div>
+    CSS 
+    <div class="progress">
+        <div class="progress-bar bg-primary" role="progressbar" style="width: 85%;" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100">85%</div>
+    </div>
+    C PROGRAMMING
+    <div class="progress">
+        <div class="progress-bar bg-primary" role="progressbar" style="width: 92%;" aria-valuenow="92" aria-valuemin="0" aria-valuemax="100">92%</div>
+    </div>
+    PHP 
+    <div class="progress">
+        <div class="progress-bar bg-primary" role="progressbar" style="width: 60%;" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100">60%</div>
+    </div>
+    PYTHON
+    <div class="progress">
+        <div class="progress-bar bg-primary" role="progressbar" style="width: 90%;" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100">90%</div>
+    </div>
+    JAVA
+    <div class="progress">
+        <div class="progress-bar bg-primary" role="progressbar" style="width: 70%;" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100">70%</div>
+    </div><br><br>    
+</section>
+<section class="bg-dark p-5" id="education-section" >
+  <h1 class="text-center text-white">Education</h1>
+  <div class="container">
+    <div class="row pt-2">
+      <div class="col-md-4">
+        <div class="card" style="width: 18rem;">
+          <img class="card-img-top" src="https://lh3.googleusercontent.com/pw/ACtC-3efRCBkK6TXvjO3Qw1CDbdYUnI20Djq4W1MGp4UDTlohDRm9DNy4_Pcn3Ehpl1QytWo2O1BLwjPDs48CNlGwxk8jPD3Nhwncwr0frD_5CYGmm9uiM67BgHJQ9awyOz8mFzC4b6S6Avo743g8qe7dAP4=w704-h625-no?authuser=0 " width="150"  height="150" alt="Card image cap">
+          <div class="card-body">
+            <h3 class="card-title ">High School</h3>
+            <h5> GGVHSS FEROKE<br>BATCH:2013-2016<br>CLASS:10<br>GRADE:FULL A+</h5>
+          </div>
+        </div>
+        </div>
+        <div class="col-md-4">
+          <div class="card" style="width: 18rem;">
+            <img class="card-img-top" src="https://lh3.googleusercontent.com/pw/ACtC-3efRCBkK6TXvjO3Qw1CDbdYUnI20Djq4W1MGp4UDTlohDRm9DNy4_Pcn3Ehpl1QytWo2O1BLwjPDs48CNlGwxk8jPD3Nhwncwr0frD_5CYGmm9uiM67BgHJQ9awyOz8mFzC4b6S6Avo743g8qe7dAP4=w704-h625-no?authuser=0 " width="150"  height="150" alt="Card image cap">
+            <div class="card-body">
+              <h3 class="card-title ">Higher Secondary </h3>
+              <h5> GGVHSS FEROKE<br>BATCH:2016-2018<br>CLASS:11,12<br>PERCENTAGE:91%</h5>
+            </div>
+          </div>
+          </div>
+          <div class="col-md-4">
+            <div class="card" style="width: 18rem;">
+              <img class="card-img-top" src="https://lh3.googleusercontent.com/pw/ACtC-3e3RsecvlgD-TdOleWWc6F50z15brBUf2t_J2r0oM5RaHgSA0i4RkBUsESrm41xLqolQHa6pGnfsyVwLSVu3aRn6vDCpvg6k1rsXB6EAudgffDjGWSC64gIqM6e6snHI12-vlQL0Uct-u4iqOxzxOTC=w798-h350-no?authuser=0 " width="150"  height="150" alt="Card image cap">
+              <div class="card-body">
+                <h3 class="card-title ">College</h3>
+                <h5> KMCT CEW<br>BATCH:2018-2022<br>COURSE:CSE<br>CGPA:8.3</h5>
+              </div>
+            </div>
+            </div>
+  </div>
+</div>
+</body>
+</section>
+<section class="pt-3 bg-light" id="contact me-section" >
+  <h1 class="text-center">Contact Me</h1>
+<div class="container">
+  <div class="row">
+    <div class="col-md-12">
+    <form>
+      <div class="form-row">
+        <div class="form-group col-md-6 ">
+          <label for="inputEmail4">Name</label>
+          <input type="text" class="form-control" id="inputEmail4" placeholder="Name">
+        </div>
+        <div class="form-group col-md-6 ">
+          <label for="inputPassword4">Place</label>
+          <input type="text" class="form-control" id="inputPassword4" placeholder="Place">
+        </div>
+      </div>
+      <div class="form-row">
+        <div class="form-group col-md-6 ">
+          <label for="inputEmail4">Email</label>
+          <input type="email" class="form-control" id="inputEmail4" placeholder="Email">
+        </div>
+        <div class="form-group col-md-6 ">
+          <label for="inputPassword4">Number</label>
+          <input type="tel" class="form-control" id="inputPassword4" placeholder="Number">
+        </div>
+      </div>
+      <div class="form-group">
+        <label for="inputAddress">Message</label>
+        <textarea class="form-control" cols="30" rows="10" placeholder="Type here...."></textarea>
+      </div>
+      <div class="form-group text-center">
+      <button type="submit" class="btn btn-info">Submit</button>
+      </div>
+    </form>
+    </div>
+</div>
+</div>
+</section>
+<footer class="bg-dark">
+  <div class="container">
+    <div class="row">
+      <div class="col-md-12 text-center text-white">
+        <a href="https://www.facebook.com/profile.php?id=100026459491680">   <i class="fab fa-facebook-square"></i></a>
+        <a href="https://instagram.com/exo_____my__love?igshid=tgj8l4clujjj"><i class="fab fa-instagram"></i></a>
+        <a href="https://github.com/shilpaajeeshm "><i class="fab fa-github"></i></a>
+       <p>Copyright</p>
+       <h3>
+        <marquee height="40" vspace="30" bgcolor="lilac">
+          <font color="#ffffff">THANKS FOR THE VISIT</font>
+       </marquee>
+      </h3>
+      </div>
+    </div>
+  </div>
+</footer>
+    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
+</body>
+</html>