more updates to match new code, new entry for testing

This commit is contained in:
Don Harper 2018-12-19 22:11:49 +00:00
parent 46751d66ca
commit 008d2d760c
140 changed files with 17228 additions and 12 deletions

View file

@ -0,0 +1,96 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>
## Prefix the title with blog name if the title doesn't only contain the blog name.
${'{} - '.format(blog_title) if capture(self.page_title) != blog_title else ''}<%block name="page_title"></%block>
</title>
<%include file="_style.tmpl"/>
<%block name="extra_links"/>
<%include file="_scripts.tmpl"/>
<%block name="extra_scripts"/>
${extra_head_data}
${template_hooks['extra_head']()}
</head>
<body>
<div id="layout">
<%include file="_menu.tmpl"/>
<div id="main">
## This allows inheriting templates to define a def named header_image that outputs
## an URL to an image to use as the background for the title. See post.tmpl for an example.
<% header_image_url = None %>
% if hasattr(self, 'header_image'):
## Capture the output of the def and save it in a variable so it can be used multiple times easily.
<% header_image_url = capture(self.header_image).strip() %>
% endif
## If there is no header_image_url set and the page title is the same as the blog title
## then show the header image url defined in GLOBAL_CONTEXT blog_header_image variable.
## The idea here is that if the page title is your blog title, then the header image should be your blog image.
% if not header_image_url and capture(self.page_title) == blog_title:
<% header_image_url = blog_header_image %>
% endif
<div class="yp-header-container">
% if header_image_url:
<div class="yp-header-background"
style="background-image: url(${header_image_url})">
## Duplicating the title in the yp-header-background and the yp-header
## allows the background image to resize to fit the title automatically.
<div class="yp-header">
<h1 class="yp-header__title${'--overlay' if header_image_url else ''}">${self.page_title()}</h1>
<h2 class="yp-header__subtitle${'--overlay' if header_image_url else ''}"><%block name="subtitle"/></h2>
${template_hooks['page_header']()}
</div>
</div>
## Duplicating the yp-header-background with yp-header-background--blur
## allows a blurred header image while keeping straight edges of the non-blurred version
## on the border. This should not cause extra network trips because it's the same image URL
<div class="yp-header-background--blur"
style="background-image: url(${header_image_url})">
<div class="yp-header">
<h1 class="yp-header__title${'--overlay' if header_image_url else ''}">${self.page_title()}</h1>
<h2 class="yp-header__subtitle${'--overlay' if header_image_url else ''}">${self.subtitle()}</h2>
${template_hooks['page_header']()}
</div>
</div>
<div class="yp-header">
% else:
## Only place a border at the bottom of the header if there is no header image
<div class="yp-header" style="border-bottom: 1px solid #eee;">
% endif
<h1 class="yp-header__title${'--overlay' if header_image_url else ''}">
${self.page_title()}
</h1>
<h2 class="yp-header__subtitle${'--overlay' if header_image_url else ''}">
${self.subtitle()}
</h2>
${template_hooks['page_header']()}
</div>
</div>
<div class="yp-content">
${next.body()}
</div>
<%include file="_footer.tmpl"/>
</div>
</div>
${body_end}
${template_hooks['body_end']()}
</body>
</html>

View file

@ -0,0 +1,26 @@
<%doc>
Mako defs which generate formatted output or HTML components.
This can be used as a namespace in other templates.
</%doc>
<%! from uuid import uuid4 %>
<%def name="fancy_date(date_value)">
<%doc>
Show the date in plain language as relative to now. Eg "1 year ago".
This requires the moment.js library.
</%doc>
<% id_ = uuid4() %>
<span id="${id_}">
</span>
<script>
(function(){
var el = document.getElementById("${id_}");
var fromNow = moment("${date_value.isoformat()}").fromNow();
el.innerHTML = fromNow;
})();
</script>
</%def>

View file

@ -0,0 +1,6 @@
% if content_footer:
<div class="yp-footer">
${content_footer}
${template_hooks['page_footer']()}
</div>
% endif

