1
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-04-27 02:38:27 -04:00

fix static video pages

This commit is contained in:
Jake Jarvis 2019-10-15 11:33:26 -04:00
parent 8fd49a1410
commit 81e8c37682
2 changed files with 28 additions and 43 deletions

View File

@ -3,17 +3,16 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>🎉 Cranky Birthday Boy on VHS Tape 📼 &ndash; Jake Jarvis</title>
<link rel="canonical" href="https://jarv.is/birthday/">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-128.png" sizes="128x128">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-96.png" sizes="96x96">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-64.png" sizes="64x64">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-48.png" sizes="48x48">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-32.png" sizes="32x32">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-16.png" sizes="16x16">
<link rel="apple-touch-icon" href="https://jarv.is/apple-touch-icon.png">
<link rel="icon" href="https://jarv.is/favicon-192.png" sizes="192x192">
<link rel="icon" href="https://jarv.is/favicon-48.png" sizes="48x48">
<link rel="icon" href="https://jarv.is/favicon-32.png" sizes="32x32">
<link rel="icon" href="https://jarv.is/favicon-16.png" sizes="16x16">
<link rel="shortcut icon" href="https://jarv.is/favicon.ico">
<link rel="dns-prefetch" href="https://stats.jarv.is">
<link rel="author" href="https://jarv.is/humans.txt">
<style>
html, body {
display: table;
@ -22,7 +21,6 @@
margin: 0;
background-color: #000000;
}
div#container {
display: table-cell;
vertical-align: middle;
@ -32,21 +30,16 @@
height: 100%;
text-align: center;
}
div#logo {
margin: 16px;
}
div#logo svg {
height: 40px;
width: 40px;
padding: 4px;
margin: 16px;
}
video {
width: 854px;
height: 480px;
}
/* Responsive embed: */
@media screen and (max-width: 854px) {
video {
@ -58,7 +51,7 @@
</head>
<body>
<div id="container">
<video id="player" poster="https://jarv.is/birthday/thumb.png" controls crossorigin playsinline preload="none">
<video poster="https://jarv.is/birthday/thumb.png" controls crossorigin playsinline preload="none">
<!-- Video files -->
<source src="https://jarv.is/birthday/birthday.webm" type="video/webm">
<source src="https://jarv.is/birthday/birthday.mp4" type="video/mp4">
@ -70,7 +63,6 @@
<div id="logo">
<a href="https://jarv.is/" title="Jake Jarvis">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 96 144.1">
<title>Jake Jarvis</title>
<polygon fill="#6fbc4e" points="57.6 0 38.4 11.1 38.4 11.1 76.8 33.2 96 22.1 96 22.1 57.6 0 57.6 0"/>
<polygon fill="#6fbc4e" points="19.2 66.5 0 77.6 0 77.6 19.2 88.7 38.4 77.6 38.4 77.6 19.2 66.5 19.2 66.5"/>
<polygon fill="#6fbc4e" points="57.6 88.7 19.2 110.9 19.2 110.9 38.4 121.9 76.8 99.8 76.8 99.8 57.6 88.7 57.6 88.7"/>

View File

@ -3,73 +3,67 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Powncer on &quot;The Lab with Leo Laporte&quot; &ndash; Jake Jarvis &#x1f468;&#x200d;&#x1f4bb;</title>
<link rel="canonical" href="https://jarv.is/leo/">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-128.png" sizes="128x128">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-96.png" sizes="96x96">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-64.png" sizes="64x64">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-48.png" sizes="48x48">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-32.png" sizes="32x32">
<link rel="icon" type="image/png" href="https://jarv.is/favicon-16.png" sizes="16x16">
<link rel="apple-touch-icon" href="https://jarv.is/apple-touch-icon.png">
<link rel="icon" href="https://jarv.is/favicon-192.png" sizes="192x192">
<link rel="icon" href="https://jarv.is/favicon-48.png" sizes="48x48">
<link rel="icon" href="https://jarv.is/favicon-32.png" sizes="32x32">
<link rel="icon" href="https://jarv.is/favicon-16.png" sizes="16x16">
<link rel="shortcut icon" href="https://jarv.is/favicon.ico">
<link rel="dns-prefetch" href="https://stats.jarv.is">
<link rel="author" href="https://jarv.is/humans.txt">
<style>
html, body {
display: table;
width: 100%;
height: 100%;
margin: 0;
color: #202020;
color: #fefefe;
background-color: #000000;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
"Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans",
"Droid Sans", "Helvetica Neue", sans-serif,
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
div#container {
display: table-cell;
vertical-align: middle;
margin: 0 auto;
padding: 20px;
padding: 40px 0;
width: 100%;
height: 100%;
text-align: center;
}
div#logo {
margin-top: 16px;
margin-bottom: 8px;
}
div#logo svg {
height: 48px;
width: 48px;
padding: 4px;
margin-top: 16px;
margin-bottom: 8px;
}
p#copyright {
padding: 0 10px;
margin: 0;
font-size: 0.85em;
line-height: 1.5em;
color: #666;
color: #999999;
}
p#copyright a {
font-weight: bold;
text-decoration: none;
color: #666;
color: #999999;
}
video {
width: 640px;
width: 960px;
height: 540px;
margin: 0 auto;
font-family: inherit;
}
/* Responsive embed: */
@media screen and (max-width: 680px) {
@media screen and (max-width: 960px) {
video {
width: 100%;
height: auto;
}
h1 {
font-size: 1.6em;
@ -82,7 +76,7 @@
<div id="container">
<h1>Facebook App on <em>"The Lab with Leo Laporte"</em></h1>
<video id="player" poster="https://jarv.is/leo/thumb.png" controls crossorigin playsinline preload="none">
<video poster="https://jarv.is/leo/thumb.png" controls crossorigin playsinline preload="none">
<!-- Video files -->
<source src="https://jarv.is/leo/leo.webm" type="video/webm">
<source src="https://jarv.is/leo/leo.mp4" type="video/mp4">
@ -95,9 +89,8 @@
</video>
<div id="logo">
<a href="https://jarv.is/">
<a href="https://jarv.is/" title="Jake Jarvis">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 96 144.1">
<title>Jake Jarvis</title>
<polygon fill="#6fbc4e" points="57.6 0 38.4 11.1 38.4 11.1 76.8 33.2 96 22.1 96 22.1 57.6 0 57.6 0"/>
<polygon fill="#6fbc4e" points="19.2 66.5 0 77.6 0 77.6 19.2 88.7 38.4 77.6 38.4 77.6 19.2 66.5 19.2 66.5"/>
<polygon fill="#6fbc4e" points="57.6 88.7 19.2 110.9 19.2 110.9 38.4 121.9 76.8 99.8 76.8 99.8 57.6 88.7 57.6 88.7"/>
@ -109,7 +102,7 @@
</a>
</div>
<p id="copyright">Video is property of <a href="https://leolaporte.com/" target="_blank" rel="noopener noreferrer nofollow">Leo Laporte</a> and <strong>G4techTV</strong> / <strong>HOW TO Channel</strong>. &copy; 2007.</p>
<p id="copyright">Video is property of <a href="https://leolaporte.com/" target="_blank" rel="noopener noreferrer nofollow">Leo Laporte</a> and <a href="https://en.wikipedia.org/wiki/G4techTV" target="_blank" rel="noopener noreferrer nofollow">G4techTV / HOW TO Channel</a>. &copy; 2007.</p>
</div>
<script>