a

index.html

@@ -39,7 +39,7 @@ <h1 class="header">Home</h1>
       <h1 class="header">About</h1>
       <div class="hero">
         <div class="container">
-          <img src="images/self.png" alt="pfp.png", class="wrap-image">
+          <img src="images/self.png" alt="pfp.png" class="wrap-image">
           <!-- <div class="shifted"> -->
             <p>Hi, I'm Evan. I am an Electrical Engineering and Computer Science (EECS) master's student at UC Berkeley, advised by Professor <a href="https://people.eecs.berkeley.edu/~jiantao/">Jiantao Jiao</a>. I also completed my bachelor's degree in computer science at Berkeley.</p>
             <br>

style.css

@@ -12,16 +12,23 @@
   --body-font: 'Courier New', serif;
   --body-font-weight: normal;
   --site-width: 40%;
+  @media only screen and (max-width: 600px) {
+    --site-width: 90%;
+  }
 
   /* TODO: color scheme */
   --clr-bg: #1e1f1e;
   --clr-fg: #d1cdc3;
-  --clr-accent: #2069e0;
+  /* --clr-accent: #5b5de5; */
+  /* --clr-accent: #c7881c; */
+  --clr-accent: #628e81;
+  /* --clr-accent: #927cae; */
   --clr-medium: #878683;
 }
 
 html {
   scroll-behavior: smooth;
+  scroll-padding-top: 80px;
 }
 
 body {
@@ -53,6 +60,16 @@ body {
 
 }
 
+a {
+  color: var(--clr-accent);
+  text-decoration: none;
+  font-weight: bold;
+}
+
+a:hover {
+  text-decoration: underline;
+}
+
 section {
   width: 100%;
   /* height: 30vh; */
@@ -80,10 +97,13 @@ section styles
   /* display: inline-block; */
   display: flex;
   justify-content: center;
+  position: fixed;
+  z-index: 1;
 
   .nav {
+    /* top: 4vh; */
     /* position: absolute;
-    top: 4vh;
+
     left: 4vw; */
 
 
@@ -99,9 +119,10 @@ section styles
       gap: 20px;
 
       .link {
+        color: var(--clr-fg);
         text-decoration: none;
         font-family: var(--header-font);
-        font-weight: var(--body-font-weight);
+        /* font-weight: var(--body-font-weight); */
       }
     }
     .hide {
@@ -111,6 +132,7 @@ section styles
 }
 
 #about {
+  padding-top: 5%;
   .hero {
     .container {
       position: relative;
@@ -130,7 +152,7 @@ section styles
 
     }
     p {
-      text-align: justify;
+      /* text-align: justify; */
     }
       /* border: 1px solid white;
       display: flex;