fix mobile search better

Author: MathMan05

src/webpage/index.ts

@@ -173,6 +173,10 @@ import {I18n} from "./i18n.js";
 				searchBox.parentElement!.classList.add("searching");
 			}
 		});
+		const sideContainDiv = document.getElementById("sideContainDiv") as HTMLElement;
+		searchBox.onclick = () => {
+			sideContainDiv.classList.remove("hideSearchDiv");
+		};
 		searchX.onclick = () => {
 			if (searchX.classList.contains("svg-plainx")) {
 				markdown.txt = [];

src/webpage/localuser.ts

@@ -2845,6 +2845,7 @@ class Localuser {
 						for (const elm of htmls) elm.remove();
 					}
 					const htmls: HTMLElement[] = [];
+					sideContainDiv.classList.remove("hideSearchDiv");
 					for (const message of messages) {
 						if (channel !== message.channel) {
 							channel = message.channel;
@@ -2857,6 +2858,7 @@ class Localuser {
 						const html = message.buildhtml(undefined, true);
 						html.addEventListener("click", async () => {
 							try {
+								sideContainDiv.classList.add("hideSearchDiv");
 								await message.channel.focus(message.id);
 							} catch (e) {
 								console.error(e);

src/webpage/style.css

@@ -2721,6 +2721,10 @@ fieldset input[type="radio"] {
 	#sideContainDiv.searchDiv {
 		right: 0;
 		overflow: auto;
+		transition: transform 0.2s;
+	}
+	.hideSearchDiv {
+		transform: translate(100%);
 	}
 	#page:has(#maintoggle:checked) #maintoggleicon {
 		rotate: 180deg;