first commit

ComputerCell · Feb 8, 2020 · 8d89cf4 · 8d89cf4
commit 8d89cf4
Show file tree

Hide file tree

Showing 4 changed files with 151 additions and 0 deletions.
diff --git a/Index.html b/Index.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<title>Day of Birth Calculator</title>
+	<link rel="stylesheet" type="text/css" href="style.css">
+</head>
+<body>
+	<center>
+	<h1>Check Your Day Of Birth</h1>
+
+	<div class="calculator">
+		<input type="number" id="user-day" placeholder="DD">
+		<input type="number" id="user-month" placeholder="MM">
+		<input type="number" id="user-year" placeholder="YYYY"><br>
+		<button id="submit-date">Tell me the day Please!</button>
+	</div>
+
+	<div id="message"></div>
+	<script src="myscript.js"></script>
+	<div id="spacer"></div>
+    </center>
+	<marquee style="font-size: 40px; width: 80%; color: blue">|*____________Coded by Mxhr_____________*|</marquee>
+</body>
+</html>
diff --git a/README.md b/README.md
@@ -0,0 +1 @@
+Day Of Birth
diff --git a/myscript.js b/myscript.js
@@ -0,0 +1,27 @@
+var userMonth = document.getElementById("user-month");
+var userDay = document.getElementById("user-day");
+var userYear = document.getElementById("user-year");
+var submitButton = document.getElementById("submit-date");
+
+submitButton.addEventListener("click", function(evt) {
+	var message = document.getElementById('message');
+    var parsedMonth = (parseInt(userMonth.value)-1);
+	var parsedDay = parseInt(userDay.value);
+	var parsedYear = parseInt(userYear.value);
+
+	var months = ["January","February","March","April","May","June","July","August","September","October","November","December"];
+    var weekday = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"];
+    var dateIs = new Date(parsedYear, parsedMonth, parsedDay);
+    var weekdayIs = weekday[dateIs.getDay()];
+    var monthIs = months[parsedMonth];
+
+    if (weekdayIs === undefined || monthIs === undefined) {
+    	message.innerText= "";
+    	setTimeout(function() {
+    		message.innerText="Please enter a valid date!";}, 500)
+    }
+    else{
+    	message.innerText = weekdayIs +" , "+ monthIs + " " + parsedDay + " , " +parsedYear;
+    }
+
+})
diff --git a/style.css b/style.css
@@ -0,0 +1,99 @@
+body{
+	margin-left: 95px;
+	margin-top: 145px;
+}
+
+h1{
+	font-size: 45px;
+	font-weight: 800;
+	background: green;
+	color: #fff;
+	margin-bottom: 3px;
+	width: 505px;
+	padding: 7px;
+	border-radius: 10px;
+}
+
+.calculator{
+	margin-top: 30px; 
+}
+
+input{
+	width: 250px;
+	margin: 2px 0px;
+	font-size: 20px;
+	text-align: center;
+}
+#user-month{
+	width: 195px;
+	height: 45px;
+	text-align: center;
+}
+#user-day{
+	width: 195px;
+	height: 45px;
+	text-align: center;
+}
+#user-year{
+	width: 195px;
+	height: 45px;
+	text-align: center; 
+}
+
+#submit-date{
+	width: 605px;
+	height: 55px;
+	margin-top: 30px;
+	padding: 10px;
+	border: none;
+	border-radius: 2px;
+	font-size: 18px;
+	background: #27ACD9;
+	font-weight: 500;
+	color: #fff;
+
+}
+
+#message{
+	margin: 20px 0px;
+	font-size: 50px;
+	font-weight: 800;
+}
+
+#submit-date:hover{
+	background: purple;
+}
+
+#spacer{
+	padding-top: 30px;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+