commit 5c71714f4ea64e6204ed7b54b83d5829c185733e
parent a243ed6d373ce55559d806266048aa4d59bd1245
Author: Christian Ermann <christianermann@gmail.com>
Date: Fri, 12 Jun 2020 13:51:28 -0600
Fonts, Color scheme, spacing, etc.
Diffstat:
3 files changed, 53 insertions(+), 11 deletions(-)
diff --git a/index.html b/index.html
@@ -8,6 +8,8 @@
<title>Christian Ermann</title>
<link rel="stylesheet" href="styles.css"/>
+
+ <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Open+Sans&family=Rokkitt:wght@300&display=swap"/>
</head>
<body>
@@ -18,11 +20,11 @@
physics, and computer science. In addition to academics, I also compete
on the L&C Men's Varsity Crew Team.</p>
<p>You can contact me at <a href="mailto:christianermann@gmail.com">
- christianermann@gmail.com</a></p>
+ christianermann@gmail.com</a>.</p>
</div>
<div id="right-column">
<div id="projects">
- <h2>Check out my projects!</h2>
+ <h2>Check out my projects:</h2>
<ul>
<li>
<a href="https://github.com/c2000e/Polygonize">Polygonize</a>
diff --git a/profile.jpg b/profile.jpg
Binary files differ.
diff --git a/styles.css b/styles.css
@@ -1,23 +1,43 @@
-@media only screen and (max-width: 800px) {
- body {
- flex-direction: column;
- align-items: center;
- }
-}
-
* {
margin: 0;
padding: 0;
box-sizing: border-box;
+ background-color: #EAE7DC;
+}
+
+h1,h2 {
+ font-family: 'Rokkitt', serif;
}
ul {
list-style-type: none;
}
+a {
+ text-decoration: none;
+}
+
+a:link {
+ color: #E98074;
+}
+
+a:visited {
+ color: #E98074;
+}
+
+a:hover {
+ color: #E85A4F;
+}
+
body {
+ margin: 10px 10px 10px 10px;
display: flex;
justify-content: center;
+ font-family: 'Open Sans', sans-serif;
+}
+
+div {
+ padding-bottom: 20px;
}
#about {
@@ -29,14 +49,16 @@ body {
}
#about img {
- max-width: 50%;
- height: auto;
+ max-width: 40%;
+ border-radius: 50%;
align-self: center;
}
+
#right-column {
max-width: 400px;
width: 100%;
+ padding-left: 85px;
display: flex;
flex-direction: column;
flex: 1;
@@ -49,9 +71,27 @@ body {
flex: 1 1 auto;
}
+#projects ul li p {
+ padding-left: 10px;
+}
+
#achievements {
display: flex;
flex-direction: column;
align-items: flex-start;
flex: 1 1 auto;
}
+
+#achievements ul li ul{
+ padding-left: 10px;
+}
+
+@media only screen and (max-width: 820px) {
+ body {
+ flex-direction: column;
+ align-items: center;
+ }
+ #right-column {
+ padding-left: 0px;
+ }
+}
