MobaXterm-GenKey/index.html

198 lines
5.0 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<head>
<title>MobaXterm GenKey</title>
<link href="https://fonts.googleapis.cnpmjs.org/css?family=Roboto:300,400,500,700" rel="stylesheet">
<style>
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
form {
width: 300px; /* Set the width of the form */
padding: 20px;
border: 1px solid #ccc;
border-radius: 5px;
background: #f5f5f5;
}
h1 {
color: #303F9F;
text-justify: newspaper;
text-align: justify;
margin-bottom: 20px;
}
.container {
margin-top: 10px;
margin-bottom: 10px;
}
button {
display: block;
width: 100%;
padding: 13px;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
margin: 5px 0 20px;
font-size: 15px;
}
button:hover {
background-color: #007bff;
}
.github {
text-align: center;
}
html, body {
display: flex;
justify-content: center;
font-family: Roboto, Arial, sans-serif;
font-size: 15px;
background-color: #2b2b2b;
color: #212121;
}
form {
border: 5px solid #f1f1f1;
}
input[type=text], input[type=text] {
width: 100%;
padding: 16px 8px;
margin: 10px 0 10px;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
#space {
height: 15px;
}
h1 {
text-align: center;
}
button:hover {
opacity: 0.8;
}
.container {
padding: 16px 0;
text-align: left;
}
.github {
padding: 20px 0 0;
text-align: right;
}
.github span {
color: #212121;
font-size: smaller;
}
.github span a {
color: #242424;
font-weight: bold;
}
.github span a img {
height: 18px;
padding-bottom: 3px;
vertical-align: middle;
}
#btnReset {
margin-top: 15px;
background-color: #757575;
}
#btnSubmit {
background-color: #3F51B5;
}
#lblName, #lblVersion {
font-weight: bold;
}
#inputName, #inputVersion {
height: 35px;
margin-top: 10px;
border: 1px solid #ccc;
padding: 5px 5px 5px 10px;
}
#inputName {
width: 300px;
height: 47px;
color: #333;
}
#inputVersion {
width: 283px;
height: 35px;
}
</style>
</head>
<body>
<form action="./gen" mothod="get">
<h1>MobaXterm&ensp;GenKey</h1>
<div class="container">
<label for="name" id="lblName">Name</label>
<label>
<input name="name" id="inputName" placeholder="Enter Name" required type="text">
</label>
<div id="space"></div>
<label for="ver" id="lblVersion">Version</label>
<label>
<input name="ver" id="inputVersion" type="number" placeholder="Enter Version (24.1)" step="0.1" min="0" />
</label>
</div>
<button id="btnReset" type="reset">Reset</button>
<button id="btnSubmit" type="submit">Generate</button>
<div class="github">
<label>
</label>
<span>
<a href="https://github.com/lzcapp/MobaXterm-GenKey" style="text-decoration: none;">
<img src="https://github.githubassets.com/favicons/favicon.svg" alt="GitHub">
MobaXterm-GenKey
</a>
<span id="forked">forked from</span>
<a href="https://github.com/malaohu/MobaXterm-GenKey" style="text-decoration: none;">
malaohu
</a>
</span>
</div>
</form>
<script>
const userLanguage = navigator.language || navigator.userLanguage;
const languageCode = userLanguage.substring(0, 2);
console.log(languageCode);
if (languageCode === "zh") {
document.documentElement.lang = "zh";
document.getElementById("lblName").innerHTML = "用户名"
document.getElementById("inputName").placeholder = "请输入用户名"
document.getElementById("lblVersion").innerHTML = "版本"
document.getElementById("inputVersion").placeholder = "请输入版本24.1"
document.getElementById("btnReset").innerHTML = "清空"
document.getElementById("btnSubmit").innerHTML = "生成"
document.getElementById("forked").innerHTML = "分叉自"
}
</script>
</body>
</html>