Make HTML mobile friendly

[rchoz]

Would love to have a mobile friendly layout. Thanks!

[xiexuyuyan]

I wrote some clumsy code and hope it can be useful.

	<script>
		if (
			navigator.userAgent.match(/Mobi/i) ||
			navigator.userAgent.match(/Android/i) ||
			navigator.userAgent.match(/iPhone/i)
		) {
			console.log("HTML mobile friendly");
			const addMeta = (name, content) => {
				const meta = document.createElement('meta');
				meta.content = content;
				meta.name = name;
				document.getElementsByTagName('head')[0].appendChild(meta);
			};

			addMeta(
				'viewport',
				'width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover',
			);
		}


		var mWidth = 0;
		$('.app_header_icon').click(function () {
			console.log("hello");
			var zindex = document.getElementById("treeview").style.zIndex;

			if (zindex == 1) {
				mWidth = document.getElementById("list_container").style.width;
				document.getElementById("list_container").style.width = 100 + "%";
			} else {
				console.log("mWidth: " + mWidth);
				document.getElementById("list_container").style.width = mWidth;
			}

			var newzindex = zindex == 1 ? -1 : 1;
			var newLeft = zindex == 1 ? 0 : 205;
			document.getElementById("treeview").style.zIndex = newzindex;
			document.getElementsByClassName("vsplitbar")[0].style.zIndex = newzindex;
			document.getElementById("list_container").style.left = newLeft + "px";

			console.log("zindex: " + zindex);
			console.log("newzindex: " + newzindex);
			console.log("newLeft: " + newLeft);

		});
	</script>

[xiexuyuyan]

Would love to have a mobile friendly layout. Thanks!

I wrote some clumsy code, append to the end of the generated HTML file.