From 253e23bea28d5de8a9d39f9a22aeb9d09579b1f8 Mon Sep 17 00:00:00 2001
From: Alex <12881812+xezno@users.noreply.github.com>
Date: Thu, 18 Apr 2024 17:17:21 +0100
Subject: [PATCH] Design tweaks

---
 index.html |  6 ------
 styles.css | 19 +++++++++++--------
 2 files changed, 11 insertions(+), 14 deletions(-)

diff --git a/index.html b/index.html
index ae9116d..cbe7fc3 100644
--- a/index.html
+++ b/index.html
@@ -40,8 +40,6 @@ <h2>About</h2>
       
     </section>
 
-    <hr />
-
     <section>
       <h2>Skills</h2>
 
@@ -52,8 +50,6 @@ <h2>Skills</h2>
         <li><b>Responsive web design</b>: Skilled in creating good-looking web apps for mobile and desktop platforms in HTML, CSS, and JavaScript</li>
       </ul>
     </section>
-
-    <hr />
   
     <section>
       <h2>Projects</h2>
@@ -104,8 +100,6 @@ <h2>Projects</h2>
 
     </section>
 
-    <hr />
-
     <section>
       <h2>Contact Me</h2>
 
diff --git a/styles.css b/styles.css
index 2a16b49..78a8059 100644
--- a/styles.css
+++ b/styles.css
@@ -55,13 +55,6 @@ ul li:before {
   margin-left: -20px;
 }
 
-hr {
-  border: 0;
-  border-top: 1px dotted currentColor;
-  margin: 1.5rem 0;
-  opacity: 0.2;
-}
-
 img.avatar {
   border-radius: 50%;
   margin-left: 2rem;
@@ -70,6 +63,16 @@ img.avatar {
 
 h2 {
   text-transform: uppercase;
+  padding: 1rem 0;
+  width: fit-content;
+}
+
+h2::after {
+  content: ' ';
+  display: block;
+  height: 1px;
+  width: 100%;
+  border-bottom: 1px solid color-mix( in srgb, currentColor 20%, transparent );
 }
 
 .projects {
@@ -84,7 +87,7 @@ h2 {
   flex-shrink: 1;
   flex-grow: 1;
   display: flex;
-  border: 1px solid color-mix( in srgb, currentColor 20%, transparent );
+  background-color: color-mix( in srgb, currentColor 5%, transparent );
   flex-direction: row;
   padding: 1rem;
   gap: 1rem;