Start work on CV

content/cv/_index.md

@@ -0,0 +1,139 @@
++++
+title = "Curriculum Vitae"
+sort_by = "date"
+template = "cv.html"
+page_template = "cv-page.html"
++++
+
+# Education
+
+Bachelor of Science—**Network and Communication Management**, *DeVry University
+of Kansas City*
+
+Graduated *Suma Cum Laude*, October, 2008
+
+Awards and Scholarships:
+
+* DeVry University Dean's Scholarship
+* DeVry University Presidential Scholarship Alternate
+* ARRL Irving W. Cook, WA0̸CGS Scholarship
+
+
+# Skills
+
+<div class="row">
+<div class="col">
+
+## Programming Languages
+
+* Python
+* Bash/POSIX Shell
+* Groovy
+* Rust
+* JavaScript/Typescript
+* Lua
+* Awk
+* C
+* C♯
+* C++
+* Java
+* PHP
+
+</div>
+
+<div class="col">
+
+## Frameworks, & Libraries
+
+* Python: [asyncio]
+* Python: [FastAPI]
+* Python: [SQLAlchemy]+[Alembic]
+* Python: [pyudev]
+* Python: [dbus-python]/[dbussy]
+* Python: [Celery]
+* Python: [python-ldap]/[bonsai]
+* Python: [WebOb]
+* Python: [Django]
+* [Cython]
+* JavaScript: [Vue.js]+[Vuetify]
+* JavaScript: [MooTools]
+* JavaScript: [jQuery]
+* Rust: [Tokio]
+* Rust: [Rocket]
+* C♯: PowerShell
+
+</div>
+</div>
+
+<div class="row">
+<div class="col">
+
+## Applications & Software Stacks
+
+* Elasticsearch
+* Grafana
+* Graphite
+* Graylog
+* Jenkins
+* PostgreSQL
+* Prometheus/Victoria Metrics
+* RabbitMQ
+* Redis
+* Zabbix
+
+</div>
+<div>
+
+## Systems & Network Infrastructure
+
+* Active Directory Domain Services
+* Ansible
+* dnsmasq
+* `iptables`
+* ISC BIND
+* ISC DHCPD
+* libvirt/QEMU+KVM, `virt-manager`/`virt-install`
+* `nftables`
+* radvd
+* strongSwan
+* VMware vSphere
+
+</div>
+</div>
+
+## Cloud & PaaS/IaaS
+
+* Amazon Web Services
+  * <abbr title="Identity &amp; Access Management">IAM</abbr> Roles, Policies
+  * <abbr title="Elastic Compute Cloud">EC2</abbr> Instances
+  * <abbr title="Elastic Block Store">EBS</abbr> Volumes, Snapshots
+  * Amazon Machine Images
+  * Elastic File System
+  * Virtual Private Cloud
+* Microsoft Azure
+  * Resource Groups
+  * Virtual Machines
+  * Virtual Machine Images
+  * Image Galleries
+  * Virtual Networks
+
+
+[asyncio]: https://docs.python.org/3/library/asyncio.html
+[fastapi]: https://fastapi.tiangolo.com/
+[sqlalchemy]: https://www.sqlalchemy.org/
+[Alembic]: https://alembic.sqlalchemy.org/
+[pyudev]: https://pyudev.readthedocs.io/en/latest/
+[dbus-python]: https://dbus.freedesktop.org/doc/dbus-python/
+[dbussy]: https://github.com/ldo/dbussy/
+[Celery]: https://docs.celeryproject.org/
+[python-ldap]: https://www.python-ldap.org/
+[bonsai]: https://bonsai.readthedocs.io/
+[WebOb]: https://webob.org/
+[Django]: https://www.djangoproject.com/
+[Cython]: https://cython.org/
+[Vue.js]: https://vuejs.org/
+[Vuetify]: https://vuetifyjs.com/
+[MooTools]: https://mootools.net/
+[jQuery]: https://jquery.com/
+[Rocket]: https://rocket.rs/
+[Tokio]: https://tokio.rs/

sass/style.scss

