From f6adb1576b47fdd174e1cddbc16b8a0601ff85f4 Mon Sep 17 00:00:00 2001
From: Abhinav Mishra <abhinavmishra3322@gmail.com>
Date: Sat, 2 Dec 2023 21:55:33 +0530
Subject: [PATCH] Update website layout and add container for upcoming projects

---
 index.html | 17 ++++++++++-------
 styles.css | 18 ++++++++++++++++++
 2 files changed, 28 insertions(+), 7 deletions(-)
diff --git a/index.html b/index.html
index f40887e..8745b7b 100644
--- a/index.html
+++ b/index.html
@@ -10,15 +10,18 @@
   <title>Abhinav Mishra's Portfolio</title>
 </head>
 <body>
+  <div class="container">
+    <p>Things I'm currently working on:</p>
+    <ul>
+      <li><a href="projects/slots-game.html">A match three game using graph algorithm</a></li>
+      <li><a href="index.html">This website!</a></li>
+      <li><a href="project3.html">Project 3</a></li>
+      <a href="upcoming.html"><h2>Upcoming Projects</h2></a>
+    </ul>
+  </div>
   <script src = "scripts/indexscript.js"></script>
   <script src = "word-change.js"></script>
-  <p>Things I'm currently working on:</p>
-  <ul>
-    <li><a href="projects/slots-game.html">A match three game using graph algorithm</a></li>
-    <li><a href="index.html">This website!</a></li>
-    <li><a href="project3.html">Project 3</a></li>
-    <a href="upcoming.html"><h2>Upcoming Projects</h2></a>
-  </ul>
+
   <footer id="footer"></footer>
   <script>
     // Fetch and include footer
diff --git a/styles.css b/styles.css
index 736ba19..9f8a97f 100644
--- a/styles.css
+++ b/styles.css
@@ -69,3 +69,21 @@ a:hover {
   transform: scale(1.2); /* Scale up on hover */
   color: #ff6347; /* Change color on hover */
 }
+
+
+.container {
+  background-color: #ffffff; /* Background color of the box */
+  border-radius: 15px; /* Rounded corners */
+  padding: 20px; /* Padding inside the box */
+  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1); /* Box shadow for a slight elevation effect */
+  max-width: 400px; /* Adjust the maximum width as needed */
+}
+
+/* Centering the container */
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+}
\ No newline at end of file
