2shortplanks/index.html

## index.html
<!DOCTYPE html>

<head>
    <style>
        body { background: purple; font-family: Helvetica, sans-serif }
        h1 { font-size: 100pt; font-size: 20vw; text-align: right}
        h2 { font-size: min(3vw, 50px) }
        p  { font-size: min(2vw, 30px) }
        #time { background: yellow; padding: 0.5vw }
        .cyan { background: cyan; padding: 0.5vw }
    </style>
</head>

<body>
    <h1><span id="time">--:--:--</span></h1>

    <h2><span class="cyan">tinyurl.com/tabtime shows the time in the page title</span></h2>
    <p><span class="cyan">
        Useful for background tabs when running in
        a fullscreen mode that won't show your taskbar / menubar
    </span></p>

    <script>
        timeElement = document.getElementById("time");
        window.setInterval(function () {
            var d = new Date()
            output = "" + d.getHours() + ":"
            if (d.getMinutes() < 10) {
                output += "0";
            }
            output += d.getMinutes() + ":"
            if (d.getSeconds() < 10) {
                output += "0";
            }
            output += d.getSeconds()
            document.title = output
            timeElement.innerText = output
        }, 1000);
    </script>
</body>

</html>
	<!DOCTYPE html>

	<head>
	<style>
	body { background: purple; font-family: Helvetica, sans-serif }
	h1 { font-size: 100pt; font-size: 20vw; text-align: right}
	h2 { font-size: min(3vw, 50px) }
	p { font-size: min(2vw, 30px) }
	#time { background: yellow; padding: 0.5vw }
	.cyan { background: cyan; padding: 0.5vw }
	</style>
	</head>

	<body>
	<h1><span id="time">--:--:--</span></h1>

	<h2><span class="cyan">tinyurl.com/tabtime shows the time in the page title</span></h2>
	<p><span class="cyan">
	Useful for background tabs when running in
	a fullscreen mode that won't show your taskbar / menubar
	</span></p>

	<script>
	timeElement = document.getElementById("time");
	window.setInterval(function () {
	var d = new Date()
	output = "" + d.getHours() + ":"
	if (d.getMinutes() < 10) {
	output += "0";
	}
	output += d.getMinutes() + ":"
	if (d.getSeconds() < 10) {
	output += "0";
	}
	output += d.getSeconds()
	document.title = output
	timeElement.innerText = output
	}, 1000);
	</script>
	</body>

	</html>