Update index.html

index.html

@@ -74,7 +74,23 @@
       background-color: #fff;
       box-shadow: 0 2px 4px 0 rgba(0,0,0,.3);
     }
-
+    #backToTopBtn {
+      display: none;
+      position: fixed;
+      bottom: 20px;
+      right: 20px;
+      background-color: #007bff;
+      color: #fff;
+      border: none;
+      border-radius: 5px;
+      padding: 10px 15px;
+      cursor: pointer;
+      font-size: 16px;
+    }
+
+    #backToTopBtn:hover {
+      background-color: #0056b3;
+	    }
     footer {
       text-align: center;
       padding: 20px;
@@ -98,7 +114,34 @@
   </nav>
 <div>
    <br><br><h2 style="background-color: #80008027; padding: 10px; text-align:center; border: 3px solid #800080; border-radius: 8px;">Currency Converter</h2>
+<div class="greeting" ><svg xmlns="http://www.w3.org/2000/svg" x="0" y="0" version="1.1" viewBox="0 0 106.059 106.059"><path d="M90.546 15.518c-20.688-20.69-54.346-20.69-75.03-.005-20.688 20.685-20.686 54.345.002 75.034 20.682 20.684 54.34 20.684 75.026-.004 20.686-20.685 20.684-54.343.002-75.025zm-5.789 69.24c-17.493 17.494-45.961 17.496-63.455.002-17.498-17.497-17.495-45.966 0-63.46 17.494-17.493 45.96-17.495 63.457.002 17.494 17.494 17.492 45.963-.002 63.456zM33.299 44.364h-3.552a.822.822 0 0 1-.82-.817c0-.184.062-.363.175-.507l7.695-9.755c.158-.196.392-.308.645-.308s.486.111.641.304l7.697 9.757c.189.237.229.58.1.859a.822.822 0 0 1-.741.467h-3.554a.59.59 0 0 1-.463-.225l-3.68-4.664-3.681 4.664a.59.59 0 0 1-.462.225zm44.599-1.326a.84.84 0 0 1 .1.859.822.822 0 0 1-.741.467h-3.554a.588.588 0 0 1-.463-.225l-3.681-4.664-3.681 4.664a.59.59 0 0 1-.462.225h-3.552a.822.822 0 0 1-.82-.817c0-.184.062-.363.175-.507l7.695-9.755a.823.823 0 0 1 .645-.308c.254 0 .486.111.642.304l7.697 9.757zm-1.882 21.03c-3.843 8.887-12.843 14.629-22.927 14.629-10.301 0-19.354-5.771-23.064-14.703a3 3 0 1 1 5.54-2.3c2.776 6.686 9.655 11.004 17.523 11.004 7.69 0 14.528-4.321 17.42-11.011a2.999 2.999 0 0 1 3.944-1.563 2.999 2.999 0 0 1 1.564 3.944z"/></svg><span id="greeting"/></div>
+
+   <style>
+ svg{width:16px;height:16px;margin-right:6px}
+#greeting .greeting{font-size:14px}
+.greeting{display:inline-flex;align-items:center;margin:10px 0;padding:12px 15px;outline:0;border:0;border-radius:20px;line-height:20px;font-size:14px;white-space:nowrap;overflow:hidden;max-width:320px;box-shadow:-6px -6px 14px rgba(255,255,255,.7),-6px -6px 10px rgba(255,255,255,.5),6px 6px 8px rgba(255,255,255,.075),6px 6px 10px rgba(0,0,0,.15)}
+.drK  .greeting{box-shadow:0 10px 40px rgba(0,0,0,.2);color:#fefefe} 
+ </style>
+
+<script type='text/javascript'>/*<![CDATA[*/
+ function greetings() {
+  var message = "";
+  var time = new Date().getHours();
+
+  if (time >= 4 && time < 12) {
+    return (message = "Good Morning :)");
+  } else if (time >= 12 && time < 16) {
+    return (message = "Good Afternoon :)");
+  } else if (time >= 16 && time < 19) {
+    return (message = "Good Evening :)");
+  } else {
+    return (message = "Have a sweet dream :)");
+  }
+}
+
+document.getElementById("greeting").innerHTML = greetings();
 
+/*]]>*/</script><br>
 <h2><u>Purpose:</u></h2>
 <p>The purpose of this project is to create a currency converter that can convert the value of one currency into another based on the current market rates. This project is useful for travelers, businesses, and forex traders who need to exchange currencies or track the changes in exchange rate valuations. This project also demonstrates the concept of object-oriented programming in C++, which is a powerful and widely used programming paradigm that allows for the creation of modular, reusable, and maintainable code.</p><br>
 
@@ -853,7 +896,30 @@ <h2><u>Dependencies, Limitations, and Assumptions:</h2></u>
     </pre>
     <button class="copy-button" onclick="copyCode()">Copy Code</button>
   </div>
+ <button id="backToTopBtn">Top</button>
+
+  <script>
+    document.addEventListener("DOMContentLoaded", function() {
+      var backToTopButton = document.getElementById("backToTopBtn");
+
+      window.onscroll = function() {
+        scrollFunction();
+      };
+
+      function scrollFunction() {
+        if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
+          backToTopButton.style.display = "block";
+        } else {
+          backToTopButton.style.display = "none";
+        }
+      }
 
+      backToTopButton.addEventListener("click", function() {
+        document.body.scrollTop = 0;
+        document.documentElement.scrollTop = 0;
+      });
+    });
+	</script>
   <script>
     function copyCode() {
       var codeContent = document.getElementById('code-content');