cleaning extra white lines on css codes

latifa-wakili · Jun 7, 2024 · 6ca5112 · 6ca5112
1 parent 703b4f3
commit 6ca5112
Showing 1 changed file with 58 additions and 68 deletions.
diff --git a/styles.css b/styles.css
@@ -29,7 +29,7 @@ header p {
   color: blueviolet;
 }
 
-.first-letter-of-title{
+.first-letter-of-title {
   width: 50px;
   height: 50px;
   background-color: blueviolet;
@@ -64,6 +64,27 @@ ul li {
   list-style: none;
 }
 
+.project-tile a {
+  color: #e3edf7;
+}
+
+.social-media a {
+  margin: 20px;
+  font-size: 20px;
+  text-decoration: none;
+  width: 150px;
+  height: 40px;
+  border-radius: 30px;
+  background-color: #e3edf7;
+  color: gray;
+}
+
+.footer a {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
 ul a:hover {
   border-bottom: 4px solid blueviolet;
   height: 30px;
@@ -102,6 +123,21 @@ h1 {
   border-radius: 30px;
 }
 
+.click-show button {
+  width: 150px;
+  height: 50px;
+  background-color: blueviolet;
+  color: #e3edf7;
+  font-size: larger;
+  border: none;
+  margin: 60px;
+  position: relative;
+  left: 40%;
+  z-index: 1;
+  cursor: pointer;
+  border-radius: 5px;
+}
+
 .info button:hover {
   background-color: #e3edf7;
   color: blueviolet;
@@ -118,14 +154,14 @@ h1 {
 }
 
 .content h2 {
-    width: 100%;
-    height: 100px;
-    font-size: 40px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    color: #e3edf7;
-    border-bottom: 2px solid blueviolet;
+  width: 100%;
+  height: 100px;
+  font-size: 40px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #e3edf7;
+  border-bottom: 2px solid blueviolet;
 }
 
 .project-tile {
@@ -136,17 +172,13 @@ h1 {
   border-radius: 15px;
 }
 
-.project-tile a {
-  color: #e3edf7;
-}
-
 img {
   width: 383px;
   height: 400px;
   filter: blur(2px);
   border-radius: 15px;
-
 }
+
 img:hover {
   filter: blur(0px);
 }
@@ -166,6 +198,12 @@ img:hover {
   box-shadow: 0 0 5px blueviolet;
 }
 
+.info-service p {
+  display: flex;
+  justify-content: center;
+  margin: 20px;
+}
+
 .content p:hover {
   position: relative;
   bottom: 64px;
@@ -209,15 +247,12 @@ img:hover {
   width: 100%;
 }
 
-.social-media a {
+.info-service i {
+  font-size: 50px;
+  display: flex;
+  justify-content: center;
   margin: 20px;
-  font-size: 20px;
-  text-decoration: none;
-  width: 150px;
-  height: 40px;
-  border-radius: 30px;
-  background-color: #e3edf7;
-  color: gray;
+  color: blueviolet;
 }
 
 .social-media a i {
@@ -250,12 +285,6 @@ img:hover {
   color: #e3edf7;
 }
 
-.footer a {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
 .footer .portfolio p .footer .portfolio a {
   color: #e3edf7;
   font-size: 20px;
@@ -270,21 +299,6 @@ img:hover {
   margin-top: 30px;
 }
 
-.click-show button {
-  width: 150px;
-  height: 50px;
-  background-color: blueviolet;
-  color: #e3edf7;
-  font-size: larger;
-  border: none;
-  margin: 60px;
-  position: relative;
-  left: 40%;
-  z-index: 1;
-  cursor: pointer;
-  border-radius: 5px;
-}
-
 .click-show button:hover {
   background-color: #e3edf7;
   color: blueviolet;
@@ -325,15 +339,7 @@ img:hover {
   background-color: #e3edf7;
   margin: 20px;
   border-radius: 15px;
-  box-shadow: 0px 0px 10px  rgb(41, 41, 56) ;
-}
-
-.info-service i {
-  font-size: 50px;
-  display: flex;
-  justify-content: center;
-  margin: 20px;
-  color: blueviolet;
+  box-shadow: 0px 0px 10px  rgb(41, 41, 56);
 }
 
 .info-service h3 {
@@ -343,12 +349,6 @@ img:hover {
   color: blueviolet;
 }
 
-.info-service p {
-  display: flex;
-  justify-content: center;
-  margin: 20px;
-}
-
 .portfolio p {
   margin-top: 30px;
 }
@@ -364,53 +364,43 @@ img:hover {
 }
 
 @media screen and (max-width: 768px) {
-
   .header ul {
     display: none;
   }
-
   .header p {
     font-size: 30px;
     width: 30px;
     height: auto;
   }
-
   .title-name {
     width: 300px;
     display: flex;
     margin-left: 160px;
     height: auto;
   }
-
   .info p {
     font-size: 25px;
   }
-
   .info h1 {
     font-size: 50px;
   }
-
   .column-one-project {
     flex-direction: column; 
     align-items: center;
     height: min-content;
   }
-
   .content h2 {
     font-size: 20px;
     height: 50px;
   }
-
   .content {
     width: 100%;
     height: max-content;
   }
-
   .project-tile {
     width: 80%; 
     margin: 20px 0px;
   }
-
   .project-tile p {
     width: 100%;
   }