some CSS changes on titel and links colors

index.html

@@ -53,14 +53,6 @@
                     <button id="darkModeToggle" class="theme-toggle" aria-label="Toggle dark mode">
                         <i class="fas fa-moon"></i>
                     </button>
-                    <div class="sort-controls">
-                        <label for="sortSelect" class="sr-only">Sort resources by</label>
-                        <select id="sortSelect" aria-label="Sort resources">
-                            <option value="stars">Sort by Stars</option>
-                            <option value="name">Sort by Name</option>
-                            <option value="recent">Sort by Recent</option>
-                        </select>
-                    </div>
                 </div>
             </header>
 

script.js

@@ -108,27 +108,6 @@ document.querySelectorAll('.nav-links a').forEach(link => {
     });
 });
 
-// Sort functionality
-const sortSelect = document.getElementById('sortSelect');
-
-sortSelect.addEventListener('change', (e) => {
-    const sortBy = e.target.value;
-    const container = document.getElementById('resources-container');
-    const cards = Array.from(container.getElementsByClassName('resource-card'));
-
-    cards.sort((a, b) => {
-        if (sortBy === 'stars') {
-            return parseInt(b.dataset.stars) - parseInt(a.dataset.stars);
-        } else if (sortBy === 'name') {
-            return a.querySelector('h3').textContent.localeCompare(b.querySelector('h3').textContent);
-        }
-        return 0;
-    });
-
-    container.innerHTML = '';
-    cards.forEach(card => container.appendChild(card));
-});
-
 // Add this function to fetch contributors from GitHub API
 async function fetchContributors(owner, repo) {
     try {

styles.css

@@ -174,6 +174,25 @@ body {
     color: var(--text-color);
 }
 
+.resource-title a {
+    color: var(--primary-color);
+    text-decoration: none;
+    transition: color 0.2s ease;
+}
+
+.resource-title a:hover {
+    color: var(--hover-color);
+}
+
+/* Dark theme adjustment */
+[data-theme="dark"] .resource-title a {
+    color: #a48ec7; /* A lighter shade of purple for dark mode */
+}
+
+[data-theme="dark"] .resource-title a:hover {
+    color: #b9a8d7; /* Even lighter shade for hover in dark mode */
+}
+
 .resource-link {
     margin-bottom: 12px;
 }
@@ -364,6 +383,10 @@ body {
     color: #f1c40f;
 }
 
+#resources-container h2 {
+    color: var(--primary-color);
+}
+
 /* Main content scrollbar styles */
 .main-content::-webkit-scrollbar {
     width: 8px;