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

improved blog header w/ vector logo

Browse Source
This commit is contained in:
Jake Jarvis
2019-04-01 12:43:52 -04:00
parent aed521bffa
commit 287ac496b1
3 changed files with 49 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
layouts/notes/list.html
View File

@@ -1,4 +1,5 @@
{{ define "main" }} {{ define "main" }}
<div id="archive">
{{ range .Data.Pages.GroupByDate "2006" }} {{ range .Data.Pages.GroupByDate "2006" }}
<div class="year"> <div class="year">
@@ -14,4 +15,5 @@
</div> </div>
{{ end }} {{ end }}
</div>
{{ end }} {{ end }}

17
layouts/partials/blog-header.html
View File

@@ -1,4 +1,17 @@
<div id="header"> <div id="header">
<a href="{{ .Site.BaseURL }}" id="home" title="Return to Homepage">&laquo; Return Home</a> {{ if eq .Kind "page" }}<a href="{{ "notes/" | absURL }}" id="more" title="More Posts">&laquo; More Posts</a>{{ else }}<a href="{{ .Site.BaseURL }}" id="more" title="Return Home">&laquo; Return Home</a>{{ end }}
<a href="{{ "notes/" | absURL }}" id="logo" title="Jake Jarvis's Blog"><img src="{{ "logo.png" | absURL }}" alt="Jake Jarvis's Blog" title="Jake Jarvis's Blog"></a> <a href="{{ .Site.BaseURL }}" id="logo" title="Jake Jarvis">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 96 144.1">
<title>Jake Jarvis</title>
<polygon 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" style="fill: #6fbc4e"/>
<polygon 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" style="fill: #6fbc4e"/>
<polygon 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" style="fill: #ffb900"/>
<polygon points="57.6 44.2 57.6 44.3 57.6 44.3 57.6 44.2 57.6 44.2" style="fill: #ffb900"/>
<polygon 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" style="fill: #009cdf"/>
<polygon 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" style="fill: #6fbc4e"/>
<polygon 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" style="fill: #ffb900"/>
<polygon 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" style="fill: #009cdf"/>
</svg>
</a>
</div> </div>

53
static/style.css
View File

@@ -487,6 +487,8 @@ body#notes a:hover {
} }
/* Responsiveness */
@media screen and (max-width: 800px) { @media screen and (max-width: 800px) {
body#notes { body#notes {
padding: 20px; padding: 20px;
@@ -498,7 +500,12 @@ body#notes a:hover {
box-sizing: border-box; box-sizing: border-box;
} }
body#notes div#header a#logo img { body#notes div#header {
margin-top: 0px !important;
margin-bottom: 20px !important;
}
body#notes div#header a#logo img, body#notes div#header a#logo svg {
height: 75px !important; height: 75px !important;
width: 50px !important; width: 50px !important;
} }
@@ -521,11 +528,11 @@ body#notes a:hover {
white-space: normal; white-space: normal;
} }
body#notes div.year div.date { body#notes div#archive div.year div.date {
width: 25% !important; width: 25% !important;
} }
body#notes div.year div.title { body#notes div#archive div.year div.title {
width: 75% !important; width: 75% !important;
} }
} }
@@ -535,19 +542,23 @@ body#notes a:hover {
body#notes div#header { body#notes div#header {
font-size: 16px; font-size: 16px;
margin-top: 20px;
margin-bottom: 40px;
} }
body#notes div#header a#home { body#notes div#header a#more {
border: none; border: none;
font-size: 18px;
font-weight: 400;
} }
body#notes div#header a#logo { body#notes div#header a#logo {
border: none; border: none;
margin: 40px auto; margin: 20px auto;
display: block; display: block;
} }
body#notes div#header a#logo img { body#notes div#header a#logo img, body#notes div#header a#logo svg {
height: 150px; height: 150px;
width: 100px; width: 100px;
margin: 0 auto; margin: 0 auto;
@@ -609,19 +620,13 @@ body#notes div#footer div#panda span {
} }
/* Posts */ /* Single Post */
body#notes div#content, body#notes div#content p { body#notes div#content, body#notes div#content p {
line-height: 1.7; line-height: 1.7;
object-fit: contain; object-fit: contain;
} }
body#notes div#content blockquote {
border-left: 6px solid #0087be;
margin-left: 6px;
padding-left: 15px;
}
body#notes div#single div#info { body#notes div#single div#info {
text-align: center; text-align: center;
} }
@@ -657,7 +662,6 @@ body#notes div#single div.meta {
} }
body#notes div#single div.meta div.tags { body#notes div#single div.meta div.tags {
font-size: 13px;
text-transform: uppercase; text-transform: uppercase;
line-height: 1.5em; line-height: 1.5em;
letter-spacing: 2px; letter-spacing: 2px;
@@ -684,6 +688,13 @@ body#notes div#content img + em {
text-align: center; text-align: center;
font-size: 15px; font-size: 15px;
color: #555555; color: #555555;
margin-top: 5px;
}
body#notes div#content blockquote {
border-left: 6px solid #0087be;
margin-left: 6px;
padding-left: 15px;
} }
body#notes div#content code { body#notes div#content code {
@@ -708,36 +719,36 @@ body#notes div#content hr {
} }
/* Post List */ /* Archive List */
body#notes div.year ul { body#notes div#archive div.year ul {
list-style-type: none; list-style-type: none;
padding-left: 0; padding-left: 0;
display: block; display: block;
} }
body#notes div.year ul li::after { body#notes div#archive div.year ul li::after {
content: ''; content: '';
display: block; display: block;
clear: both; clear: both;
} }
body#notes div.year ul li:last-child { body#notes div#archive div.year ul li:last-child {
margin-bottom: 20px; margin-bottom: 20px;
} }
body#notes div.year ul li+li { body#notes div#archive div.year ul li+li {
padding-top: 20px; padding-top: 20px;
} }
body#notes div.year div.date { body#notes div#archive div.year div.date {
float: left; float: left;
color: #888888; color: #888888;
width: 80px; width: 80px;
font-weight: 400; font-weight: 400;
} }
body#notes div.year div.title { body#notes div#archive div.year div.title {
float: left; float: left;
width: 620px; width: 620px;
} }