add files

donamath · May 20, 2021 · 4303e35 · 4303e35
1 parent 8f99159
commit 4303e35
Show file tree

Hide file tree

Showing 8 changed files with 280 additions and 2 deletions.
diff --git a/BootCamp.html b/BootCamp.html
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+
+<!-- Web Dev Bootcamp -->
+
+<html>
+<!-- head -->
+  <head>
+    <title>Resume</title>
+
+    <style type="text/css">
+      h2,h1,p{
+        color: blue;
+      }
+      #dob{
+        border:dashed violet;
+        color: red;
+      }
+      .fun{
+        color: rgb(120,67,130);
+        text-align: right;
+
+      }
+      /**{
+        text-align: center;
+      }*/
+      .section{
+        background-color: rgb(30,87,67);
+        padding:30px 20px;
+      }
+    </style>
+
+  </head>
+
+<!-- body -->
+  <body style="background-color:lightblue"> 
+  <div class="section">
+    <h1 class="fun">RESUME</h1>
+    <h2>John Doe</h2>
+    <p><i> Web Develepor</i></p>
+    <a href="https://www.linkedin.com/in/ashly-elizabeth-sunny-6a50721ab/">LinkedIn Profile</a></br>
+    <br/>
+    <p id="dob"> <strong>Birth  Date </strong> :09/09/2001</p>
+    <p> <strong>Address:</strong> Abc street,789312</p>
+    <p> <strong>Phone:</strong> 8129595788</p>
+    <p> <strong>Email:</strong> [email protected]</p><br>
+  </div>
+    <img src="john.jpg" alt="image unavailable" width="100" height="150">
+    <h2>Professional Experiences</h2>
+    <ul> 
+      <li><h3 style="background-color:red">Web producer</h3></li>
+      <p class="fun">Lenovo. from 2015 to 2018</p>
+      <p>
+        <!-- emphasis -->
+        <em>As a producer.</em><br>I coordinated the production team in order to keep all the content up to date.
+      </p>
+    </ul>
+    <h2> Education </h2> 
+    <ul> 
+      <li><h3>UG from Kerala technological university</h3></li>
+      <p>Graduation in computer science and engineering. from 2011 to 2015</p>
+    </ul>
+    <h2> Languages </h2> 
+    <ul> 
+      <li>English</li>
+      <li>Arabic</li>
+    </ul>
+  <body>
+
+</html>
diff --git a/BootCamp1.html b/BootCamp1.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<!-- Inline-block elements -->
+<!DOCTYPE html>
+<html>
+<head>
+	<title>My page</title>
+	<style type="text/css">
+		.cd{
+			display:inline;
+			color: red;
+			width: 100px;
+			height: 100px;
+			border:1px blue;
+			background-color: yellow;
+		}
+		.dec{
+			display:inline-block;
+			color: red;
+			width: 100px;
+			height: 100px;
+			border:1px blue;
+			background-color: orange;
+
+		}
+		.spd{
+			display:block;
+			color: red;
+			width: 100px;
+			height: 100px;
+			border:1px blue;
+			background-color: grey;
+		}
+		.list li{
+			display: inline-block;
+		}
+	</style>
+</head>
+<body>
+	<div>
+		<h1>Covid-19</h1>
+		<p>
+			Coronavirus disease 2019, also known as the coronavirus or <span class="cd">COVID</span>, is a contagious disease caused by severe acute respiratory syndrome coronavirus 2. The first known case was identified in Wuhan, China, in <span class="dec">December 2019</span>. The disease has since <span class="spd">spread</span> worldwide, leading to an ongoing pandemic.Wikipedia
+Symptoms:
+Fever, cough, fatigue, shortness of breath, vomiting, loss of taste or smell, some cases asymptomatic
+		</p>
+		<ul class="list">
+			<li>home</li>
+			<li>about</li>
+			<li>contact</li>
+		</ul>
+	</div>
+
+</body>
+</html>
diff --git a/HowItWorksPage.html b/HowItWorksPage.html
@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<!-- Developed by Dona Mathew -->
+<html lang="en">
+<head>
+  <title>How it works</title>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
+  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
+  <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://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
+  <script src='https://kit.fontawesome.com/a076d05399.js'></script>
+</head>
+<style>
+.card-header{
+	font-weight: 800;
+	font-size: xx-large;
+	background-color: none;
+}
+#Steps {
+	color:#454240;
+	font-weight:bold;
+}
+#desc {
+	color:#786f68;
+}
+.fa,.fas,.fa-clock-o{
+	margin: 0;
+	/*position:relative;*/
+	top: 50%;
+	left: 50%;
+	-ms-transform: translate(-50%, -50%);
+	transform: translate(-50%, -50%);
+	background-color: #ffbb99;
+	border-radius: 50%;
+	border: none;
+	padding: 10px;
+}
+.row_height{
+	height: 70px;
+	display: table;
+}
+.icon_span{
+	display: table-cell;
+    vertical-align: middle;
+}
+.text{
+	position: absolute;
+    padding: 0px 0 0 50px;
+}
+</style>
+<body>
+	<div class="container">
+		<br>
+	  <div class="card">
+	    <div class="card-header"><b>How it works</b></div>
+	    <div class="card-body">
+			<div class="col-xs-12 col-md-12">
+			  	<div class="col-xs-3 col-md-12 row_height">
+			  		<span class="icon_span"><i class="fa fa-pencil-square-o" ></i></span>
+			  	</div>
+			  	<div class="col-xs-9 col-md-12 row_height text">
+			  		<span id="Steps">Choose a Salon service</span><br>
+					<span id="desc">Select from various salon packages & services</span><hr>
+				</div>
+
+			</div>
+			<div class="col-xs-12 col-md-12">
+			  	<div class="col-xs-3 col-md-12 row_height">
+			  		<span class="icon_span"><i class="fa fa-clock-o"></i></span>
+			  	</div>
+			  	<div class="col-xs-9 col-md-12 row_height text"><span id="Steps">Choose your time-slot</span><br>
+					<span id="desc">We service from 9am-7pm</span><hr>
+				</div>
+			</div>
+			<div class="col-xs-12 col-md-12">
+			  	<div class="col-xs-3 col-md-12 row_height">
+			  		<span class="icon_span"><i class='fas fa-user-check'></i></span>
+			  	</div>
+			  	<div class="col-xs-9 col-md-12 row_height text"><span id="Steps">Relax and enjoy Salon service</span><br>
+					<span id="desc">Our professionals will get in touch with you an hour before the service<br></span><br>
+				</div>
+			</div>
+	    </div>
+	  </div>
+	</div>
+</body>
+</html>
diff --git a/google.html b/google.html
@@ -6,7 +6,7 @@
 	<title>Google Search</title>
 	<link rel="stylesheet" type="text/css" href="google.css">
 	<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
