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