Update index.html

blakebyer · Jul 4, 2024 · 27923bc · 27923bc
1 parent 318d374
commit 27923bc
Showing 1 changed file with 75 additions and 59 deletions.
diff --git a/docs/index.html b/docs/index.html
@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Blake Byer</title>
+    <title>Blake Byer - Home</title>
     <style>
         body {
             font-family: Arial, sans-serif;
@@ -31,78 +31,95 @@
             margin: 0;
             font-size: 2.5em;
         }
-        p {
-            margin-bottom: 15px;
+        nav {
+            margin-top: 10px;
         }
-        footer {
-    text-align: center;
-    padding: 10px 0;
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    background-color: #333;
-    color: #fff;
-    }
-    section {
-            margin-top: 20px; /* Add space between image and header */
+        nav ul {
+            list-style: none;
+            padding: 0;
+            display: flex;
+            justify-content: center;
+        }
+        nav ul li {
+            margin: 0 10px;
+        }
+        nav ul li a {
+            text-decoration: none;
+            color: #fff;
+            background-color: #333;
+            padding: 10px 20px;
+            border-radius: 5px;
+            transition: background-color 0.3s;
         }
-    img {
-        width: 100%;
-        max-width: 300px;
-        display: block;
-        margin: 0 auto;
-        border-radius: 5px; /* Rounded corners for the image */
+        nav ul li a:hover {
+            background-color: #555;
+        }
+        section {
+            margin-top: 20px;
+        }
+        img {
+            width: 100%;
+            max-width: 300px;
+            display: block;
+            margin: 0 auto;
+            border-radius: 5px;
         }
         .button-container {
-    display: flex;
-    justify-content: space-between; /* Spread items evenly across the width */
-    margin-top: 10px; /* Add margin between buttons and other content */
-    }
-
-    .button {
-    padding: 10px 20px;
-    background-color: #333; /* Black background */
-    color: #fff; /* White text color */
-    text-decoration: none;
-    border-radius: 5px;
-    border: none;
-    cursor: pointer;
-    transition: background-color 0.3s;
-    text-align: center; /* Center text */
-    flex: 1; /* Take up equal space */
-    max-width: 200px; /* Limit maximum width of buttons */
-    }
+            display: flex;
+            justify-content: space-between;
+            margin-top: 10px;
+        }
+        .button {
+            padding: 10px 20px;
+            background-color: #333;
+            color: #fff;
+            text-decoration: none;
+            border-radius: 5px;
+            border: none;
+            cursor: pointer;
+            transition: background-color 0.3s;
+            text-align: center;
+            flex: 1;
+            margin: 0 5px;
+            max-width: 200px;
+        }
         .button:hover {
-            background-color: #555; /* Darker shade on hover */
+            background-color: #555;
+        }
+        footer {
+            text-align: center;
+            padding: 10px 0;
+            position: fixed;
+            bottom: 0;
+            left: 0;
+            right: 0;
+            background-color: #333;
+            color: #fff;
         }
     </style>
 </head>
 <body>
     <div class="container">
-    <header>
-        <h1>Blake Byer</h1>
-        <nav>
-            <ul>
-                <li><a href="#Home">Home</a></li>
-                <li><a href="#Blog">Blog</a></li>
-            </ul>
-        </nav>
-    </header>
-        <section id="Home">
+        <header>
+            <h1>Blake Byer</h1>
+            <nav>
+                <ul>
+                    <li><a href="home.html">Home</a></li>
+                    <li><a href="blog.html">Blog</a></li>
+                </ul>
+            </nav>
+        </header>
+        <section>
             <h2>Home</h2>
             <img src="profile.jpg" alt="Profile Photo">
             <p>Hello, I'm Blake Byer. I am a student at the University of Kentucky. I study neuroscience, biology, and computer science.</p>
             <p>Feel free to browse around!</p>
-            <a href=https://github.com/blakebyer class="button">Projects</a>
-            <a href=curriculum_vitae.pdf class="button">Curriculum Vitae</a>
-            <a href=https://www.memreneuro.org/ class="button">memRE</a>
+            <div class="button-container">
+                <a href="https://github.com/blakebyer" class="button">Projects</a>
+                <a href="curriculum_vitae.pdf" class="button">Curriculum Vitae</a>
+                <a href="https://www.memreneuro.org/" class="button">memRE</a>
+            </div>
         </section>
-
-            <section id="Blog">
-        <h2>Blog</h2>
-        <p>Content of your blog goes here.</p>
-            </section>
         <footer>
             &copy; Blake Byer <span id="currentYear"></span>
         </footer>
@@ -112,7 +129,6 @@ <h2>Blog</h2>
     <script>
         document.getElementById('currentYear').textContent = new Date().getFullYear();
     </script>
-    </div>
 </body>
 </html>