View file

@ -0,0 +1,50 @@
<%doc>
Use for index of posts. The include_content page arg is used
to determine whether to include the post content in the listing.
</%doc>
<%page args="include_content=True"/>
<%namespace name="comp" file="/_components.tmpl" />
<div class="pure-g">
% for post in posts:
<div class="pure-u-1-5">
<div class="yp-index-meta">
<i class="fa fa-clock-o"></i>
<time datetime="${post.formatted_date('webiso')}"
class="yp-index-meta__date">
${comp.fancy_date(post.date)}
</time>
## <div class="yp-index-meta__category">
## ## TODO: figure out how to display the category
## </div>
<div class="yp-index-meta__tags">
% for tag in post.tags:
<span class="yp-index-meta__tag">${tag}</span>
% endfor
</div>
## <div class="yp-index-meta__reading-time">
## ${post.reading_time}
## </div>
</div>
</div>
<div class="pure-u-4-5">
<article class="yp-index-post">
<h2 class="yp-index-post__title">
<a href="${post.permalink()}" class="yp-index-post__link">
${post.title()}
</a>
</h2>
<h3 class="yp-index-post__subtitle">
${post.description()}
</h3>
% if include_content and not exclude_index_content:
<div class="yp-index-post__body">
${post.text(teaser_only=index_teasers)}
</div>
% endif
</article>
</div>
% endfor
</div>

View file

@ -0,0 +1,25 @@
## Menu toggle
<a href="#menu" id="menuLink" class="menu-link">
## Hamburger icon
<span></span>
</a>
<div id="menu">
<div class="pure-menu">
<a class="pure-menu-heading" href="/">${blog_title}</a>
<ul class="pure-menu-list">
## Links in sidebar are defined in conf.py as NAVIGATION_LINKS
% for url, label in navigation_links[lang]:
<li class="pure-menu-item">
<a class="pure-menu-link" href="${url}">${label}</a>
</li>
% endfor
## TODO: add social media and rss icon links
${template_hooks['menu']()}
</ul>
</div>
</div>

View file

@ -0,0 +1,13 @@
% if use_bundles:
<script src="/assets/js/bundle.js"></script>
% else:
<script src="/assets/js/jquery-2.1.4.min.js"></script>
<script src="/assets/js/jquery.ba-throttle-debounce.min.js"></script>
<script src="/assets/js/moment.js"></script>
<script defer src="/assets/js/sidebar.js"></script>
<script defer src="/assets/js/jquery.fluidbox.min.js"></script>
<script defer src="/assets/js/highlight.pack.js"></script>
## Initialization for page runs last.
<script defer src="/assets/js/init.js"></script>
% endif

View file

@ -0,0 +1,11 @@
% if use_bundles:
<link rel="stylesheet" href="/assets/css/bundle.css"/>
% else:
<link rel="stylesheet" href="/assets/css/fluidbox.min.css"/>
<link rel="stylesheet" href="/assets/css/highlight/default.css"/>
<link rel="stylesheet" href="/assets/css/font-awesome.css"/>
<link rel="stylesheet" href="/assets/css/pure.css"/>
<link rel="stylesheet" href="/assets/css/grids-responsive.css"/>
<link rel="stylesheet" href="/assets/css/side-menu.css"/>
<link rel="stylesheet" href="/assets/css/site.css"/>
% endif

View file

@ -0,0 +1,8 @@
<%doc>
Used to display archives if ARCHIVES_ARE_INDEXES is True.
</%doc>
<%inherit file="/index.tmpl"/>
<%block name="page_title">${title}</%block>

View file

@ -0,0 +1,3 @@
<%doc>
Comments are unsupported in this theme.
</%doc>

View file

