styling/printing

This commit is contained in:
Danny Berger
2013-03-10 16:24:26 -06:00
parent e16f3937ba
commit 60e40ebce1
7 changed files with 109 additions and 32 deletions

View File

@@ -7,8 +7,9 @@
<link rel="icon" type="image/png" href="http://www.gravatar.com/avatar/5544fe6a05400da5a8957ff29dd6718c.png?s=128" /> <link rel="icon" type="image/png" href="http://www.gravatar.com/avatar/5544fe6a05400da5a8957ff29dd6718c.png?s=128" />
<link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css" /> <link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css" />
<link href="/include/site/screen.css" rel="stylesheet" type="text/css" /> <link href="/include/site/default.css" rel="stylesheet" type="text/css" />
<link href="/include/site/pygments.css" rel="stylesheet" type="text/css" /> <link href="/include/site/pygments.css" rel="stylesheet" type="text/css" />
<link href="/include/site/print.css" media="print" rel="stylesheet" type="text/css" />
<link href="/blog/atom.xml" type="application/atom+xml" rel="alternate" title="Danny Berger (blog)" /> <link href="/blog/atom.xml" type="application/atom+xml" rel="alternate" title="Danny Berger (blog)" />
<meta name="twitter:site" content="dpb587" /> <meta name="twitter:site" content="dpb587" />
@@ -36,7 +37,7 @@
})(); })();
</script> </script>
</head> </head>
<body> <body class="layout-{{ page.layout }}">
<header> <header>
<div class="timeline"> <div class="timeline">
<a href="/"><img alt="DPB" src="http://www.gravatar.com/avatar/5544fe6a05400da5a8957ff29dd6718c.png?s=128" /></a> <a href="/"><img alt="DPB" src="http://www.gravatar.com/avatar/5544fe6a05400da5a8957ff29dd6718c.png?s=128" /></a>
@@ -49,7 +50,7 @@
<h1> <h1>
<strong><a href="/">Danny Berger</a></strong> <strong><a href="/">Danny Berger</a></strong>
</h1> </h1>
<div class="meta"> <div class="meta screen-only">
<a href="http://dpb587.me/" style="color:inherit;">dpb587</a> <a href="http://dpb587.me/" style="color:inherit;">dpb587</a>
&middot; &middot;
<a href="https://github.com/dpb587">github</a> <a href="https://github.com/dpb587">github</a>
@@ -62,5 +63,10 @@
&middot; &middot;
<a href="mailto:dpb587@gmail.com">email</a> <a href="mailto:dpb587@gmail.com">email</a>
</div> </div>
<div class="meta print-only">
<a href="http://dpb587.me/" style="color:inherit;">http://dpb587.me</a>
&nbsp;<strong style="color:#999999;">&middot;</strong>&nbsp;
<a href="mailto:dpb587@gmail.com" style="color:inherit;">dpb587@gmail.com</a>
</div>
</header> </header>
<article> <article>

3
_layouts/content.html Normal file
View File

@@ -0,0 +1,3 @@
{% include header.html %}
{{ content }}
{% include footer.html %}

View File

