Added Homework 7 Files

++ Added Homework 7 HTML/CSS/JS
++ Added Testing Files of various sorts.

cs212/testing/digital-clock/index.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset = "utf-8">
+        <title> Digital Clock Using JavaScript </title>
+        <link rel = "stylesheet" href = "styles.css">
+    </head>
+    <body>
+        <div id = "digital-clock"> </div>
+        <script src = "script.js"> </script>
+    </body>
+</html>

cs212/testing/digital-clock/script.js

@@ -0,0 +1,56 @@
+function Time() {
+
+  // Creating object of the Date class
+  var date = new Date();
+
+  // Get current hour
+  var hour = date.getHours();
+  // Get current minute
+  var minute = date.getMinutes();
+  // Get current second
+  var second = date.getSeconds();
+
+  // Variable to store AM / PM
+  var period = "";
+
+  // Assigning AM / PM according to current hour
+  if (hour >= 12) {
+      period = "PM";
+  } else {
+      period = "AM";
+  }
+
+  // Converting the hour in 12-hour format
+  if (hour == 0) {
+      hour = 12;
+  } else {
+      if (hour > 12) {
+          hour = hour - 12;
+      }
+  }
+
+  // Updating hour, minute, and second
+  // if they are less than 10
+  hour = update(hour);
+  minute = update(minute);
+  second = update(second);
+
+  // Adding time elements to the div
+  document.getElementById("digital-clock").innerText = hour + " : " + minute + " : " + second + " " + period;
+
+  // Set Timer to 1 sec (1000 ms)
+  setTimeout(Time, 1000);
+}
+
+// Function to update time elements if they are less than 10
+// Append 0 before time elements if they are less than 10
+function update(t) {
+  if (t < 10) {
+    return "0" + t;
+  }
+  else {
+    return t;
+  }
+}
+
+Time();

cs212/testing/digital-clock/styles.css

@@ -0,0 +1,20 @@
+/* Importing Open Sans Condensed Google font */
+@import url('https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300&display=swap');
+
+
+#digital-clock {
+  background-color: #66ffff;
+  width: 35%;
+  margin: auto;
+  padding-top: 50px;
+  padding-bottom: 50px;
+  font-family: 'Open Sans Condensed', sans-serif;
+  font-size: 64px;
+  text-align: center;
+  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+}
+Footer
+© 2023 GitHub, Inc.
+Footer navigation
+Terms
+Priv

cs212/testing/html/q1.html

@@ -0,0 +1,60 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<link rel="stylesheet" href="style.css">
+</head>
+<body>
+
+<h1>Tech Company's Listing</h1>
+
+<table id="cssQuestion">
+  <tr>
+    <th>Company</th>
+    <th>CEO</th>
+    <th>Country</th>
+  </tr>
+  <tr>
+    <td>Apple</td>
+    <td>Tim Cook</td>
+    <td>USA</td>
+  </tr>
+  <tr>
+    <td>Google</td>
+    <td>Sundar Pichai</td>
+    <td>USA</td>
+  </tr>
+  <tr>
+    <td>Netflix</td>
+    <td>Reed Hastings</td>
+    <td>UK</td>
+  </tr>
+  <tr>
+    <td>Zoho</td>
+    <td>Sridhar Vembu</td>
+    <td>India</td>
+  </tr>
+  <tr>
+    <td>TCS</td>
+    <td>Rajesh Gopinath</td>
+    <td>India</td>
+  </tr>
+  <tr>
+    <td>Microsoft</td>
+    <td>Satya Nadella</td>
+    <td>USA</td>
+  </tr>
+  <tr>
+    <td>Facebook</td>
+    <td>Mark Zuckerberg</td>
+    <td>USA</td>
+  </tr>
+  <tr>
+    <td>Twitter</td>
+    <td>Jack Dorsey</td>
+    <td>USA</td>
+  </tr>
+</table>
+
+</body>
+</html>

cs212/testing/html/q2.html

@@ -0,0 +1,30 @@
+
+<!DOCTYPE html>
+<html>
+<head>
+<link rel="stylesheet" href="style.css">
+</head>
+<body>
+
+<h1>Ordered HTML list of Richest people in the world</h1>
+<ol>
+  <li>Jeff Bezos</li>
+  <li>Elon Musk</li>
+  <li>Bernard Arnault</li>
+  <li>Bill Gates</li>
+  <li>Mark Zuckerberg</li>
+</ol>
+<h1>Unordered HTML list of Web technologies</h1>
+<ul>
+  <li>HTML</li>
+  <li>CSS</li>
+  <li>Vanilla JS</li>
+  <li>Node.js</li>
+  <li>React JS</li>
+  <li>Express.js</li>
+  <li>Next.js</li>
+  <li>Vue.js</li>
+</ul>
+
+</body>
+</html>

cs212/testing/html/style.css

@@ -0,0 +1,24 @@
+table
+{
+  border: 1px solid #ddd;
+  padding: 8px;
+  border-collapse: collapse;
+  width: 100%;
+}
+th
+{
+  border: 1px solid #ddd;
+  padding-top: 12px;
+  padding-bottom: 12px;
+  text-align: left;
+  color: royalblue;
+  background-color: skyblue;
+}
+td
+{
+  border: 1px solid #ddd;
+}
+tr:nth-child(even)
+{
+  background-color: #f2f2f2
+}