Merge pull request #12 from melvinsantanac/gh-pages

Nuevas modificaciones de estilo

assets/styles/style.css

@@ -30,7 +30,7 @@ a {
   display: flex;
   align-items: center;
   justify-content: center;
-  height: 100vh;
+  height: 100svh;
   background-image: url(/assets/img/background.jpg);
   background-repeat: no-repeat;
   background-size: cover;
@@ -43,7 +43,7 @@ a {
   background: black;
   opacity: 0.8;
   width: 100vw;
-  height: 100vh;
+  height: 100svh;
   top: 0;
 }
 
@@ -109,29 +109,31 @@ a {
   border-color: #f9a825;
 }
 
-.projectsList {
+.projectsListTitle {
   margin-top: 2em;
   font-size: 1.5rem !important;
   text-transform: capitalize;
 }
 
+.projectsList {
+  display: flex;
+  justify-content: center;
+  width: 100%;
+  column-gap: 1em;
+}
+
 .btn-projects {
-  display: inline;
   background-color: white;
   color: #333333;
   padding: 1em;
-  width: 75px !important;
+  width: 250px !important;
   transition: all 0.3s;
   -webkit-transition: all 0.3s;
   -moz-transition: all 0.3s;
   -ms-transition: all 0.3s;
   -o-transition: all 0.3s;
 }
 
-.btn-projects:first-child {
-  margin-right: 0.5em;
-}
-
 .btn-projects:hover {
   background-color: lightgray;
   color: #1b1b1b;
@@ -141,4 +143,14 @@ a {
   .__coverPage-content {
     width: 100%;
   }
+
+  .projectsList {
+    flex-direction: column;
+    row-gap: 1em;
+  }
+
+  .btn-projects {
+    text-align: center;
+    width: 100% !important;
+  }
 }

index.html

@@ -64,8 +64,8 @@ <h3>We are building something <strong>GREAT!</strong></h3>
             ><i class="fas fa-envelope"></i
           ></a>
         </div>
-        <p class="projectsList">practice projects</p>
-        <div>
+        <p class="projectsListTitle">practice projects</p>
+        <div class="projectsList">
           <a
             class="btn-projects"
             target="_blank"