new: Introducing an extra mode in One-handed Mode

index.html

@@ -18,19 +18,19 @@
       });
     }
   </script> -->
-	<link rel="manifest" href="manifest.json?v=1703602562279">
+	<link rel="manifest" href="manifest.json?v=1703602562280">
 	<title>Search &bull; Casa Mia</title>
-	<link rel="icon" type="image/x-icon" href="./favicon.ico?v=1703602562279">
+	<link rel="icon" type="image/x-icon" href="./favicon.ico?v=1703602562280">
 	<meta name="theme-color" content="black">
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 	<meta name="color-scheme" content="light only">
-	<link rel="stylesheet" href="./style.css?v=1703602562279" />
-	<script src="./index.js?v=1703602562279" type="module"></script>
+	<link rel="stylesheet" href="./style.css?v=1703602562280" />
+	<script src="./index.js?v=1703602562280" type="module"></script>
 	<link rel="preconnect" href="https://raw.githubusercontent.com" crossorigin />
 	<link rel="preconnect" href="https://fonts.bunny.net">
 	<link href="https://fonts.bunny.net/css?family=nanum-brush-script:400|advent-pro:400|ubuntu:300,300i,400,400i,500,500i,700,700i|ubuntu-condensed:400|ubuntu-mono:400,400i,700,700i|vujahday-script:400|are-you-serious:400|alkatra:400|montez:400"
 		  rel="stylesheet" />
-	<link rel="stylesheet" href="./animations.css?v=1703602562279">
+	<link rel="stylesheet" href="./animations.css?v=1703602562280">
 	<link rel="stylesheet" href="./icons.css" />
 	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 </head>
@@ -141,7 +141,8 @@ <h1 id="widget-2" class="widget-slide brush-text-style-1 has-shadow">Welcome</h1
 			<label for="searchbar-position-drop" class="modal-option custom-dropdown">One-handed mode <select
 						class="setting-preview" name="searchbar-position-drop" id="searchbar-position-drop">
 					<option value="top">Disabled</option>
-					<option value="bottom">Enabled</option>
+					<option value="middle">Partial</option>
+					<option value="bottom">Full</option>
 				</select></label>
 		</div>
 		<div class="modal-group">

js_modules/load_preferences.js

@@ -392,6 +392,11 @@ function defaultSearchbarPosition(value) {
 			document.body.style.justifyContent = 'flex-end';
 			break;
 		};
+		case 'middle': {
+			searchbar.style.order = '1';
+			document.body.style.justifyContent = 'center';
+			break;
+		};
 	}
 };