From 1448c1a1105f9f59c2dff04b8d0bccab8696b6a6 Mon Sep 17 00:00:00 2001
From: Sneha Mishra <145490348+Sneha123-zudo@users.noreply.github.com>
Date: Sun, 25 Feb 2024 23:45:37 +0530
Subject: [PATCH] Added customised scrollbar to all the games pages (#330)

---
 2048/style.css                | 17 +++++++++++++++++
 Bingo Game/style.css          | 25 ++++++++++++++++++++++++-
 Block-Buster/styles.css       | 23 +++++++++++++++++++++++
 CrossWord/style.css           | 17 +++++++++++++++++
 Dino Game/style.css           | 19 ++++++++++++++++++-
 HangMan Game/style.css        | 19 ++++++++++++++++++-
 Memory Card game/style.css    | 17 +++++++++++++++++
 Ping_Pong/style.css           | 17 +++++++++++++++++
 Rock Paper Scissor/style.css  | 19 ++++++++++++++++++-
 Rubiks-Cube/style.css         | 17 +++++++++++++++++
 Simon Game/styles.css         | 19 ++++++++++++++++++-
 Snake Game/style.css          | 19 ++++++++++++++++++-
 Sudoku_Game_8x8/style.css     | 19 ++++++++++++++++++-
 Sudoku_Game_9x9/style.css     | 19 ++++++++++++++++++-
 Tetris/style.css              | 16 ++++++++++++++++
 Tic-Tac-Toe/style.css         | 19 ++++++++++++++++++-
 UNO/css/style.css             | 19 ++++++++++++++++++-
 Word Scramble/style.css       | 19 ++++++++++++++++++-
 Word/style.css                | 17 +++++++++++++++++
 css_files/_8_Puzzle_game.css  | 19 ++++++++++++++++++-
 css_files/checkers_game.css   | 17 +++++++++++++++++
 css_files/connect4.css        | 19 ++++++++++++++++++-
 css_files/sudocu_game_4x4.css | 19 ++++++++++++++++++-
 css_files/sudoku_game_6x6.css | 17 +++++++++++++++++
 24 files changed, 433 insertions(+), 14 deletions(-)

diff --git a/2048/style.css b/2048/style.css
index e541672..95bdc4c 100644
--- a/2048/style.css
+++ b/2048/style.css
@@ -241,4 +241,21 @@ html{
       padding: 0px 9px;
   }
   
+}
+html {
+  scroll-behavior: smooth;
+}
+
+::-webkit-scrollbar {
+  width: 15px;
+}
+
+::-webkit-scrollbar-track {
+  border-radius: 5px;
+  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
 }