@@ -1,5 +1,5 @@
{% include header.html %} {% include header.html %}
<section class="layout-post"> <section>
<header> <header>
<div class="timeline"> <div class="timeline">
<time datetime="{{ page.date|date_to_xmlschema }}" title="{{ page.date|date_to_xmlschema }}"><strong>{{ page.date|date:"%b %d"|upcase }}</strong><br />{{ page.date|date:"%Y" }}</time> <time datetime="{{ page.date|date_to_xmlschema }}" title="{{ page.date|date_to_xmlschema }}"><strong>{{ page.date|date:"%b %d"|upcase }}</strong><br />{{ page.date|date:"%Y" }}</time>
@@ -10,19 +10,22 @@
<a href="{{ page.code }}"><img alt="code" height="49" src="/include/icons/code.png" title="{{ page.location.title }}" width="49" /></a> <a href="{{ page.code }}"><img alt="code" height="49" src="/include/icons/code.png" title="{{ page.location.title }}" width="49" /></a>
{% endif %} {% endif %}
</div> </div>
<div class="social"> <div class="social screen-only">
</div> </div>
<h2>{{ page.title }}</h2> <h2>
{{ page.title }}
<small class="print-only">{{ page.date|date:'%A, %B %d, %Y' }}</small>
</h2>
</header> </header>
<section> <section class="post-content">
{{ content }} {{ content }}
</section> </section>
<div class="meta meta-social"> <div class="meta meta-social screen-only">
<a href="https://twitter.com/share" class="twitter-share-button" data-via="dpb587">Tweet</a> <a href="https://twitter.com/share" class="twitter-share-button" data-via="dpb587">Tweet</a>
<div class="g-plusone" data-size="medium" data-width="300"></div> <div class="g-plusone" data-size="medium" data-width="300"></div>
</div> </div>
<div class="disqus"> <div class="disqus screen-only">
<div id="disqus_thread"></div> <div id="disqus_thread"></div>
<script type="text/javascript"> <script type="text/javascript">
var disqus_shortname = 'dpb587'; var disqus_shortname = 'dpb587';

View File

@@ -1,6 +1,6 @@
--- ---
title: About title: About
layout: default layout: content
--- ---
<section> <section>
@@ -120,7 +120,7 @@ layout: default
</small> </small>
</p> </p>
<hr color="#E9E9E9" size="1" style="margin:24px 0 18px;" /> <hr color="#E9E9E9" size="1" style="margin-bottom:10px;margin-top:14px;" />
<p> <p>
<strong>Software Systems Engineer</strong> &nbsp;&middot;&nbsp; June '06 &ndash; present<br /> <strong>Software Systems Engineer</strong> &nbsp;&middot;&nbsp; June '06 &ndash; present<br />
@@ -162,7 +162,7 @@ layout: default
</small> </small>
</p> </p>
<hr color="#E9E9E9" size="1" style="margin:24px 0 18px;" /> <hr color="#E9E9E9" size="1" style="margin-bottom:10px;margin-top:14px;" />
<p> <p>
<strong>Student System Administrator</strong> &nbsp;&middot;&nbsp; Spring '06 &ndash; Fall '08<br /> <strong>Student System Administrator</strong> &nbsp;&middot;&nbsp; Spring '06 &ndash; Fall '08<br />
@@ -186,7 +186,7 @@ layout: default
</small> </small>
</p> </p>
<hr color="#E9E9E9" size="1" style="margin:24px 0 18px;" /> <hr color="#E9E9E9" size="1" style="margin-bottom:10px;margin-top:14px;" />
<p> <p>
<strong>Network Administrator</strong> &nbsp;&middot;&nbsp; Spring '03 &ndash; Summer '07<br /> <strong>Network Administrator</strong> &nbsp;&middot;&nbsp; Spring '03 &ndash; Summer '07<br />

View File

