diff options
Diffstat (limited to 'design/templates')
| -rw-r--r-- | design/templates/base.html | 33 | ||||
| -rw-r--r-- | design/templates/blog/entry_detail.html | 62 | ||||
| -rw-r--r-- | design/templates/blog/entry_list.html | 18 | ||||
| -rw-r--r-- | design/templates/homepage.html | 88 | ||||
| -rw-r--r-- | design/templates/links/link_detail.html | 13 | ||||
| -rw-r--r-- | design/templates/links/link_list.html | 15 | ||||
| -rw-r--r-- | design/templates/pages/page.html | 12 |
7 files changed, 147 insertions, 94 deletions
diff --git a/design/templates/base.html b/design/templates/base.html index 41a8033..9be4f51 100644 --- a/design/templates/base.html +++ b/design/templates/base.html @@ -7,17 +7,16 @@ <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" - content="{% block metadescription %}Scott Gilbertson is a Technical Writer, Copywriter and Editor helping your company increase its online content to boost your traffic and attract new leads. {% endblock %}"> + content="{% block metadescription %}{% endblock %}"> <meta name="author" content="Scott Gilbertson"> <link rel="alternate" type="application/rss+xml" title="RSS feed" - href="/rss/"> + href="/rss"> {%block stylesheet%}<link rel="stylesheet" href="/media/screenv1.css?{% now "u" %}" media="screen">{%endblock%} <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> - <!--<link rel="manifest" href="/manifest.webmanifest" /> --> {%block extrahead%}{%endblock%} </head> <body {%block bodyid%}{%endblock%}{%block bodyevents%}{%endblock%}> @@ -26,30 +25,30 @@ <header class="site-banner"> <div id="logo"> <a href="/" title="Home">Libregraf</a> - <span class="tagline">Let's Tell Your Story</span> + <span class="tagline">Free Software & nerdery</span> </div> - <nav> + <nav class="nav-menu"> <ul> - <li><a href="/hire-me" title="">Hire Me</a></li> - <li><a href="/about" title="">About Scott</a></li> - <!--<li><a href="/portfolio" title="">Portfolio</a></li> - <li><a href="/praise" title="">Praise</a></li> - <li><a href="/contact" title="">Contact</a></li> - <li><a href="/blog/" title="">Blog</a></li>--> + <li><a href="/essays/" title="Previous articles">Archive</a></li> + <li><a href="/linked/" title="Thoughts on Free, open source and Libre software news">Links</a></li> + <li><a href="/about" title="About this site and the tools I use to make it">About</a></li> + <li><a href="/contact" title="How to get in touch regarding Libregraf">Contact</a></li> </ul> </nav> </header> </div> {% block content %}{% endblock %} {% block extrabody %}{% endblock %} - <footer class="bl"> - <p id="license"> + <footer> + <ul class="nav-menu footer-nav-menu"> + <li><a href="/contact" title="How to get in touch regarding Libregraf">Contact</a></li> + <li><a href="/rss" title="RSS feed">RSS</a></li> + <li><a href="" title="Libregraf on twitter">Twitter</a></li> + </ul> + <p class="hed-tertiary"> © {% now "Y" %} - <span class="h-card"><a class="p-name u-url" href="https://luxagraf.net/">Scott Gilbertson</a><data class="p-nickname" value="luxagraf"></data><data class="p-locality" value="Athens"></data><data class="p-region" value="Georgia"></data><data class="p-country-name" value="United States"></data></span>. + <span class="h-card"><a class="p-name u-url" href="https://libregraf.net/">Scott Gilbertson</a><data class="p-nickname" value="libregraf"></data><data class="p-locality" value="Athens"></data><data class="p-region" value="Georgia"></data><data class="p-country-name" value="United States"></data></span>. </p> - <ul class="footer-nav"> - <li><a href="/contact" title="contact luxagraf">Contact</a></li> - </ul> </footer> </div> {% block js %}{% endblock%} diff --git a/design/templates/blog/entry_detail.html b/design/templates/blog/entry_detail.html new file mode 100644 index 0000000..ad4eda8 --- /dev/null +++ b/design/templates/blog/entry_detail.html @@ -0,0 +1,62 @@ +{% extends 'base.html' %} +{% load typogrify_tags %} +{%block bodyid%}id="essay-archive" class="archive"{%endblock%} + +{% block content %} +<div class="content-narrow"> + <article class="h-entry hentry entry-content content" itemscope itemType="http://schema.org/BlogPosting"> + <header id="header" class="post-header"> + <h1 class="p-name hed-primary" itemprop="headline">{{object.title|smartypants|safe}}</h1> + {% if object.sub_title %}<h2 class="p-summary hed-secondary">{{object.sub_title|smartypants|safe}}</h2>{%endif%} + <div class="post-linewrapper"> + <h5 class="hed-tertiary">Filed Under: {% for tag in object.tags.all %}<a href="/essays/tags/{{tag.slug}}" title="View all essays about {{tag}}">{{tag}}</a>{%if forloop.last%}{%else%}, {%endif%}{% endfor %}</h5> + <time class="dt-published published dt-updated hed-tertiary" datetime="{{object.pub_date|date:'c'}}" itemprop="datePublished">{{object.pub_date|date:"F"}} <span>{{object.pub_date|date:"j, Y"}}</span></time> + <span class="hide" itemprop="author" itemscope itemtype="http://schema.org/Person">by <a class="p-author h-card" href="/about"><span itemprop="name">Scott Gilbertson</span></a></span> + </div> + </header> + <div id="article" class="e-content entry-content" itemprop="articleBody"> + {{object.body_html|safe|smartypants}} + </div> + </article> + {% with object.get_next_published as next %} + {% with object.get_previous_published as prev %} + <div class="nav-wrapper"> + <nav id="page-navigation" {%if wildlife or object.field_notes.all or object.books.all %}{%else%}class="page-border-top"{%endif%}> + <ul>{% if prev%} + <li id="prev"><span class="bl">Previous:</span> + <a href="{{ prev.get_absolute_url }}" rel="prev" title=" {{prev.title}}">{{prev.title|safe}}</a> + </li>{%endif%}{% if next%} + <li id="next"><span class="bl">Next:</span> + <a href="{{ next.get_absolute_url }}" rel="next" title=" {{next.title}}">{{next.title|safe}}</a> + </li>{%endif%} + </ul> + </nav>{%endwith%}{%endwith%} + </div> + {% if object.related.all %}<div class="article-afterward related"> + <h6 class="hedtinycaps">You might also enjoy</h6> + <ul class="article-card-list">{% for object in related %} + <li class="article-card-mini"><a href="{{object.get_absolute_url}}" title="{{object.title}}"> + <div class="post-image post-mini-image"> + {% if object.featured_image %} + {% include "lib/img_archive.html" with image=object.featured_image nolightbox=True %} + {% elif object.image %} + {% include "lib/img_archive.html" with image=object.image nolightbox=True %} + {% else %} + <img src="{{object.get_image_url}}" alt="{{ object.title }}" class="u-photo post-image" itemprop="image" />{%endif%} + </div> + <h4 class="p-name entry-title post-title" itemprop="headline">{% if object.title %}{{object.title|safe|smartypants|widont}}{% else %}{{object.common_name}}{%endif%}</h4> + {% if object.subtitle%}<h5 class="post-subtitle">{{object.subtitle|safe|smartypants}}</h5>{%endif%} + <p class="p-author author hide" itemprop="author"><span class="byline-author" itemscope itemtype="http://schema.org/Person"><span itemprop="name">Scott Gilbertson</span></span></p> + <p class="post-summary"> + <span class="p-location h-adr adr post-location" itemprop="contentLocation" itemscope itemtype="http://schema.org/Place"> + {% if object.location.country_name == "United States" %}{{object.location.state_name}}{%else%}{{object.location.country_name}}{%endif%} + </span> + – + <time class="dt-published published dt-updated post-date" datetime="{{object.pub_date|date:'c'}}"><span>{{object.pub_date|date:" Y"}}</span></time> + </p> + </a> + </li> + {% endfor %}</ul> + </div>{%endif%} +</div> +{% endblock %} diff --git a/design/templates/blog/entry_list.html b/design/templates/blog/entry_list.html new file mode 100644 index 0000000..0931ac4 --- /dev/null +++ b/design/templates/blog/entry_list.html @@ -0,0 +1,18 @@ +{% extends 'base.html' %} +{% load typogrify_tags %} +{%block bodyid%}id="essay-archive" class="archive"{%endblock%} + +{% block content %} + <main role="main" id="essay-archive" class="essay-archive archive-list"> + <h1 class="topic-hed">Essays</h1> + <ul>{% for object in object_list %} + <li class="h-entry hentry" itemscope itemType="http://schema.org/Article"> + <span class="date dt-published hed-tertiary">{{object.pub_date|date:"F Y"}}</span> + <a class="u-url" href="{{object.get_absolute_url}}"> + <h2 class="p-name hed-primary">{{object.title|safe|smartypants|widont}}</h2> + <p class="p-summary hed-secondary">{% if object.sub_title %}{{object.sub_title|safe|smartypants}}{%else%}{{object.metadescription}}{%endif%}</p> + </a> + </li> + {%endfor%}</ul> + </main> +{% endblock %} diff --git a/design/templates/homepage.html b/design/templates/homepage.html index ed47bdb..ca8d3b5 100644 --- a/design/templates/homepage.html +++ b/design/templates/homepage.html @@ -2,87 +2,21 @@ {% load typogrify_tags %} {% block sitename %} <head itemscope itemtype="http://schema.org/WebSite"> - <title itemprop='name'>Everyone has a story - I'll help you tell yours</title> + <title itemprop='name'>Libregraf: Free software, open source, and web nerdery</title> <link rel="canonical" href="https://libregraf.net/" itemprop="url" /> {% endblock %} -{%block bodyid%}id="home" class="home"{%endblock%} - +{%block bodyid%}id="home" class="archive home"{%endblock%} {% block content %} -<div class="content-wrapper hero-wrapper"> - <div class="content hero"> - <div class="hero-pic"> - <img src="/media/bio.jpg" class="circle-pic" alt="Scott Gilbertson" /> - </div> - <div class="hero-text"> - <h1 class="hed-alpha">Need Content That Converts?</h1> - <h2 class="hed-beta">Let's find the weak spots in your content and strengthen them.</h2> - <h2 class="hed-beta">I'll create the content you need to amp up your traffic, leads and sales.</h2> - <h3 class="hed-alpha">My writing attracts, engages and converts.</h3> - <p>Whether you’re an entrepreneur, small business, or large company, my custom tailored content can catapult your online visibility and give you the traffic boost you need to attract new leads.</p> - <p><a href="/hire-me" class="btn btn-hollow">Let's Get Started</a></p> - </div> - </div> -</div> -<div class="content-wrapper"> - <div class="content"> - <h4 class="hed-gamma hed-border">How Can I Help You?</h4> - <p class="narrow">Since the dawn of the Internet I've been helping people discover the power of stories. Stories pull customers in, stories drive traffic. You don't need “marketing,” you need good stories. Here's a few ways I can help tell your story.</p> - <div class="home-card-wrapper"> - <div class="flex"> - <div class="card card-tiny"> - <div class="card-image"> - <img src="/media/img/typing.jpg" alt="hands typing code on laptop" /> - </div> - <h5 class="hed-delta">Technical Writing</h5> - <p>My specialty is making the technical easy to understand. I've used my expertise as a developer to write documentation, tutorials, and white papers. I’ve helped companies like Opera Software, Postmarkapp, Sifter tell their story to developers and users. Lets tell your story.</p> - </div> - <div class="card card-tiny"> - <div class="card-image"> - <img src="/media/img/content.jpg" alt="hands typing code on laptop" /> - </div> - <h5 class="hed-delta">Content Marketing</h5> - <p>Content marketing is marketing-speak for telling stories that captivate your audience. Whether you already have a blog or are starting from scratch, I can help refine your strategies and create content focused on achieving measurable results.</p> - </div> - <div class="card card-tiny"> - <div class="card-image"> - <img src="/media/img/pen.jpg" alt="pen editing papers" /> - </div> - <h5 class="hed-delta">Copywriting & Copy editing</h5> - <p>Maybe you've already written your story, but could use a hand polishing it up. Whether you need some need some fine tuning of what you already have, or need some help organizing and streamlining your story, I can help.</p> - </div> - </div> - <a href="/hire-me" class="btn btn-hollow btn-link">Hire Me!</a> - <a href="https://google.com/" class="btn btn-hollow btn-link">Go Cheap</a> - </div> - </div> -</div> -<div class="content-wrapper"> - <h6 class="hed-gamma hed-border">Companies I've helped</h6> - <div class="border-wrapper"> - <ul class="list-inline home-logos"> - <li><a href="https://wired.com/" title="Wired.com"><img src="/media/img/wired.png" alt="Wired logo" /></a></li> - <li><a href="https://opera.com/" title="Opera.com"><img src="/media/img/opera.png" alt="Opera Web Browser logo" /></a></li> - <li><a href="https://arstechnica.com/" title="ArsTechnica.com"><img src="/media/img/ars.png" alt="Ars logo" /></a></li> - <li><a href="https://sifterapp.com/" title="Sifter.com"><img src="/media/img/sifter.png" alt="Sifter logo" /></a></li> - <li><a href="https://www.boostmobile.com/" title="boostmobile"><img src="/media/img/boost.png" alt="Boost Mobile logo" /></a></li> - <li><a href="https://webmonkey.com/" title="Webmonkey.com"><img src="/media/img/webmonkey.jpg" alt="Webmonkey logo" /></a></li> - <!--<li><a href="" title=""><img src="/media/img/budgettravel.jpg" alt="Budget Travel logo" /></li>--> - <li><a href="https://postmarkapp.com/" title="Postmark"><img src="/media/img/postmark.png" alt="Postmarkapp logo" /></a></li> - <li><a href="https://theregister.co.uk/" title="The register"><img src="/media/img/register.png" alt="Register logo" /></a></li> - </ul> - </div> -</div> - -<div class="content-wrapper"> - <div class="content"> - <div class="home-border-wrapper"> - <h6 class="hed-gamma hed-border">What Clients Say</h6> - </div> - </div> +<div class="content-narrow"> +{% for obj in object_list %} +<article class="h-entry hentry" itemscope itemType="http://schema.org/Article"> + <span class="date dt-published hed-tertiary">{{obj.pub_date|date:"F d, Y"}}</span> + <h3 class="p-name hed-primary"><a class="u-repost-of" href="{{obj.link_url}}" title="Read the original story">{{obj.title|safe|smartypants|widont}}</a> <a class="hed-star u-url" href="{{obj.get_absolute_url}}">★</a></h3> + <div class="p-summary">{{obj.body_html|safe|smartypants}}</div> +</article> +{% if forloop.last %}{%else%}<hr />{%endif%} +{% endfor %} </div> {% endblock %} - -#### Copywriting & Copy editing -Whether you need some writing done from scratch or just need some fine tuning of what you already have, I can help. diff --git a/design/templates/links/link_detail.html b/design/templates/links/link_detail.html new file mode 100644 index 0000000..500dfcb --- /dev/null +++ b/design/templates/links/link_detail.html @@ -0,0 +1,13 @@ +{% extends 'base.html' %} +{% load typogrify_tags %} +{%block bodyid%}id="essay-archive" class="archive"{%endblock%} + +{% block content %} +<div class="content-narrow"> +<article class="h-entry hentry" itemscope itemType="http://schema.org/Article"> + <span class="date dt-published blok">{{object.pub_date|date:"F d, Y"}}</span> + <h3 class="hed-primary"><a class="u-url" href="{{object.link_url}}" title="Read the original story">{{object.title|safe|smartypants|widont}}</a></h3> + <div class="p-summary">{{object.body_html|safe|smartypants}}</div> +</article> +</div> +{% endblock %} diff --git a/design/templates/links/link_list.html b/design/templates/links/link_list.html new file mode 100644 index 0000000..f38771a --- /dev/null +++ b/design/templates/links/link_list.html @@ -0,0 +1,15 @@ +{% extends 'base.html' %} +{% load typogrify_tags %} +{%block bodyid%}id="essay-archive" class="archive"{%endblock%} + +{% block content %} +<div class="content-narrow"> +{% for obj in object_list %} +<article class="h-entry hentry" itemscope itemType="http://schema.org/Article"> + <span class="date dt-published blok">{{obj.pub_date|date:"F d, Y"}}</span> + <h3 class="p-name hed-primary"><a class="u-repost-of" href="{{obj.link_url}}" title="Read the original story">{{obj.title|safe|smartypants|widont}}</a> <a class="star u-url" href="{{obj.get_absolute_url}}">★</a></h3> + <div class="p-summary">{{obj.body_html|safe|smartypants}}</div> +</article> +{% endfor %} +</div> +{% endblock %} diff --git a/design/templates/pages/page.html b/design/templates/pages/page.html new file mode 100644 index 0000000..095ccd1 --- /dev/null +++ b/design/templates/pages/page.html @@ -0,0 +1,12 @@ +{% extends 'base.html' %} +{% load typogrify_tags %} +{%block bodyid%}id="page" class="detail"{%endblock%} + +{% block content %} +<div class="content-narrow"> +<article class="h-entry hentry" itemscope itemType="http://schema.org/Article"> + <h3 class="hed-primary">{{object.title|safe|smartypants|widont}}</h3> + <div class="e-content">{{object.body_html|safe|smartypants}}</div> +</article> +</div> +{% endblock %} |