@ -0,0 +1,85 @@
<%doc>
Template used for image galleries.
If ``folders`` contains items then this is a listing of galleries or is a gallery
which contains sub-galleries.
Interesting variables include:
* post: A post object, containing descriptive post.text() for the gallery.
* crumbs: A list of link, crumb to implement breadcrumbs.
* folders: A list of folders to implement hierarchical gallery navigation.
* enable_comments: To enable/disable comments in galleries.
* thumbnail_size: The THUMBNAIL_SIZE option.
* photo_array: a list of dictionaries, each containing:
* url: URL for the full-sized image.
* url_thumb: URL for the thumbnail.
* title: The title of the image.
* size: A dict containing w and h, the real size of the thumbnail.
</%doc>
<%inherit file="/_base.tmpl"/>
<%block name="page_title">
## galleries is the default title for the listing of galleries
% if title != 'galleries':
${title}
% elif folders:
Photo Galleries
% endif
</%block>
% if post:
<article class="yp-post__body">
<div>
${post.text()}
</div>
</article>
% endif
% if folders:
<article class="yp-post-group__body">
% if photo_array:
## This gallery contains sub-galleries.
<h3>Sub-Galleries:</h3>
% endif
<ul class="yp-post-list">
% for link, text in folders:
<li class="yp-post-list__item">
<h3 class="yp-post-list__title">
<a class="reference yp-post-list__link" href="${link}">${text|h}</a>
</h3>
</li>
% endfor
</ul>
</article>
% endif
<article class="yp-gallery__body">
<div class="yp-gallery__container">
% if photo_array:
% for image in photo_array:
<%
link = image['url']
title = image['title']
thumb_link = image['url_thumb']
# Add the narrow class to figures in portrait
extra_class = 'yp-gallery__figure--narrow' if image['size']['h'] > image['size']['w'] else ''
%>
<figure class="yp-gallery__figure ${extra_class}">
<a href="${link}" class="yp-gallery__link image-reference" title="${title}">
<img class="yp-gallery__image" src="${thumb_link}" alt="${title}" title="${title}"/>
</a>
</figure>
% endfor
% endif
</div>
</article>

View file

@ -0,0 +1,28 @@
<%doc>
Used for multi-post indexes.
This should (according to the Nikola docs) show the full text of each post, unless index_teasers is True.
Then it should display the text in post.text(teaser_only=True).
Local variables:
* posts - list of post instances
* date_format
Posts have relevant methods:
* permalink
* title
* formatted_date
Properties:
* tags
* reading_time
</%doc>
<%inherit file="/_base.tmpl"/>
<%block name="page_title">${blog_title}</%block>
<%include file="_index.tmpl" args="include_content=True"/>

View file

@ -0,0 +1,34 @@
<%doc>
Template used to display generic lists of links, which it gets in items, a list of (text, link, count) elements.
This is used to display groups of posts such as years or months in the archive listing. In that case the
link will go to the list_post.tmpl which displays the actual links to the posts themselves.
For example this page may contain:
* 2015
* 2014
* 2013
Clicking on one of the links will go to the list of posts for that year as displayed by list_post.tmpl.
</%doc>
<%inherit file="/_base.tmpl"/>
<%block name="page_title">${title}</%block>
<article class="yp-post-group__body">
% if items:
<ul class="yp-post-list">
% for text, link, count in items:
<li class="yp-post-list__item">
<h3 class="yp-post-list__title">
<a class="reference yp-post-list__link" href="${link}">${text|h}</a>
</h3>
</li>
% endfor
</ul>
% else:
<p>${messages("Nothing found.")}</p>
% endif
</article>

View file

@ -0,0 +1,9 @@
<%doc>
Template used to display generic lists of posts, which it gets in posts.
This is very similar to index.tmpl.
</%doc>
<%inherit file="/_base.tmpl"/>
<%block name="page_title">${title}</%block>
<%include file="_index.tmpl" args="include_content=False"/>

View file

@ -0,0 +1,9 @@
<%doc>
Used to display source code.
</%doc>
<%inherit file="/_base.tmpl"/>
<%block name="page_title">listing</%block>
This template has not yet been implemented in this theme.

View file

