add new proyect

Author: carlosjorger

css/project-section.css

@@ -1,3 +1,7 @@
+#work {
+  height: calc(120vh - 6em);
+}
+
 .card-projects {
   display: flex;
   flex-direction: column;
@@ -27,7 +31,7 @@
 .card-description {
   padding: 0.5em;
   color: rgb(153, 249, 249);
-  font-size: 0.6em;
+  font-size: 0.7em;
 }
 
 .card-links {
@@ -46,3 +50,6 @@
 #angular-portfolio .card-links {
   justify-content: end;
 }
+#online-cv-maker {
+  align-self: flex-end;
+}

css/styles.css

@@ -242,6 +242,9 @@ hr {
   footer {
     width: 75%;
   }
+  .card-project {
+    width: 70% !important;
+  }
 }
 
 @media (max-width: 510px) {
@@ -265,7 +268,9 @@ hr {
   footer {
     width: 80%;
   }
-
+  #work {
+    height: calc(100vh - 6em) !important;
+  }
   .br-show {
     display: inline;
   }
@@ -292,7 +297,6 @@ hr {
   footer {
     width: 85%;
   }
-
   .br-show {
     display: inline;
   }

index.html

@@ -183,9 +183,8 @@ <h3>OpenEcommerce</h3>
             </header>
             <div class="card-description">
               <p>
-                OpenEcommerce is an ecommerce builded with .net. Using a
-                hexagonal architecture, cqrs pattern and more interesting
-                patterns.
+                OpenEcommerce is an ecommerce builded with .net using a
+                hexagonal architecture, cqrs pattern and other patterns.
               </p>
             </div>
             <div class="card-links">
@@ -214,6 +213,21 @@ <h3>Angular Portfolio</h3>
               ></a>
             </div>
           </article>
+          <article id="online-cv-maker" class="card-project reveal">
+            <header class="card-title">
+              <h3>Online CV Maker</h3>
+            </header>
+            <div class="card-description">
+              <p>An online cv maker made in astro using vuejs components.</p>
+            </div>
+            <div class="card-links">
+              <a
+                aria-label="See online cv maker"
+                href="https://github.com/carlosjorger/online-cv-maker"
+                ><i class="svg-icon icon-github svg-icon-s"></i
+              ></a>
+            </div>
+          </article>
         </div>
       </section>
     </main>