sky/index.html at master · McbeEringi/sky · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<!DOCTYPE html>
<html lang="en">
<head prefix="og:http://ogp.me/ns#">
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1">
	<title>Sky Stuff - Top</title>
	<meta name="Description" content="McbeEringi Sky Stuff Top">
	<link rel="icon" type="image/jpeg" href="img/icon.jpg">
	<link rel="icon" type="image/svg+xml" href="img/icon.svg">
	<meta property="og:type" content="website">
	<meta property="og:title" content="Sky Stuff">
	<meta property="og:description" content="A web app for Sky:CotL">
	<meta property="og:url" content="https://mcbeeringi.github.io/sky/index.html">
	<meta property="og:image" content="https://mcbeeringi.github.io/sky/img/icon.png">
	<!--iOS-->
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="default">
	<meta name="apple-mobile-web-app-title" content="Sky Stuff">
	<link rel="apple-touch-icon" href="img/icon.png">
	<!--PWA-->
	<link rel="manifest" href="mf.json">
	<meta name="theme-color" content="#214">
</head>
<body>
	<script src="util.js"></script>
	<style>
		.stuff>a{display:inline-block;width:144px;margin:16px;vertical-align:top;text-align:center;transition:.2s;white-space:nowrap;outline:0;text-decoration:none;}
		.stuff>a::before{content:"";display:block;height:144px;border-radius:25%;background:center/cover var(--img);}
		.stuff>a:hover,.stuff>a:focus{transform:scale(1.05);filter:brightness(1.2)saturate(1.2)drop-shadow(0 0 8px var(--l));}
		@media(max-width:512px){.stuff{text-align:center;}}
		#pwab{width:100%;max-width:256px;height:auto;vertical-align:middle;image-rendering:crisp-edges;image-rendering:pixelated;background:var(--g);border-radius:8px;}
	</style>
	<div class="flex">
		<h1>Sky Stuff</h1>
		<button class="btn a1" style="--bp:-100% 0;" onclick="gcfg();">General Config</button>
	</div>
	<hr>
	<div class="stuff">
		<a href="instr.html" style="--img:url(img/icon/instr.svg);">sky_instruments</a>
		<a href="info.html" style="--img:url(img/icon/info.svg);">sky_info</a>
		<a href="manual.html" style="--img:url(img/icon/manual.svg);">sky_manual</a>
		<a href="seq/" style="--img:url(img/icon/seq.svg);">sky_seq (legacy)</a>
	</div>
	<img hidden id="pwab" width="7" height="3" alt="pwa_banner">
	<a class="btn" style="--bp:-700% 0;" href="https://twitter.com/McbeEringi" target="_blank">Twitter</a>
	<a class="btn" style="--bp:-600% 0;" href="https://discord.gg/BJsbqSZX7s" target="_blank">Discord</a>
	<a class="btn" style="--bp:-600% -100%;" href="https://github.com/McbeEringi/sky" target="_blank">GitHub</a>
	<a class="btn" style="--bp:-700% -100%;" href="https://docs.google.com/forms/d/e/1FAIpQLScPm_U4P3Uk6uEmD95VQDQRgRcbmq8vvPgXP-kdH1v0OX3SEA/viewform?usp=sf_link" target="_blank">Forms</a>
	<script>
		('pwa'in urlq)||(pwab.hidden=false,pwab.src='img/pwab.png');
		texts={...texts,...{
			ja:{sky_instruments:'楽器練習',sky_info:'大キャン&光の翼',sky_manual:'使い方'}
		}[navigator.language.slice(0,2)]};
		[...document.querySelector('.stuff').children].forEach(x=>(texts[x.textContent]&&x.insertAdjacentHTML('beforeend','<br>'+texts[x.textContent])))
	</script>
</body>
</html>