@ -0,0 +1,28 @@
<%doc>
Template used by default for blog posts, gets the data in a post object which is an instance of the Post class.
</%doc>
<%namespace name="comp" file="/_components.tmpl"/>
<%inherit file="/_base.tmpl"/>
<%block name="page_title">${post.title()}</%block>
<%block name="subtitle">${post.description()}</%block>
<%def name="header_image()">
## post.meta[lang]['header-image']This value is set when the post has an ".. header-image" directive
## containing the URL to the header image.
% if post.meta[lang].get('header-image'):
${post.meta[lang]['header-image']}
% elif default_header_image:
## If no header_image exists then the GLOBAL_CONTEXT is checked for default_header_image and this
## is used as the default header image. Otherwise no image is displayed.
${default_header_image}
% endif
</%def>
<div class="pure-g">
<div class="pure-u-1">
<article class="yp-post__body">
${post.text()}
</article>
</div>
</div>

View file

@ -0,0 +1 @@
## Unused in this theme.

View file

@ -0,0 +1 @@
## Unused in this theme.

View file

@ -0,0 +1,9 @@
<%doc>
Template used by the post_list reStructuredText directive.
</%doc>
<%inherit file="/_base.tmpl"/>
<%block name="page_title">post_list_directive</%block>
This template has not yet been implemented in this theme.

View file

@ -0,0 +1,36 @@
<%doc>
Implements the ``slides`` ReST directive.
</%doc>
<div class="yp-slides yp-well">
<div class="yp-gallery__container">
% for image in slides_content:
<figure class="yp-gallery__figure">
<a href="${image}" class="yp-gallery__link image-reference">
<img class="yp-gallery__image" src="${image}"/>
</a>
</figure>
% endfor
</div>
</div>
<script>
## Add the narrow class to images that are taller than they are wide.
## The slides directive does not pass the image height and width to this template.
## Unlike gallery.tmpl which does receive height and width information.
$(function(){
$('.yp-gallery__image').each(function(){
var img = this;
var $figure = $(img).closest('.yp-gallery__figure');
if(img.clientHeight > img.clientWidth){
$figure.addClass('yp-gallery__figure--narrow');
}
});
});
</script>

View file

@ -0,0 +1,6 @@
<%doc>
Used for pages that are not part of a blog, usually a cleaner,
less intrusive layout than post.tmpl, but same parameters.
</%doc>
<%inherit file="/post.tmpl"/>

View file

@ -0,0 +1,12 @@
<%doc>
Used to show the contents of a single tag or category.
</%doc>
<%inherit file="/index.tmpl"/>
<%block name="page_title">${title}</%block>
<%block name="subtitle">
% if description:
${description}
% endif
</%block>

View file

@ -0,0 +1,9 @@
<%doc>
Used to show the contents of a single tag or category if TAG_PAGES_ARE_INDEXES is True.
</%doc>
<%inherit file="/index.tmpl"/>
<%block name="page_title">${title}</%block>
## Note that sub-categories are not supported.

View file

@ -0,0 +1,58 @@
<%doc>
Used to display the list of tags and categories.
</%doc>
<%inherit file="/_base.tmpl"/>
<%block name="page_title">
${messages("Categories")}
</%block>
<article class="yp-post-group__body">
% if cat_items:
<h2>Categories</h2>
% for text, full_name, path, link, indent_levels, indent_change_before, indent_change_after in cat_hierarchy:
% for i in range(indent_change_before):
<ul class="yp-post-list">
% endfor
<li class="yp-post-list__item">
<h3 class="yp-post-list__title">
<a class="reference yp-post-list__link" href="${link}">${text}</a>
</h3>
% if indent_change_after <= 0:
</li>
% endif
% for i in range(-indent_change_after):
</ul>
% if i + 1 < len(indent_levels):
</li>
% endif
% endfor
% endfor
% endif
% if items:
<h2>Tags</h2>
<ul class="yp-post-list">
% for text, link in items:
% if text not in hidden_tags:
<li class="yp-post-list__item">
<h3 class="yp-post-list__title">
<a class="reference yp-post-list__link" href="${link}">${text|h}</a>
</h3>
</li>
% endif
% endfor
</ul>
% endif
</article>