From 582d59eb2e036a9fb4f3fd69355286d96b8bcf9f Mon Sep 17 00:00:00 2001
From: zarifnexus <ahababalahi123@gmail.com>
Date: Fri, 14 Aug 2026 14:43:25 +0600
Subject: [PATCH] fix: restore window scrolling on main grid, optimize
 scroll-to-top, and enhance a11y and link security

---
 public/global.css      |  8 --------
 src/Category.svelte    |  4 ++--
 src/Modal.svelte       |  8 ++++----
 src/Sidebar.svelte     |  2 +-
 src/scrollToTop.svelte | 13 ++-----------
 5 files changed, 9 insertions(+), 26 deletions(-)

diff --git a/public/global.css b/public/global.css
index 387b730..b94e45e 100644
--- a/public/global.css
+++ b/public/global.css
@@ -207,14 +207,6 @@ nav {
 	display: grid;
 	grid-template-columns: repeat(auto-fit, minmax(348px, 1fr));
 	gap: 15px;
-	max-height: 70vh;
-	overflow-y: scroll;
-	-ms-overflow-style: none;
-	scrollbar-width: none;
-}
-
-.main-grid::-webkit-scrollbar {
-	display: none;
 }
 
 @media screen and (max-width: 1345px) {
diff --git a/src/Category.svelte b/src/Category.svelte
index 65f8122..e8c9590 100644
--- a/src/Category.svelte
+++ b/src/Category.svelte
@@ -69,7 +69,7 @@
             <h2>{website.name}</h2>
             <div class="outbound-cont">
                 {#if website.code && website.code !== null}
-                    <a href="{website.code}" target="_blank" class="outbound code-link" aria-label="{website.name} snippet" on:click|stopPropagation>
+                    <a href="{website.code}" target="_blank" rel="noopener noreferrer" class="outbound code-link" aria-label="{website.name} snippet" on:click|stopPropagation>
                         <svg width="30" height="29" viewBox="0 0 30 29" fill="none" xmlns="http://www.w3.org/2000/svg">
                           <rect width="30" height="29" rx="3" fill="transparent"/>
                           <path d="M19 7L26 14L19 21" stroke="white"/>
@@ -79,7 +79,7 @@
                 {/if}
 
 
-                <a href="{website.url}" target="_blank" class="outbound" aria-label="{website.name}" on:click|stopPropagation>
+                <a href="{website.url}" target="_blank" rel="noopener noreferrer" class="outbound" aria-label="{website.name}" on:click|stopPropagation>
                   <svg width="30" height="29" viewBox="0 0 30 29" fill="none" xmlns="http://www.w3.org/2000/svg">
                       <rect width="30" height="29" rx="3" fill="transparent"/>
                       <path d="M10.454 7.36396H23.182V20.0919" stroke="white"/>
diff --git a/src/Modal.svelte b/src/Modal.svelte
index e97c67a..9276e5c 100644
--- a/src/Modal.svelte
+++ b/src/Modal.svelte
@@ -60,7 +60,7 @@
 <div class="modal-overlay" on:click|stopPropagation={handleOverlayClick}>
     <div class="modal" aria-modal="true">
       <div class="card-info">
-        <h2><a href="{websiteUrl}" target="_blank">{websiteName}</a></h2>
+        <h2><a href="{websiteUrl}" target="_blank" rel="noopener noreferrer">{websiteName}</a></h2>
         <div class="modal-nav">
 
           <svg on:click={prevModal} class="modal-nav-button" width="30" height="29" viewBox="0 0 30 29" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -90,7 +90,7 @@
         
         <!-- svelte-ignore missing-declaration -->
           {#if websiteCode && websiteCode !== null}
-            <a href="{websiteCode}" target="_blank" class="outbound code-link">
+            <a href="{websiteCode}" target="_blank" rel="noopener noreferrer" class="outbound code-link">
               <span>Check Code</span>
               <svg width="30" height="29" viewBox="0 0 30 29" fill="none" xmlns="http://www.w3.org/2000/svg">
                 <rect width="30" height="29" rx="3" fill="transparent"/>
@@ -99,7 +99,7 @@
               </svg>                   
             </a>
           {:else if !codeLinkBoolean} 
-            <a href="https://forms.gle/7gi8eLZZoQmbVyst5" target="_blank" class="outbound code-link empty-code">
+            <a href="https://forms.gle/7gi8eLZZoQmbVyst5" target="_blank" rel="noopener noreferrer" class="outbound code-link empty-code">
               <span>Add CodePen Link</span>
               <svg width="30" height="29" viewBox="0 0 30 29" fill="none" xmlns="http://www.w3.org/2000/svg">
                 <rect width="30" height="29" rx="3" fill="transparent"/>
@@ -109,7 +109,7 @@
             </a>
           {/if}
 
-          <a href="{websiteUrl}" target="_blank" class="outbound site-link">
+          <a href="{websiteUrl}" target="_blank" rel="noopener noreferrer" class="outbound site-link">
             <span>Visit Site</span>
             <svg width="30" height="29" viewBox="0 0 30 29" fill="none" xmlns="http://www.w3.org/2000/svg">
               <rect width="30" height="29" rx="3" fill="transparent"/>
diff --git a/src/Sidebar.svelte b/src/Sidebar.svelte
index 2458aeb..455216a 100644
--- a/src/Sidebar.svelte
+++ b/src/Sidebar.svelte
@@ -40,7 +40,7 @@
     <button
       class="option"
       class:active={activeCategory === category}
-      aria-selected={path === category}
+      aria-current={activeCategory === category ? 'page' : undefined}
       class:show={showButtons}
       on:click={() => selectCategory(category)}
       on:keydown={() => selectCategory(category)}
diff --git a/src/scrollToTop.svelte b/src/scrollToTop.svelte
index 9cc99ef..9d46b8b 100644
--- a/src/scrollToTop.svelte
+++ b/src/scrollToTop.svelte
@@ -4,33 +4,24 @@
     let showButton = false;
   
     const scrollToTop = () => {
-      const mainGrid = document.querySelector('.main-grid');
-
       window.scrollTo({ top: 0, behavior: 'smooth' });
-      mainGrid.scrollTo({ top: 0, behavior: 'smooth' });
     };
   
     const handleScroll = () => {
-      const mainGrid = document.querySelector('.main-grid');
-      
-      showButton = window.scrollY > 100 || mainGrid.scrollTop > 100;
+      showButton = window.scrollY > 100;
     };
   
     onMount(() => {
-      const mainGrid = document.querySelector('.main-grid');
-
       window.addEventListener('scroll', handleScroll);
-      mainGrid.addEventListener('scroll', handleScroll);
       return () => {
         window.removeEventListener('scroll', handleScroll);
-        mainGrid.removeEventListener('scroll', handleScroll);
       };
     });
 </script>
   
 {#if showButton}
     <!-- svelte-ignore a11y-click-events-have-key-events -->
-    <div on:click={scrollToTop} class="back-to-top-btn">
+    <div on:click={scrollToTop} class="back-to-top-btn" role="button" tabindex="0" aria-label="Back to top">
         <svg width="30" height="29" viewBox="0 0 30 29" fill="none" xmlns="http://www.w3.org/2000/svg">
             <path d="M10.0401 12.0543L15.0743 7.02002L20.1086 12.0543" stroke="white"/>
             <path d="M15.0748 7.20886L15.0748 21.755" stroke="white"/>