Fix CSS for social links wheel in career highlights

Fix CSS for social links wheel in career highlights and added theme color hover on visit on GitHub button in main page.
madhurimarawat · Aug 2, 2024 · 0615628 · 0615628
1 parent 2ef640e
commit 0615628
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 4 deletions.
diff --git a/career-highlights.html b/career-highlights.html
@@ -299,7 +299,7 @@ <h2><i class="fas fa-share-alt"></i> &nbsp;Socials</h2>
     <div class="wheel">
       <div class="center">
         <a href="#" target="_blank">
-          <i class="fas fa-star" title="Central Title"></i>
+          <i class="fas fa-handshake" title="Central Title"></i>
         </a>
       </div>
 

diff --git a/css/index.css b/css/index.css
@@ -261,6 +261,8 @@ body {
     /* Slightly darker background on hover */
     transform: scale(1.05);
     /* Slight scale up effect on hover */
+    color: var(--primary-color);
+    /* Change text color on hover */
 }
 
 .footer-section {

diff --git a/js/career-highlights.js b/js/career-highlights.js
@@ -93,10 +93,14 @@ document.addEventListener('DOMContentLoaded', () => {
     const links = document.querySelectorAll('.link');
     const totalLinks = links.length;
     const centerRotationDuration = 3000; // Duration for each link to stay in center
-    const radius = 150; // Distance of icons from center
+    var radius;
+    if (window.innerWidth <= 480) {
+        radius = 125;
+    } else {
+        radius = 150;
+    }
     const rotationSpeed = 0.5; // Speed of the rotation (in degrees per frame)
     const initialDisplayDuration = 1000; // Duration for initial central icon to be displayed (in milliseconds)
-    const initialImageSrc = 'https://ouch-cdn2.icons8.com/7t1OP99ujxbijKLclt_j8lXv5sNR8Ob4utsa-QRFnf0/rs:fit:435:456/extend:false/wm:1:re:0:0:0.8/wmid:ouch/czM6Ly9pY29uczgu/b3VjaC1wcm9kLmFz/c2V0cy9zdmcvMTA0/L2RjMWUzN2RiLWM1/NzctNGY0Mi05ZWFj/LWVkMWRlYjJkMDAw/Yy5zdmc.png';
     const initialTitle = 'Central Title';
     const initialHref = '#';
 
@@ -127,7 +131,7 @@ document.addEventListener('DOMContentLoaded', () => {
 
         if (currentIndex === 0) {
             // Reset to initial icon after all links have been shown
-            centralIcon.className = 'fas fa-star'; // Default central icon class
+            centralIcon.className = 'fas fa-user-friends'; // Default central icon class
             centralIcon.style.color = primaryColor; // Use the primary color for the central icon
             centralLink.href = initialHref;
             centralLink.title = initialTitle;