transform-origin: top left; */
}
body {
- font-family: 'Exo', sans-serif;
+ font-family: 'Lato', sans-serif;
color: white;
+
+ /* Needs to be adjusted per-font! 2px/4px is a good choice for Exo. */
+ --main-padding-top-adjust: 0px;
+ --main-padding-top-large-adjust: 0px;
}
/* Score */
text-align: center;
height: 35px;
background: linear-gradient(to bottom, #00a, #008);
- padding-top: 2px; /* needs to be adjusted per-font! */
+ padding-top: var(--main-padding-top-adjust);
}
.score {
text-align: center;
background: linear-gradient(to bottom, #00c, #00a);
width: 110px;
height: 35px;
- padding-top: 2px; /* needs to be adjusted per-font! */
+ padding-top: var(--main-padding-top-adjust);
}
/* Clock, to the right of score */
background: linear-gradient(to bottom, #00a, #008);
text-align: center;
height: 36px;
- padding-top: 2px;
+ padding-top: var(--main-padding-top-adjust);
width: 90px;
}
.clockbug-hidden {
.lowerthird-headline-content {
padding-left: 20px;
position: absolute;
- padding-top: 4px; /* needs to be adjusted per-font! */
+ padding-top: var(--main-padding-top-large-adjust);
}
.lowerthird-headline-content-hidden {
clip: rect(0px,0px,200px,0px);
.lowerthird-subheading-content {
position: absolute;
padding-left: 20px;
- padding-top: 2px; /* needs to be adjusted per-font! */
+ padding-top: var(--main-padding-top-adjust);
}
.lowerthird-subheading-content-hidden {
width: 0px;
<head>
<meta http-equiv="content-type" value="text/html; charset=utf-8" />
<meta charset="utf-8" />
- <link href="fonts/exo.css" rel="stylesheet">
+<!-- <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet"> -->
+ <link href="fonts/lato.css" rel="stylesheet">
<link href="score.css" rel="stylesheet">
</head>
<body>
if (sec < 10) sec = "0" + sec;
let text = min + ":" + sec;
- // This is a hack around the fact that Exo has variable-width numerals.
- // It doesn't look fantastic, but for the clock, it's better not to have
- // the text jumping around.
- let html = "";
- for (let i = 0; i < text.length; ++i) {
- if (text.charAt(i) === ':') {
- html += ':';
- } else {
- html += "<div style='display: inline-block; width: 15px'>" + text.charAt(i) + "</div>";
+ if (false) {
+ // This is a hack around the fact that Exo has variable-width numerals.
+ // It doesn't look fantastic, but for the clock, it's better not to have
+ // the text jumping around.
+ let html = "";
+ for (let i = 0; i < text.length; ++i) {
+ if (text.charAt(i) === ':') {
+ html += ':';
+ } else {
+ html += "<div style='display: inline-block; width: 15px'>" + text.charAt(i) + "</div>";
+ }
}
+ document.getElementById('clock').innerHTML = html;
+ } else {
+ document.getElementById('clock').innerHTML = text;
}
- document.getElementById('clock').innerHTML = html;
}
function goalA()