thedesk/app/opening.html

97 lines
2.2 KiB
HTML
Raw Permalink Normal View History

2020-05-10 14:26:07 +10:00
<!DOCTYPE html>
<html lang="ja">
<head>
<title>TheDesk</title>
<meta content="width=device-width,initial-scale=1.0" name="viewport" />
<meta charset="utf-8" />
<style>
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: local('Open Sans Light'), local('OpenSans-Light'), url('./fonts/OpenSans-Light.ttf') format('truetype');
}
body {
font-family: 'Open Sans';
-webkit-app-region: drag;
cursor: move;
padding: 5px;
padding-top: 15px;
background-color: #222222;
color: white;
text-align: center;
}
.loading {
animation: throbber-loader 1000ms 300ms infinite ease-out;
background: #3d3d3d;
display: inline-block;
position: relative;
text-indent: -9999px;
width: 0.9em;
2020-05-10 18:32:49 +10:00
height: 0.9em;
margin: 0 .9em;
2020-05-10 14:26:07 +10:00
}
.loading:before,
.loading:after {
background: #3d3d3d;
content: '\x200B';
display: inline-block;
width: 0.9em;
2020-05-10 18:32:49 +10:00
height: 0.9em;
2020-05-10 14:26:07 +10:00
position: absolute;
top: 0;
}
.loading:before {
animation: throbber-loader 1000ms 150ms infinite ease-out;
2020-05-10 18:32:49 +10:00
left: -1.9em;
2020-05-10 14:26:07 +10:00
}
.loading:after {
animation: throbber-loader 1000ms 450ms infinite ease-out;
2020-05-10 18:32:49 +10:00
right: -1.9em;
2020-05-10 14:26:07 +10:00
}
@keyframes throbber-loader {
0% {
background: #3d3d3d;
}
10% {
background: #6b9dc8;
}
40% {
background: #3d3d3d;
}
}
a,
button {
-webkit-app-region: no-drag;
}
2020-05-10 18:32:49 +10:00
h1 {
margin: 0;
}
#maxim {
font-size: 0.7rem;
}
2020-05-10 14:26:07 +10:00
</style>
</head>
<body class="center" style="overflow: hidden;">
<img src="./img/desk-animation.svg" style="max-width: 62%;" />
<h1>TheDesk</h1>
2020-05-10 18:32:49 +10:00
<span id="ver"></span><br />
<span class="loading"></span><br />
2020-05-10 14:26:07 +10:00
<div class="cp">
2020-05-10 18:32:49 +10:00
<span id="maxim"></span><br />
2020-05-10 14:26:07 +10:00
<script>
if (location.search) {
2020-05-10 18:32:49 +10:00
var m = location.search.match(/\?ver=([0-9.]+)&codename=([a-zA-Z]+)&maxim=(.+)/)
2020-05-10 14:26:07 +10:00
var ver = m[1]
var code = m[2]
2020-05-10 18:32:49 +10:00
var maxim = m[3]
2020-05-10 14:26:07 +10:00
document.getElementById('ver').innerText = `${ver}(${code})`
2020-05-10 18:32:49 +10:00
document.getElementById('maxim').innerText = `${decodeURI(maxim)}`
2020-05-10 14:26:07 +10:00
}
</script>
</div>
</body>
</html>