Add skills section on the website

dfsmania · Nov 15, 2023 · 8beeb69 · 8beeb69
1 parent bedab75
commit 8beeb69
Showing 1 changed file with 98 additions and 0 deletions.
diff --git a/website/index.html b/website/index.html
@@ -50,6 +50,9 @@
                     <li class="nav-item">
                         <a class="nav-link js-scroll-trigger" href="#education">Education</a>
                     </li>
+                    <li class="nav-item">
+                        <a class="nav-link js-scroll-trigger" href="#skills">Skills</a>
+                    </li>
                     <li class="nav-item">
                         <a class="nav-link js-scroll-trigger" href="#pdf-version">PDF Version</a>
                     </li>
@@ -177,6 +180,101 @@ <h3 class="mb-0">Instituto Politécnico General San Martín (IPS)</h3>
                             <span class="text-success fw-bold">1995 - 1999</span>
                         </div>
                     </div>
+
+                </div>
+            </section>
+            <hr class="m-0" />
+
+            <!-- Skills-->
+            <section class="resume-section" id="skills">
+                <div class="resume-section-content">
+                    <h2 class="mb-5">Skills</h2>
+
+                    <!-- Programming Languages & Tools -->
+                    <div class="subheading mb-3">Programming Languages & Tools</div>
+                    <ul class="list-inline dev-icons">
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-html5"></i>
+                            <h6 class="text-success">HTML5</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-css3-alt"></i>
+                            <h6 class="text-success">CSS3</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-js-square"></i>
+                            <h6 class="text-success">Javascript</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-php"></i>
+                            <h6 class="text-success">PHP</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-python"></i>
+                            <h6 class="text-success">Python</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-java"></i>
+                            <h6 class="text-success">Java</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fas fa-fw fa-database"></i>
+                            <h6 class="text-success">SQL</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-github"></i>
+                            <h6 class="text-success">Github</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-square-git"></i>
+                            <h6 class="text-success">Git</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-bootstrap"></i>
+                            <h6 class="text-success">Bootstrap</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-laravel"></i>
+                            <h6 class="text-success">Laravel</h6>
+                        </li>
+                    </ul>
+
+                    <!-- Opetaring Systems -->
+                    <div class="subheading mb-3">Operating Systems</div>
+                    <ul class="list-inline dev-icons">
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-windows"></i>
+                            <h6 class="text-success">Windows</h6>
+                        </li>
+                        <li class="list-inline-item text-center">
+                            <i class="fab fa-fw fa-linux"></i>
+                            <h6 class="text-success">Linux</h6>
+                        </li>
+                    </ul>
+
+                    <!-- Workflows -->
+                    <div class="subheading mb-3">Workflows</div>
+                    <ul class="fa-ul mb-0">
+                        <li>
+                            <span class="fa-li">
+                                <i class="fas fa-lg fa-check text-success"></i>
+                            </span>
+                            Mobile-First, Responsive Design
+                        </li>
+                        <li>
+                            <span class="fa-li">
+                                <i class="fas fa-lg fa-check text-success"></i>
+                            </span>
+                            Cross Browser Testing & Debugging
+                        </li>
+                        <li>
+                            <span class="fa-li">
+                                <i class="fas fa-lg fa-check text-success"></i>
+                            </span>
+                            Cross Functional Teams
+                        </li>
+                    </ul>
+
                 </div>
             </section>
             <hr class="m-0" />