remove borders, clean code

This commit is contained in:
Tyler Koenig
2021-05-17 18:20:40 -04:00
parent 3ec16109f2
commit 8aeff7ecc5

View File

@@ -3,7 +3,7 @@ body {
color: #c9cacc; color: #c9cacc;
background-color: #1b1b1b; background-color: #1b1b1b;
font-size: 15px; font-size: 15px;
font-family: "Source Code Pro", monospace; font-family: "Source Code Pro", monospace, Arial, Helvetica, sans-serif;
font-weight: 400; font-weight: 400;
line-height: 1.725; line-height: 1.725;
text-rendering: geometricPrecision; text-rendering: geometricPrecision;
@@ -21,7 +21,6 @@ body {
nav a { nav a {
text-decoration: none; text-decoration: none;
/* border: 1px solid yellow; */
border-radius: 500px; border-radius: 500px;
padding: 0.2rem; padding: 0.2rem;
font-weight: 600; font-weight: 600;
@@ -39,10 +38,6 @@ nav ul {
nav a:hover { nav a:hover {
background-color: #2a9d8f; background-color: #2a9d8f;
/* background-position-y: -20em; */
/* background-position: bottom; */
/* border-radius: 500px; */
transition: 150ms ease; transition: 150ms ease;
} }
@@ -65,10 +60,6 @@ header img {
h1 { h1 {
line-height: 2rem; line-height: 2rem;
/* border: 1px solid red; */
/* margin: .5rem auto; */
/* justify-content: space-evenly; */
/* text-align: center; */
letter-spacing: 0.01rem; letter-spacing: 0.01rem;
} }
@@ -95,13 +86,10 @@ h4 {
} }
#aboutMe { #aboutMe {
border: 2px solid white;
/* padding: 1.5rem; */
letter-spacing: 0.01rem; letter-spacing: 0.01rem;
} }
#bio { #bio {
border: 1px solid purple;
padding: 1.5rem; padding: 1.5rem;
text-align: start; text-align: start;
} }
@@ -125,20 +113,16 @@ h4 {
} }
#contact { #contact {
/* justify-content: space-between; */ margin-top: 1rem;
border: 1px solid red;
padding: 1.5rem; padding: 1.5rem;
} }
#contact h3 { #contact h3 {
font-size: 1.5rem; font-size: 1.5rem;
border: 1px solid salmon;
} }
#contact ul { #contact ul {
display: flex; display: flex;
/* text-align: start; */
border: 1px solid yellow;
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
@@ -149,46 +133,37 @@ h4 {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex: 1; flex: 1;
border: 1px solid green;
} }
.contactLinks a { .contactLinks a {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
/* flex: 1; */
color: #c9cacc; color: #c9cacc;
text-decoration: none; text-decoration: none;
/* border-bottom: 1px solid #c9cacc; */
} }
.contactLinks a:hover { .contactLinks a:hover {
font-weight: 600; font-weight: 600;
/* border-bottom: 2px solid #c9cacc; */
} }
#projects { #projects {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
border: 2px solid green;
/* padding: 1.5rem; */
} }
#projects h2 { #projects h2 {
margin: 0; margin: 0;
padding: 1.5rem; padding: 1.5rem 1.5rem 0 1.5rem;
font-size: 2rem; font-size: 2rem;
border: 1px solid #3d405b;
} }
.project-item { .project-item {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
border: 1px solid blue; margin: 1rem auto;
margin: 0 auto;
text-align: center; text-align: center;
font-weight: 200; font-weight: 200;
letter-spacing: 0.01rem; letter-spacing: 0.01rem;
/* padding: 1.5rem; */
} }
.project-item a { .project-item a {
@@ -202,7 +177,6 @@ h4 {
#projects h3 { #projects h3 {
font-size: 1.5rem; font-size: 1.5rem;
border: 1px solid brown;
text-align: left; text-align: left;
margin: 0 auto; margin: 0 auto;
padding: 1.5rem; padding: 1.5rem;
@@ -211,41 +185,32 @@ h4 {
.project-skills { .project-skills {
color: #666; color: #666;
border: 1px solid red;
list-style: none; list-style: none;
margin: 0 auto; margin: 0 auto;
line-height: 1.25rem; line-height: 1.25rem;
text-align: start; text-align: start;
padding: 0 1.5rem; padding: 0 1.5rem;
/* padding-top: 0; */
/* padding-bottom: 1.5rem; */
display: flex; display: flex;
align-items: baseline; align-items: baseline;
} }
.project-skills h4 { .project-skills h4 {
border: 1px solid white;
font-size: 1.5rem; font-size: 1.5rem;
flex: 1; flex: 1;
/* text-align: end; */
} }
.project-skills li { .project-skills li {
border: 1px solid green;
list-style-type: none; list-style-type: none;
/* display: block; */
} }
.project-skills ul { .project-skills ul {
flex: 2; flex: 2;
line-height: 2rem; line-height: 2rem;
text-align: start;
} }
.project-item img { .project-item img {
width: 90%; width: 90%;
/* border: 2px solid red; */
/* margin: auto; */
/* padding: 1.5rem; */
} }
footer { footer {
@@ -255,21 +220,16 @@ footer {
justify-content: space-around; justify-content: space-around;
align-items: center; align-items: center;
margin: 0 auto; margin: 0 auto;
border: 1px dotted red;
padding: 1rem; padding: 1rem;
/* padding: 1rem; */
/* height: 90px; */
} }
#copyright { #copyright {
margin: 0.4rem; margin: 0.4rem;
border: 1px solid yellow;
letter-spacing: 0.1rem; letter-spacing: 0.1rem;
} }
#footLinks { #footLinks {
margin: 0.4rem; margin: 0.4rem;
border: 1px solid blue;
letter-spacing: 0.8rem; letter-spacing: 0.8rem;
} }
@@ -285,8 +245,8 @@ footer {
@media (min-width: 576px) { @media (min-width: 576px) {
#wrapper { #wrapper {
width: 560px; width: 560px;
/* text-align: center; */
} }
nav { nav {
display: flex; display: flex;
} }
@@ -296,7 +256,6 @@ footer {
padding: 0.5rem; padding: 0.5rem;
flex: 4; flex: 4;
justify-content: flex-start; justify-content: flex-start;
/* justify-content: space-between; */
} }
nav li { nav li {
@@ -305,7 +264,6 @@ footer {
nav ul { nav ul {
display: flex; display: flex;
/* flex: 5; */
} }
#aboutMe { #aboutMe {
@@ -328,15 +286,12 @@ footer {
.contactLinks li { .contactLinks li {
align-items: flex-end; align-items: flex-end;
/* margin: auto; */
} }
.contactLinks a { .contactLinks a {
flex-direction: row; flex-direction: row;
/* justify-content:space-between; */
} }
.contactLinks i { .contactLinks i {
/* border: 1px solid purple; */
margin: auto 5px; margin: auto 5px;
} }
@@ -378,17 +333,5 @@ footer {
padding: 2rem; padding: 2rem;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
/* width: 90%; */
}
}
@media (min-width: 1200px) {
#wrapper {
width: 920px;
}
nav {
/* width: 150%; */
/* text-align: center; */
} }
} }