feat(tpl): improve form accessibility

marjune163 · marjune163 · commit a7a79858703e · 2020-04-06T20:48:54.000+08:00
diff --git a/src/tpl/assert/main.css b/src/tpl/assert/main.css
@@ -186,11 +186,11 @@ em {
 	display: flex;
 }
 
-.mkdir input {
+.mkdir .name {
 	flex: 1 1 auto;
 }
 
-.mkdir button {
+.mkdir .submit {
 	padding-left: 0.5em;
 	padding-right: 0.5em;
 }
diff --git a/src/tpl/assert/main.css.go b/src/tpl/assert/main.css.go
@@ -161,10 +161,10 @@ background: #f7f7f7;
 .mkdir form {
 display: flex;
 }
-.mkdir input {
+.mkdir .name {
 flex: 1 1 auto;
 }
-.mkdir button {
+.mkdir .submit {
 padding-left: 0.5em;
 padding-right: 0.5em;
 }
diff --git a/src/tpl/page.html b/src/tpl/page.html
@@ -3,7 +3,7 @@
 <head>
 	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 	<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
-	<meta name="viewport" content="initial-scale=1"/>
+	<meta name="viewport" content="initial-scale=1, user-scalable=no"/>
 	<meta name="format-detection" content="telephone=no"/>
 	<meta name="renderer" content="webkit"/>
 	<meta name="wap-font-scale" content="no"/>
@@ -21,17 +21,17 @@
 {{if .CanUpload}}
 	<div class="upload">
 		<form method="POST" action="{{.SubItemPrefix}}?upload" enctype="multipart/form-data">
-			<input type="file" name="files" class="files" multiple="multiple"/>
-			<input type="submit" value="Upload"/>
+			<input type="file" name="files" multiple="multiple" class="files"/>
+			<input type="submit" value="Upload" class="submit"/>
 		</form>
 	</div>
 {{end}}
 
 {{if .CanMkdir}}
 	<div class="mkdir">
 		<form method="POST" action="{{.SubItemPrefix}}?mkdir">
-			<input type="text" name="name" autocomplete="off"/>
-			<button type="submit">mkdir</button>
+			<input type="text" name="name" autocomplete="off" class="name"/>
+			<input type="submit" value="mkdir" class="submit"/>
 		</form>
 	</div>
 {{end}}
diff --git a/src/tpl/page.html.go b/src/tpl/page.html.go
@@ -13,7 +13,7 @@ const pageTplStr = `
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
-<meta name="viewport" content="initial-scale=1"/>
+<meta name="viewport" content="initial-scale=1, user-scalable=no"/>
 <meta name="format-detection" content="telephone=no"/>
 <meta name="renderer" content="webkit"/>
 <meta name="wap-font-scale" content="no"/>
@@ -29,16 +29,16 @@ const pageTplStr = `
 {{if .CanUpload}}
 <div class="upload">
 <form method="POST" action="{{.SubItemPrefix}}?upload" enctype="multipart/form-data">
-<input type="file" name="files" class="files" multiple="multiple"/>
-<input type="submit" value="Upload"/>
+<input type="file" name="files" multiple="multiple" class="files"/>
+<input type="submit" value="Upload" class="submit"/>
 </form>
 </div>
 {{end}}
 {{if .CanMkdir}}
 <div class="mkdir">
 <form method="POST" action="{{.SubItemPrefix}}?mkdir">
-<input type="text" name="name" autocomplete="off"/>
-<button type="submit">mkdir</button>
+<input type="text" name="name" autocomplete="off" class="name"/>
+<input type="submit" value="mkdir" class="submit"/>
 </form>
 </div>
 {{end}}

Original file line number	Diff line number	Diff line change
`@@ -186,11 +186,11 @@ em {`
`186`	`186`	`display: flex;`
`187`	`187`	`}`
`188`	`188`
`189`		`-.mkdir input {`
	`189`	`+.mkdir .name {`
`190`	`190`	`flex: 1 1 auto;`
`191`	`191`	`}`
`192`	`192`
`193`		`-.mkdir button {`
	`193`	`+.mkdir .submit {`
`194`	`194`	`padding-left: 0.5em;`
`195`	`195`	`padding-right: 0.5em;`
`196`	`196`	`}`
Original file line number	Diff line number	Diff line change
`@@ -161,10 +161,10 @@ background: #f7f7f7;`
`161`	`161`	`.mkdir form {`
`162`	`162`	`display: flex;`
`163`	`163`	`}`
`164`		`-.mkdir input {`
	`164`	`+.mkdir .name {`
`165`	`165`	`flex: 1 1 auto;`
`166`	`166`	`}`
`167`		`-.mkdir button {`
	`167`	`+.mkdir .submit {`
`168`	`168`	`padding-left: 0.5em;`
`169`	`169`	`padding-right: 0.5em;`
`170`	`170`	`}`