@@ -1,7 +1,18 @@
-$dch-color: #09192f;
+$primary-color: #505050;
+$primary-color-dark: #282828;
+$primary-color-light: #7c7c7c;
+
+$secondary-color: #333f58;
+$secondary-color-light: #5e6a85;
+$secondary-color-dark: #09192f;
+
+$background-color: #121212;
+$text-color: #ffffff;
+$panel-color: $primary-color-dark;
+$toolbar-color: $primary-color;
 
 @font-face {
-  font-family: 'DejaVu Sans';
+  font-family: "DejaVu Sans";
   font-weight: 100;
   src: url("fonts/dejavusans-extralight.woff") format("woff");
 }
@@ -10,8 +21,8 @@ $dch-color: #09192f;
 
 html,
 body {
-  background-color: #121212;
+  background-color: $background-color;
-  color: #ffffff;
+  color: $text-color;
   box-sizing: border-box;
 }
 
@@ -23,16 +34,17 @@ body {
   display: flex;
   flex-direction: column;
   min-height: 100vh;
-  font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif
+  font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande",
+    "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
 }
 
 body.index {
-  background-color: $dch-color;
+  background-color: $secondary-color-dark;
 }
 
 a:link,
 a:visited {
-  color: #ffffff;
+  color: $text-color;
 }
 
 h1,
@@ -41,7 +53,11 @@ h3,
 h4,
 h5,
 h6 {
-  color: #ffffff;
+  color: $text-color;
+}
+
+code {
+  background-color: #191919;
 }
 
 /* Header */
@@ -54,7 +70,7 @@ h6 {
 }
 
 header.page-header {
-  background-color: #09192f;
+  background-color: $secondary-color-dark;
   box-shadow: 2px 2px 8px 0 #000000;
   z-index: 100;
   position: -webkit-sticky;
@@ -62,12 +78,8 @@ header.page-header {
   top: 0;
 }
 
-svg#dustin-logo {
-  margin-bottom: -35px;
-}
-
 svg#dustin-logo path {
