.

SimPham02 · Jan 2, 2025 · 8462bb2 · 8462bb2
1 parent f865c6c
commit 8462bb2
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 3 deletions.
diff --git a/assets/css/styles.css b/assets/css/styles.css
@@ -217,7 +217,7 @@ body::before {
 
 .divider {
     width: 85%;
-    margin: 0 auto 30px auto;
+    margin: 0 auto 15px auto;
     border: none;
     height: 2px;
     background: linear-gradient(
@@ -227,4 +227,15 @@ body::before {
         rgba(255, 255, 255, 0.3) 80%,
         transparent
     );
-}
+}
+
+/* Style cho phần quote */
+.quote-container {
+    margin: 0 auto 10px auto;
+    font-style: italic;
+    color: #4b5334;
+    position: relative;
+    padding: 10px 20px;
+    font-size: 17px;
+}
+
diff --git a/assets/js/main.js b/assets/js/main.js
@@ -51,4 +51,5 @@ document.querySelector('.click-me-btn').addEventListener('click', () => {
 
 document.querySelector('.profile-header').addEventListener('animationend', function(e) {
     this.classList.remove('scale-animation');
-});
+});
+
diff --git a/index.html b/index.html
@@ -3,6 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
     <title>Sim Pham</title>
     <link rel="icon" href="assets/images/avtsim.jpg">
     <link rel="stylesheet" href="assets/css/styles.css">
@@ -25,13 +26,19 @@ <h1 class="name">Sim Pham</h1>
             </div>
 
             <hr class="divider">
+            <div class="quote-container">
+                <div>I sleep on the clouds</div>
+            </div>
+
             <div class="social-links">
                 <a href="https://github.com/SimPham02"><i><img src="assets/images/icons/github.png" alt="Github" class="social-icon"></i></a>
                 <a href="https://www.youtube.com/@SimPham02"><i><img src="assets/images/icons/ytb.png" alt="Youtube" class="social-icon"></i></a>
                 <a href="https://open.spotify.com/user/31wjcbt46bm4vyq2jgvw4pum42yq?si=28c65f6763214d5f"><i><img src="assets/images/icons/spotify.png" alt="Spotify" class="social-icon"></i></a>
                 <a href="https://discord.com/users/919571070862901369"><i><img src="assets/images/icons/discord.png" alt="Discord" class="social-icon"></i></a>
             </div>
+
         </div>
+
     </div>
     <script src="assets/js/vanilla-tilt.js" type="module"></script>
     <script src="assets/js/main.js" type="module"></script>
-Original file line number
+Diff line change
@@ Expand Up @@
     document.querySelector('.profile-header').addEventListener('animationend', function(e) {
         this.classList.remove('scale-animation');
-    });
+    });