Lanyon is an unassuming Jekyll theme that places content first by tucking away navigation in a hidden drawer. It's based on Poole, the Jekyll butler.
This is the exact same theme ported to blogc.
Lanyon for blogc is ready to use, just run blogc-make in your terminal and you are good to go.
Lanyon includes some customizable options, typically applied via classes on the <body> element.
At this time pages and links can be added to the sidebar by editing templates/main.tmpl and Makefile.
Relevant templates/main.tmpl parts:
<!-- Home link -->
<a class="sidebar-nav-item{%if MAKE_RULE == "index" %} active{% endif %}" href="{{ BASE_URL }}/">Home</a>
<!-- About link -->
<a class="sidebar-nav-item{%if MAKE_SLUG == "about" %} active{% endif %}" href="{{ BASE_URL }}/about/">About</a>
<a class="sidebar-nav-item" href="https://github.com/shiba89/lanyon-blogc/archive/master.zip">Download</a>
<a class="sidebar-nav-item" href="https://github.com/shiba89/lanyon-blogc">GitHub project</a>
<span class="sidebar-nav-item">Currently devel</span>Relevant Makefile parts:
[pages]
about
404This will hopefully change in the future.
Lanyon ships with eight optional themes based on the base16 color scheme. Apply a theme to change the color scheme (mostly applies to sidebar and links).
There are eight themes available at this time.
To use a theme, add any one of the available theme classes to the <body> element in the templates/main.tmpl template, like so:
<body class="theme-base-08">
...
</body>To create your own theme, look to the Themes section of included CSS file. Copy any existing theme (they're only a few lines of CSS), rename it, and change the provided colors.
Reverse the page orientation with a single class.
<body class="layout-reverse">
...
</body>Make the sidebar overlap the viewport content with a single class:
<body class="sidebar-overlay">
...
</body>This will keep the content stationary and slide in the sidebar over the side content. It also adds a box-shadow based outline to the toggle for contrast against backgrounds, as well as a box-shadow on the sidebar for depth.
It's also available for a reversed layout when you add both classes:
<body class="layout-reverse sidebar-overlay">
...
</body>Show an open sidebar on page load by modifying the <input> to add the checked boolean attribute:
<input type="checkbox" class="sidebar-checkbox" id="sidebar-checkbox" checked>You can also conditionally show the sidebar open on a per-page basis. For example, here's how you could have it open on the About page only:
<input type="checkbox" class="sidebar-checkbox" id="sidebar-checkbox"{% if MAKE_SLUG == "about" %} checked{% endif %}>Shiba
Mark Otto
Lanyon for blogc is open sourced under the GPL & MIT license.
<3