[website]: Improve section titles with animated font awesome icons

dfsmania · Nov 17, 2023 · 148b4ae · 148b4ae
1 parent 6b10c31
commit 148b4ae
Showing 1 changed file with 21 additions and 4 deletions.
diff --git a/website/index.html b/website/index.html
@@ -106,7 +106,11 @@ <h1 class="mb-0">
             <!-- Experience-->
             <section class="resume-section" id="experience">
                 <div class="resume-section-content">
-                    <h2 class="mb-5">Experience</h2>
+
+                    <h2 class="mb-5">
+                        <i class="fas fa-award fa-beat opacity-50" style="--fa-animation-duration:3s"></i>
+                        Experience
+                    </h2>
 
                     <!-- LLW Ingeniería -->
                     <div class="d-flex flex-column flex-md-row justify-content-between mb-5">
@@ -143,7 +147,11 @@ <h3 class="mb-0">Software Developer</h3>
             <!-- Education-->
             <section class="resume-section" id="education">
                 <div class="resume-section-content">
-                    <h2 class="mb-5">Education</h2>
+
+                    <h2 class="mb-5">
+                        <i class="fas fa-graduation-cap fa-shake opacity-50" style="--fa-animation-duration:3s"></i>
+                        Education
+                    </h2>
 
                     <!-- Course Java Programming -->
                     <div class="d-flex flex-column flex-md-row justify-content-between mb-5">
@@ -191,7 +199,11 @@ <h3 class="mb-0">Instituto Politécnico General San Martín (IPS)</h3>
             <!-- Skills-->
             <section class="resume-section" id="skills">
                 <div class="resume-section-content">
-                    <h2 class="mb-5">Skills</h2>
+
+                    <h2 class="mb-5">
+                        <i class="fas fa-star fa-flip opacity-50" style="--fa-animation-duration:3s"></i>
+                        Skills
+                    </h2>
 
                     <!-- Programming Languages & Tools -->
                     <div class="subheading mb-3">Programming Languages & Tools</div>
@@ -309,7 +321,12 @@ <h6 class="text-success">Linux</h6>
             <!-- TODO: Review, and embed a PDF viewer? -->
             <section class="resume-section" id="pdf-version">
                 <div class="resume-section-content">
-                    <h2 class="mb-5">PDF Version</h2>
+
+                    <h2 class="mb-5">
+                        <i class="fas fa-file-pdf text-muted fa-fade" style="--fa-animation-duration:3s"></i>
+                        PDF Version
+                    </h2>
+
                     <p>
                         You can check a detailed version of my resume (made with LaTeX) at the next link:
                         <a class="link-danger" href="resume_en.pdf" target="_blank">