-  fill: #ffffff;
+  fill: $text-color;
 }
 
 nav.main-nav ul {
@@ -99,9 +111,31 @@ nav.main-nav a:hover {
 }
 
 nav.main-nav li:hover {
-  background-color: #333f58;
+  background-color: $secondary-color-light;
 }
 
+.panel {
+  background-color: $panel-color;
+}
+
+@media screen {
+  .panel {
+    box-shadow: 2px 2px 8px 0 #000000;
+  }
+
+}
+
+@media print {
+  header.page-header {
+    display: none;
+  }
+
+  body {
+    font-size: 10pt;
+  }
+}
+
+
 /* Body */
 
 main.main-content {
@@ -115,7 +149,7 @@ main.main-content {
 main.main-content div.main-content {
   margin: 0 auto;
   width: 100%;
-  max-width: 10in;
+  max-width: 12in;
   padding: 0 1em;
 }
 
@@ -132,7 +166,7 @@ main.main-content div.main-content {
   font-weight: lighter;
   text-align: center;
   margin-bottom: 0;
-  font-family: 'DejaVu Sans';
+  font-family: "DejaVu Sans";
 }
 
 .home ul.my-attributes {
@@ -178,17 +212,15 @@ main.main-content div.main-content {
 }
 
 .recent-posts a.post-summary:hover {
-  color: #ffffff;
+  color: $text-color;
 }
 
 .post-date {
   font-size: 10pt;
 }
 
-.post {
+.post.panel {
-  background-color: #282828;
   padding: 1rem;
-  box-shadow: 1px 1px 8px 0 #000000;
 }
 
 article.post .post-title {
@@ -200,8 +232,113 @@ article.post .post-date {
 }
 
 .post pre {
-  margin: 0 .25em;
+  margin: 0 0.25em;
-  padding: .25em .5em;
+  padding: 0.25em 0.5em;
+  overflow: auto;
+}
+
+/* CV */
+
+.cv.panel {
+  padding: 0 1rem 1rem;
+}
+
+.cv .content ul {
+  list-style-type: '➢ ';
+}
+
+.cv .content ul ul {
+  list-style-type: '‣ ';
+}
+
+@media (min-width: 10in) {
+.row {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+.row .col {
+  flex: 0 0 50%;
+}
+}
+
+.cv nav.cv-nav {
+  background-color: $toolbar-color;
+  padding-top: .5em;
+  margin: 0 -1em;
+}
+
+.cv nav.cv-nav ul {
+  list-style-type: none;
+}
+
+nav.cv-nav ul {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+@media only screen and (min-width: 900px) {
+  nav.cv-nav {
+    display: flex;
+    justify-content: space-around;
+  }
+
+  nav.cv-nav ul {
+    display: flex;
+  }
+}
+
+nav.cv-nav li {
+  text-transform: uppercase;
+  font-size: smaller;
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  border-bottom: 3px solid transparent;
+}
+
+nav.cv-nav li:last-child {
+  border-right: none;
+}
+
+nav.cv-nav li a {
+  display: block;
+  padding: 1em;
+  color: rgba($text-color, .66);
+}
+
+nav.cv-nav a:link,
+nav.cv-nav a:visited,
+nav.cv-nav a:active,
+nav.cv-nav a:hover {
+  text-decoration: none;
+}
+
+nav.cv-nav li:hover {
+  background-color: $primary-color-light;
+}
+
+nav.cv-nav li.active {
+  color: $text-color;
+  border-bottom: 3px solid $text-color;
+}
+
+nav.cv-nav li.active a:link,
+nav.cv-nav li.active a:visited,
+nav.cv-nav li.active a:active,
+nav.cv-nav li.active a:hover {
+  color: $text-color;
+}
+
+@media print {
+  nav.cv-nav {
+    display: none;
+  }
+}
+
+a.continue-reading {
+  font-size: .75rem;
 }
 
 /* Footer */

templates/base.html

@@ -31,6 +31,7 @@
         <ul>
           <li><a href="{{ config.base_url }}">Home</a></li
           ><li><a href="{{ get_url(path='/blog') }}">Blog</a></li
+          ><li><a href="{{ get_url(path='/cv') }}">CV</a><li
           >
         </ul>
       </nav>

templates/blog-page.html

@@ -1,7 +1,7 @@
 {% extends "base.html" %}
 
 {% block content %}
-<article class="post">
+<article class="post panel">
 <h1 class="post-title">{{ page.title }}</h1>
 <div class="post-date">
 <time datetime="{{ page.date }}">{{ page.date | date(format="%A %d %B %Y %H:%M %Z") }}</time>

templates/cv-nav.html

@@ -0,0 +1,7 @@
+<nav class="cv-nav">
+<ul class="cv-nav">
+{% for p in section.pages %}
+  <li {% if page is defined and p.slug == page.slug %}class="active"{% endif %}><a href="{{ p.permalink | safe }}">{{ p.title }}</a></li>
+{% endfor %}
+</ul>
+</nav>

templates/cv-page.html

@@ -0,0 +1,12 @@
+{% extends "base.html" %}
+{% block content %}
+{% set section = get_section(path="cv/_index.md") %}
+<div class="cv panel">
+{% include "cv-nav.html" %}
+<h1>
+  {{ page.title }} {% if page.extra.years is defined %}({{ page.extra.years}}){%
+  endif %}
+</h1>
+{{ page.content | safe }}
+</div>
+{% endblock %}

templates/cv.html

@@ -0,0 +1,24 @@
+{% extends "base.html" %}
+{% block content %}
+<div class="cv panel">
+{% include "cv-nav.html" %}
+<div class="content">
+{{ section.content | safe }}
+{% if section.pages -%}
+<h1>Career</h1>
+{% for p in section.pages %}
+<h2>
+  <a href="{{ p.permalink }}"
+    >{{ p.title }}{% if p.extra.years is defined %} ({{ p.extra.years}}){% endif
+    %}</a
+  >
+</h2>
+{% if p.summary %}
+{{ p.summary | safe }}
+<a class="continue-reading" href="{{ p.permalink }}#continue-reading">Continue Reading…</a>
+{% endif %}
+{% endfor %}
+{% endif -%}
+</div>
+</div>
+{% endblock -%}