jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-07-21 19:21:18 -04:00
Code Issues Activity

sensible padding (aka wtf was I thinking)

Browse Source
This commit is contained in:
Jake Jarvis
2019-08-11 13:56:48 -04:00
parent 4559011bcc
commit 8b8005ec1d
3 changed files with 39 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
content/_index.md
View File

@@ -2,5 +2,5 @@
title = "Jake Jarvis – Web & Mobile Developer in Boston, MA" title = "Jake Jarvis – Web & Mobile Developer in Boston, MA"
description = "I'm a full-stack web engineer and mobile developer based in Boston, Massachusetts specializing in modern JavaScript frameworks and iOS apps." description = "I'm a full-stack web engineer and mobile developer based in Boston, Massachusetts specializing in modern JavaScript frameworks and iOS apps."
type = "home" type = "home"
date = "2019-08-04" date = "2019-08-10"
+++ +++

43
static/leo/index.html
View File

@@ -27,41 +27,49 @@
"Droid Sans", "Helvetica Neue", sans-serif, "Droid Sans", "Helvetica Neue", sans-serif,
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
} }
div#container { div#container {
display: table-cell; display: table-cell;
vertical-align: middle; vertical-align: middle;
margin: 0 auto; margin: 0 auto;
padding: 20px;
width: 100%; width: 100%;
height: 100%; height: 100%;
text-align: center; text-align: center;
} }
p#logo img {
p#logo {
margin-top: 16px;
margin-bottom: 8px;
}
p#logo svg {
height: 48px; height: 48px;
width: 48px; width: 48px;
margin-top: 6px; padding: 4px;
} }
p#copyright { p#copyright {
padding: 0 10px;
margin: 0;
font-size: 0.85em; font-size: 0.85em;
line-height: 1.5em; line-height: 1.5em;
color: #666; color: #666;
padding: 0 10px;
} }
p#copyright a { p#copyright a {
text-decoration: none;
font-weight: bold; font-weight: bold;
text-decoration: none;
color: #666; color: #666;
} }
/* Responsive embed: */ /* Responsive embed: */
video, .plyr { video, .plyr {
width: 640px; width: 640px;
margin: 0 auto; margin: 0 auto;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", font-family: inherit;
"Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans",
"Droid Sans", "Helvetica Neue", sans-serif,
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
} }
@media screen and (max-width: 640px) {
@media screen and (max-width: 680px) {
video, .plyr { video, .plyr {
width: 100%; width: 100%;
} }
@@ -74,7 +82,7 @@
</head> </head>
<body> <body>
<div id="container"> <div id="container">
<h1>Powncer App on <em>"The Lab with Leo Laporte"</em></h1> <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> <video id="player" poster="https://jarv.is/leo/thumb.png" controls crossorigin playsinline>
<!-- Video files --> <!-- Video files -->
@@ -88,7 +96,20 @@
Your browser doesn't support HTML5 video. <a href="https://jarv.is/leo/leo.mp4">Click here to view the raw .mp4 video.</a> Your browser doesn't support HTML5 video. <a href="https://jarv.is/leo/leo.mp4">Click here to view the raw .mp4 video.</a>
</video> </video>
<p id="logo"><a href="https://jarv.is/"><img src="https://jarv.is/favicon-128.png" id="logo" alt="Return home" title="Return home"></a></p> <p id="logo">
<a href="https://jarv.is/">
<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"/>
<polygon fill="#ffb900" points="38.4 11.1 38.4 33.3 57.6 44.3 57.6 88.7 76.8 99.8 76.8 33.2 38.4 11.1 38.4 11.1"/>
<polygon fill="#ffb900" points="19.2 110.9 19.2 110.8 19.2 88.7 0 77.6 0 121.9 38.4 144.1 38.4 121.9 19.2 110.9 19.2 110.9"/>
<polygon fill="#009cdf" points="76.8 33.2 76.8 99.8 76.8 99.8 38.4 121.9 38.4 144.1 96 110.9 96 22.1 76.8 33.2 76.8 33.2"/>
<polygon fill="#009cdf" points="19.2 110.9 38.4 99.8 38.4 77.6 19.2 88.7 19.2 110.9 19.2 110.9"/>
</svg>
</a>
</p>
<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 <strong>G4techTV</strong> / <strong>HOW TO Channel</strong>. &copy; 2007.</p>
</div> </div>

15
static/style.css
View File

@@ -30,8 +30,8 @@ a {
/*! Home Styles */ /*! Home Styles */
body#home { body#home {
max-width: 1450px; max-width: 1070px;
padding: 6% 8%; padding: 60px;
} }
body#home img#me { body#home img#me {
@@ -432,8 +432,7 @@ body#home footer div#info a#source {
@media screen and (max-width: 800px) { @media screen and (max-width: 800px) {
body#home { body#home {
font-size: 16px; font-size: 16px;
margin-top: 10px; padding: 30px;
margin-bottom: 10px;
} }
body#home img#me { body#home img#me {
@@ -508,8 +507,8 @@ body#home h1 span#wave {
body#notes { body#notes {
font-size: 18px; font-size: 18px;
font-weight: 400; font-weight: 400;
max-width: 1350px; max-width: 1010px;
padding: 20px 10%; padding: 20px 50px;
} }
body#notes a { body#notes a {
@@ -795,13 +794,12 @@ body#notes main#archive section.year div.title {
@media screen and (max-width: 800px) { @media screen and (max-width: 800px) {
body#notes { body#notes {
padding: 20px; padding: 30px;
} }
body#notes, body#notes main#single article { body#notes, body#notes main#single article {
width: 100%; width: 100%;
max-width: 100%; max-width: 100%;
box-sizing: border-box;
} }
body#notes header { body#notes header {
@@ -824,7 +822,6 @@ body#notes main#archive section.year div.title {
body#notes footer div#copyright, body#notes footer div#poweredby { body#notes footer div#copyright, body#notes footer div#poweredby {
width: 50%; width: 50%;
line-height: 20px;
font-size: 14px; font-size: 14px;
line-height: 1.8em; line-height: 1.8em;
} }