@@ -9,7 +9,7 @@ body > header, article > section {
border-bottom: #F0F0F0 solid 1px; border-bottom: #F0F0F0 solid 1px;
border-left: #E9E9E9 solid 1px; border-left: #E9E9E9 solid 1px;
margin-bottom: 2px; margin-bottom: 2px;
padding: 24px 34px 18px 34px; padding: 24px 34px;
position: relative; position: relative;
width: 640px; width: 640px;
} }
@@ -121,6 +121,12 @@ h2 {
padding: 1px 0; padding: 1px 0;
} }
h2 small {
display: block;
font-size: 12px;
font-weight: normal;
}
h3 { h3 {
border-bottom: #DEDEDE solid 1px; border-bottom: #DEDEDE solid 1px;
color: #393939; color: #393939;
@@ -137,7 +143,7 @@ h4 {
} }
hr { hr {
margin: 0 -2px; margin: 0 -4px;
} }
article > section .timeline { article > section .timeline {
@@ -151,12 +157,12 @@ section .timeline > * {
margin-bottom: 4px; margin-bottom: 4px;
} }
section.layout-post .timeline > *, article.layout-post .timeline > *,
section:hover .timeline > * { section:hover .timeline > * {
opacity: 1; opacity: 1;
} }
section.layout-post { article.layout-post section {
padding-bottom: 12px; padding-bottom: 12px;
} }
@@ -234,13 +240,17 @@ dl dd {
padding: 27px 8px 0; padding: 27px 8px 0;
} }
section.layout-post .meta.meta-social { article.layout-post .meta.meta-social {
display: none; display: none;
} }
section.layout-post section img { section.post-content img {
background-color: #F3F3F3; background-color: #F3F3F3;
border: #D8D8D8 solid 1px; border: #D8D8D8 solid 1px;
border-radius: 1px; border-radius: 1px;
padding: 4px; padding: 4px;
} }
.print-only {
display: none;
}

61
include/site/print.css Normal file
View File

@@ -0,0 +1,61 @@
.print-only {
display: block !important;
}
body.layout-default {
margin: 0;
}
body.layout-content,
body.layout-post {
font-size: 12px;
margin: 0;
}
body > footer {
padding-bottom: 0;
}
body > header, article > section {
width: auto;
}
body > header {
margin-bottom: 0;
margin-left: 24px;
padding-bottom: 12px;
padding-top: 6px;
}
body.layout-content article > section,
body.layout-post article > section {
border-left: 0;
margin: 0 12px;
padding-left: 0;
padding-right: 0;
}
body.layout-default article > section {
margin-left: 25px;
}
body.layout-post section header .timeline {
display: none;
}
.screen-only {
display: none !important;
}
p, ul, ol, dl {
line-height: 20px;
margin: 6px 0;
}
h1 {
margin-top: 6px;
}
h3 {
margin-top: 24px;
}

View File

@@ -1,6 +1,6 @@
--- ---
title: Projects title: Projects
layout: default layout: content
--- ---
<section> <section>
@@ -11,16 +11,10 @@ layout: default
<a href="https://github.com/">GitHub</a> and these are a few of my personal favorites&hellip; <a href="https://github.com/">GitHub</a> and these are a few of my personal favorites&hellip;
</p> </p>
<h3>Personal</h3>
<p>
A few personal projects I've invested in&hellip;
</p>
<h4>PHP Diff Engine</h4> <h4>PHP Diff Engine</h4>
<p> <p>
A language-aware diff engine for comparing PHP classes/interfaces/functions. A language-aware diff engine for changes in PHP classes/interfaces/functions over time.
</p> </p>
<dl> <dl>
@@ -34,7 +28,7 @@ layout: default
<h4>CLI for OpenGrok</h4> <h4>CLI for OpenGrok</h4>
<p> <p>
Command line interface for getting results from an OpenGrok server. Command line interface (&agrave; la <code>grep</code>) for getting results from an OpenGrok server.
</p> </p>
<dl> <dl>
@@ -49,13 +43,13 @@ layout: default
<h3>Contributions</h3> <h3>Contributions</h3>
<p> <p>
I would not and could not be the developer I am today without the time others have invested in producing I would not and could not be the developer I am without the time others have invested in publishing open source
quality, open source software. For my modest part, I've been able to contribute to the following&hellip; software. For my modest part, I've been able to contribute back to&hellip;
</p> </p>
<ul> <ul>
<li><a href="https://github.com/composer/composer/commits?author=dpb587">composer/composer</a> &ndash; small enhancements and bug fixes</li> <li><a href="https://github.com/composer/composer/commits?author=dpb587">composer/composer</a> &ndash; small enhancements, bug fixes</li>
<li><a href="https://github.com/symfony/symfony/commits?author=dpb587">symfony/symfony</a> &ndash; small enhancements and bug fixes</li> <li><a href="https://github.com/symfony/symfony/commits?author=dpb587">symfony/symfony</a> &ndash; small enhancements, bug fixes</li>
<li><a href="https://github.com/doctrine/dbal/commits?author=dpb587">doctrine/dbal</a> &ndash; oracle bug fixes</li> <li><a href="https://github.com/doctrine/dbal/commits?author=dpb587">doctrine/dbal</a> &ndash; oracle bug fixes</li>
</ul> </ul>
</section> </section>