-
+	
 </head>
 <body>
 <!-- 	The <section> tag defines a section in a document-->	
@@ -68,6 +68,6 @@
 			</div>
 		</div>
 	</section>
-
+	<script type="text/javascript" src="google.js"></script>
 </body>
 </html>
diff --git a/google.js b/google.js
@@ -105,4 +105,24 @@ console.log(`My age\t is ${a}.\n What\bab\\t y?`);
 
 /***********************************************************************/
 
+// Declare the myGlobal variable below this line
+var myGlobal=10;
+
+function fun1() {
+  // Assign 5 to oopsGlobal Here
+var oopsGlobal=5;
+}
+
+// Only change code above this line
+
+function fun2() {
+  var output = "";
+  if (typeof myGlobal != "undefined") {
+    output += "myGlobal: " + myGlobal;
+  }
+  if (typeof oopsGlobal != "undefined") {
+    output += " oopsGlobal: " + oopsGlobal;
+  }
+  console.log(output);
+}
 
diff --git a/john.jpg b/john.jpg
diff --git a/mine.css b/mine.css
@@ -0,0 +1,5 @@
+.myDiv,.mine {
+  border: 5px outset red;
+  background-color: lightblue;    
+  text-align: center;
+}
diff --git a/mine.html b/mine.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<title>Facebook Login</title>
+	<style >
+		body{
+
+  font-family:cursive;
+		}
+		div{
+			padding-left: 150px;
+			font-size:"7";
+		}
+		h3{
+			font-family:initial;
+		}
+		/*form.am{
+			align-content: right;
+		}*/
+	</style>
+</head>
+<body style="background-color:rgb(248, 237, 242); ">
+	<div>
+	<br><br><br><br><br><br>
+	<h1 style="color:rgb(204, 102, 153);">FaceBook</h1>
+	<h3 style="color:black;">Facebook helps you connect and share<br>
+	with the people in your life.</h3>
+</div><br><br>
+			<form style="padding-left: 750px;padding-top:10px;">
+  <label  for="fname">Email address or phone number:</label><br>
+  <input type="text" id="fname" name="fname" ><br>
+  <label for="lname">Password:</label><br>
+  <input type="text" id="lname" name="lname" value=""><br><br>
+  <input type="submit" value="Log In" style="background-color: rgb(205, 126, 162);">
+</form>
+
+
+
+</body>
+</html>