\ No newline at end of file
diff --git a/Bingo Game/style.css b/Bingo Game/style.css
index 2efbd0e..895e8c8 100644
--- a/Bingo Game/style.css	
+++ b/Bingo Game/style.css	
@@ -1,3 +1,8 @@
+*{
+	margin: 0;
+	padding: 0;
+}
+
 body { 
 	font-family: Arial, sans-serif; 
 	background-color: #d8f3dc; 
@@ -192,4 +197,22 @@ label {
 .foot-social a{
     font-size: 30px;
     color: #ffb780;
-}
\ No newline at end of file
+}
+html {
+	scroll-behavior: smooth;
+	overflow-x: hidden;
+  }
+  
+  ::-webkit-scrollbar {
+	width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+	border-radius: 5px;
+	box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+	border-radius: 5px;
+	background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/Block-Buster/styles.css b/Block-Buster/styles.css
index 407251c..fd188e5 100644
--- a/Block-Buster/styles.css
+++ b/Block-Buster/styles.css
@@ -1,3 +1,8 @@
+*{
+  margin: 0;
+  padding: 0;
+}
+
 body {
   margin: 0;
   padding: 0;
@@ -147,4 +152,22 @@ body {
 .foot-social a{
   font-size: 30px;
   color: #ffb780;
+}
+html {
+  scroll-behavior: smooth;
+  overflow-x: hidden;
+}
+
+::-webkit-scrollbar {
+  width: 15px;
+}
+
+::-webkit-scrollbar-track {
+  border-radius: 5px;
+  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
 }
\ No newline at end of file
diff --git a/CrossWord/style.css b/CrossWord/style.css
index 958d343..e6b0b27 100644
--- a/CrossWord/style.css
+++ b/CrossWord/style.css
@@ -275,4 +275,21 @@ html{
       padding: 0px 9px;
   }
   
+}
+html {
+  scroll-behavior: smooth;
+}
+
+::-webkit-scrollbar {
+  width: 15px;
+}
+
+::-webkit-scrollbar-track {
+  border-radius: 5px;
+  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
 }
\ No newline at end of file
diff --git a/Dino Game/style.css b/Dino Game/style.css
index 266c689..3a68bd2 100644
--- a/Dino Game/style.css	
+++ b/Dino Game/style.css	
@@ -110,4 +110,21 @@ img{
 .reset:hover{
     transform: scale(1.05);
     transition: all 0.2s ease-in-out;
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/HangMan Game/style.css b/HangMan Game/style.css
index 4d7d0e1..5c1fbfe 100644
--- a/HangMan Game/style.css	
+++ b/HangMan Game/style.css	
@@ -363,4 +363,21 @@ html{
         padding: 0px 9px;
     }
     
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/Memory Card game/style.css b/Memory Card game/style.css
index d3e4bbc..ab49def 100644
--- a/Memory Card game/style.css	
+++ b/Memory Card game/style.css	
@@ -207,4 +207,21 @@ body{
 .foot-social a{
   font-size: 30px;
   color: #ffb780;
+}
+html {
+  scroll-behavior: smooth;
+}
+
+::-webkit-scrollbar {
+  width: 15px;
+}
+
+::-webkit-scrollbar-track {
+  border-radius: 5px;
+  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
 }
\ No newline at end of file
diff --git a/Ping_Pong/style.css b/Ping_Pong/style.css
index c68b9d9..dc67223 100644
--- a/Ping_Pong/style.css
+++ b/Ping_Pong/style.css
@@ -115,3 +115,20 @@ h1{
 .back-to-home:hover {
     background-color: #4556a0;
 }
+html {
+  scroll-behavior: smooth;
+}
+
+::-webkit-scrollbar {
+  width: 15px;
+}
+
+::-webkit-scrollbar-track {
+  border-radius: 5px;
+  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+}
\ No newline at end of file
diff --git a/Rock Paper Scissor/style.css b/Rock Paper Scissor/style.css
index 212fe42..9394d1c 100644
--- a/Rock Paper Scissor/style.css	
+++ b/Rock Paper Scissor/style.css	
@@ -305,4 +305,21 @@ html{
         padding: 0px 9px;
     }
     
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/Rubiks-Cube/style.css b/Rubiks-Cube/style.css
index b6a6730..82dd149 100644
--- a/Rubiks-Cube/style.css
+++ b/Rubiks-Cube/style.css
@@ -352,4 +352,21 @@ body {
 }
 .ui__buttons {
   z-index: 5;
+}
+html {
+  scroll-behavior: smooth;
+}
+
+::-webkit-scrollbar {
+  width: 15px;
+}
+
+::-webkit-scrollbar-track {
+  border-radius: 5px;
+  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
 }
\ No newline at end of file
diff --git a/Simon Game/styles.css b/Simon Game/styles.css
index c57fd99..cfd5a57 100644
--- a/Simon Game/styles.css	
+++ b/Simon Game/styles.css	
@@ -227,4 +227,21 @@ backHome a:hover,
       padding: 0px 9px;
   }
   
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/Snake Game/style.css b/Snake Game/style.css
index 407efcc..4ee580c 100644
--- a/Snake Game/style.css	
+++ b/Snake Game/style.css	
@@ -231,4 +231,21 @@ backHome a:hover,
         padding: 0px 9px;
     }
     
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/Sudoku_Game_8x8/style.css b/Sudoku_Game_8x8/style.css
index 52722f5..e83ed75 100644
--- a/Sudoku_Game_8x8/style.css
+++ b/Sudoku_Game_8x8/style.css
@@ -265,4 +265,21 @@ html{
         font-size: 7vw;
     }
 
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/Sudoku_Game_9x9/style.css b/Sudoku_Game_9x9/style.css
index aa37382..ffb3386 100644
--- a/Sudoku_Game_9x9/style.css
+++ b/Sudoku_Game_9x9/style.css
@@ -299,4 +299,21 @@ html{
         font-size: 6vw;
     }
 
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/Tetris/style.css b/Tetris/style.css
index aceff2f..9ba6b62 100644
--- a/Tetris/style.css
+++ b/Tetris/style.css
@@ -193,7 +193,23 @@ html{
   }
   
 }
+html {
+  scroll-behavior: smooth;
+}
+
+::-webkit-scrollbar {
+  width: 15px;
+}
 
+::-webkit-scrollbar-track {
+  border-radius: 5px;
+  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+}
 
 
 
diff --git a/Tic-Tac-Toe/style.css b/Tic-Tac-Toe/style.css
index 3ab6b85..380e662 100644
--- a/Tic-Tac-Toe/style.css
+++ b/Tic-Tac-Toe/style.css
@@ -370,4 +370,21 @@ html{
         padding: 0px 9px;
     }
     
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/UNO/css/style.css b/UNO/css/style.css
index 40e8afb..d486520 100644
--- a/UNO/css/style.css
+++ b/UNO/css/style.css
@@ -598,4 +598,21 @@ html{
         padding: 0px 9px;
     }
     
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/Word Scramble/style.css b/Word Scramble/style.css
index fd09a99..4af4fab 100644
--- a/Word Scramble/style.css	
+++ b/Word Scramble/style.css	
@@ -341,4 +341,21 @@ html{
         padding: 0px 9px;
     }
     
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/Word/style.css b/Word/style.css
index 4131099..81857f2 100644
--- a/Word/style.css
+++ b/Word/style.css
@@ -148,3 +148,20 @@ body {
     font-size: 16px;
   }
 }
+html {
+  scroll-behavior: smooth;
+}
+
+::-webkit-scrollbar {
+  width: 15px;
+}
+
+::-webkit-scrollbar-track {
+  border-radius: 5px;
+  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+}
\ No newline at end of file
diff --git a/css_files/_8_Puzzle_game.css b/css_files/_8_Puzzle_game.css
index 88f7b6b..47684cd 100644
--- a/css_files/_8_Puzzle_game.css
+++ b/css_files/_8_Puzzle_game.css
@@ -236,4 +236,21 @@ html{
         padding: 0px 9px;
     }
     
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/css_files/checkers_game.css b/css_files/checkers_game.css
index ed4fd1c..232bb46 100644
--- a/css_files/checkers_game.css
+++ b/css_files/checkers_game.css
@@ -394,4 +394,21 @@ body {
       padding: 0px 9px;
   }
   
+}
+html {
+  scroll-behavior: smooth;
+}
+
+::-webkit-scrollbar {
+  width: 15px;
+}
+
+::-webkit-scrollbar-track {
+  border-radius: 5px;
+  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+}
+
+::-webkit-scrollbar-thumb {
+  border-radius: 5px;
+  background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
 }
\ No newline at end of file
diff --git a/css_files/connect4.css b/css_files/connect4.css
index 3b0eecd..8efa68d 100644
--- a/css_files/connect4.css
+++ b/css_files/connect4.css
@@ -415,4 +415,21 @@ html{
         padding: 0px 9px;
     }
     
-}
\ No newline at end of file
+}
+html {
+	scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+	width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+	border-radius: 5px;
+	box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+	border-radius: 5px;
+	background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/css_files/sudocu_game_4x4.css b/css_files/sudocu_game_4x4.css
index 5ac5ec4..5c15abe 100644
--- a/css_files/sudocu_game_4x4.css
+++ b/css_files/sudocu_game_4x4.css
@@ -258,4 +258,21 @@ html{
     padding: 3px;
     border-radius: 5px;
 
-}
\ No newline at end of file
+}
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file
diff --git a/css_files/sudoku_game_6x6.css b/css_files/sudoku_game_6x6.css
index cd2922c..9aef417 100644
--- a/css_files/sudoku_game_6x6.css
+++ b/css_files/sudoku_game_6x6.css
@@ -277,3 +277,20 @@ html{
     }
 }
 
+html {
+    scroll-behavior: smooth;
+  }
+  
+  ::-webkit-scrollbar {
+    width: 15px;
+  }
+  
+  ::-webkit-scrollbar-track {
+    border-radius: 5px;
+    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.25);
+  }
+  
+  ::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: linear-gradient(to top, rgba(0, 212, 255, 1), rgba(9, 9, 121, 1));
+  }
\ No newline at end of file