Customize the theme layout, CSS, fonts and JavaScript.
This commit is contained in:
Ben Sturmfels
parent
b23276291f
commit
ab49894281
8 changed files with 360 additions and 58 deletions
|
|
@ -1,63 +1,141 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="{% block html_lang %}{{ DEFAULT_LANG }}{% endblock html_lang %}">
|
||||
<head>
|
||||
<head>
|
||||
{% block head %}
|
||||
<title>{% block title %}{{ SITENAME }}{% endblock title %}</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="generator" content="Pelican" />
|
||||
{% if FEED_ALL_ATOM %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_ATOM_URL %}{{ FEED_ALL_ATOM_URL }}{% else %}{{ FEED_ALL_ATOM }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Full Atom Feed" />
|
||||
{% endif %}
|
||||
{% if FEED_ALL_RSS %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_RSS_URL %}{{ FEED_ALL_RSS_URL }}{% else %}{{ FEED_ALL_RSS }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Full RSS Feed" />
|
||||
{% endif %}
|
||||
{% if FEED_ATOM %}
|
||||
<link href="{{ FEED_DOMAIN }}/{%if FEED_ATOM_URL %}{{ FEED_ATOM_URL }}{% else %}{{ FEED_ATOM }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Atom Feed" />
|
||||
{% endif %}
|
||||
{% if FEED_RSS %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if FEED_RSS_URL %}{{ FEED_RSS_URL }}{% else %}{{ FEED_RSS }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} RSS Feed" />
|
||||
{% endif %}
|
||||
{% if CATEGORY_FEED_ATOM and category %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if CATEGORY_FEED_ATOM_URL %}{{ CATEGORY_FEED_ATOM_URL.format(slug=category.slug) }}{% else %}{{ CATEGORY_FEED_ATOM.format(slug=category.slug) }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Categories Atom Feed" />
|
||||
{% endif %}
|
||||
{% if CATEGORY_FEED_RSS and category %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if CATEGORY_FEED_RSS_URL %}{{ CATEGORY_FEED_RSS_URL.format(slug=category.slug) }}{% else %}{{ CATEGORY_FEED_RSS.format(slug=category.slug) }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Categories RSS Feed" />
|
||||
{% endif %}
|
||||
{% if TAG_FEED_ATOM and tag %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if TAG_FEED_ATOM_URL %}{{ TAG_FEED_ATOM_URL.format(slug=tag.slug) }}{% else %}{{ TAG_FEED_ATOM.format(slug=tag.slug) }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Tags Atom Feed" />
|
||||
{% endif %}
|
||||
{% if TAG_FEED_RSS and tag %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if TAG_FEED_RSS_URL %}{{ TAG_FEED_RSS_URL.format(slug=tag.slug) }}{% else %}{{ TAG_FEED_RSS.format(slug=tag.slug) }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Tags RSS Feed" />
|
||||
{% endif %}
|
||||
<title>{% block title %}{{ SITENAME }}{% endblock title %}</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="generator" content="Pelican" />
|
||||
{% if FEED_ALL_ATOM %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_ATOM_URL %}{{ FEED_ALL_ATOM_URL }}{% else %}{{ FEED_ALL_ATOM }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Full Atom Feed" />
|
||||
{% endif %}
|
||||
{% if FEED_ALL_RSS %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_RSS_URL %}{{ FEED_ALL_RSS_URL }}{% else %}{{ FEED_ALL_RSS }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Full RSS Feed" />
|
||||
{% endif %}
|
||||
{% if FEED_ATOM %}
|
||||
<link href="{{ FEED_DOMAIN }}/{%if FEED_ATOM_URL %}{{ FEED_ATOM_URL }}{% else %}{{ FEED_ATOM }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Atom Feed" />
|
||||
{% endif %}
|
||||
{% if FEED_RSS %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if FEED_RSS_URL %}{{ FEED_RSS_URL }}{% else %}{{ FEED_RSS }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} RSS Feed" />
|
||||
{% endif %}
|
||||
{% if CATEGORY_FEED_ATOM and category %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if CATEGORY_FEED_ATOM_URL %}{{ CATEGORY_FEED_ATOM_URL.format(slug=category.slug) }}{% else %}{{ CATEGORY_FEED_ATOM.format(slug=category.slug) }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Categories Atom Feed" />
|
||||
{% endif %}
|
||||
{% if CATEGORY_FEED_RSS and category %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if CATEGORY_FEED_RSS_URL %}{{ CATEGORY_FEED_RSS_URL.format(slug=category.slug) }}{% else %}{{ CATEGORY_FEED_RSS.format(slug=category.slug) }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Categories RSS Feed" />
|
||||
{% endif %}
|
||||
{% if TAG_FEED_ATOM and tag %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if TAG_FEED_ATOM_URL %}{{ TAG_FEED_ATOM_URL.format(slug=tag.slug) }}{% else %}{{ TAG_FEED_ATOM.format(slug=tag.slug) }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Tags Atom Feed" />
|
||||
{% endif %}
|
||||
{% if TAG_FEED_RSS and tag %}
|
||||
<link href="{{ FEED_DOMAIN }}/{% if TAG_FEED_RSS_URL %}{{ TAG_FEED_RSS_URL.format(slug=tag.slug) }}{% else %}{{ TAG_FEED_RSS.format(slug=tag.slug) }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Tags RSS Feed" />
|
||||
{% endif %}
|
||||
<link rel="stylesheet" href="https://unpkg.com/tachyons/css/tachyons.min.css">
|
||||
<style>
|
||||
:root {
|
||||
--washed-purple: #fbf7fc;
|
||||
--purple: #3b1c4a;
|
||||
}
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Jost';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-display: swap;
|
||||
src: url({{ SITEURL }}/{{ THEME_STATIC_DIR }}/fonts/Jost-Regular.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Jost';
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-display: swap;
|
||||
src: url({{ SITEURL }}/{{ THEME_STATIC_DIR }}/fonts/Jost-SemiBold.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
body {
|
||||
font-family: 'Jost', sans-serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
strong { font-weight: 600; }
|
||||
.grow {
|
||||
transition: transform 0.25s ease-out;
|
||||
}
|
||||
header {
|
||||
color: var(--purple);
|
||||
background-color: var(--washed-purple);
|
||||
}
|
||||
header a {
|
||||
color: var(--purple);
|
||||
text-decoration: none;
|
||||
}
|
||||
header a.active {
|
||||
text-decoration: underline;
|
||||
}
|
||||
</style>
|
||||
{% endblock head %}
|
||||
</head>
|
||||
</head>
|
||||
|
||||
<body id="index" class="home">
|
||||
<header id="banner" class="body">
|
||||
<h1><a href="{{ SITEURL }}/">{{ SITENAME }}{% if SITESUBTITLE %} <strong>{{ SITESUBTITLE }}</strong>{% endif %}</a></h1>
|
||||
</header><!-- /#banner -->
|
||||
<nav id="menu"><ul>
|
||||
{% for title, link in MENUITEMS %}
|
||||
<li><a href="{{ link }}">{{ title }}</a></li>
|
||||
{% endfor %}
|
||||
{% if DISPLAY_PAGES_ON_MENU %}
|
||||
{% for p in pages %}
|
||||
<li{% if p == page %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ p.url }}">{{ p.title }}</a></li>
|
||||
{% endfor %}
|
||||
<body id="index" class="bg-white">
|
||||
<header id="banner" class="ph3 ph4-ns pt3 pb3" style="overflow: auto;">
|
||||
<div class="flex flex-wrap">
|
||||
{% if output_file != 'index.html' %}
|
||||
<div class="b code f3" style="flex-grow: 1;"><a class="dib pv2" href="/">> copyleft-next</a></div>
|
||||
{% endif %}
|
||||
<nav id="menu" class="flex flex-wrap items-center justify-start justify-end-ns" style="flex-grow: 1;">
|
||||
<ul class="list pa0 ma0 mt2 mt0-ns">
|
||||
{% for title, link in MENUITEMS %}
|
||||
<li><a href="{{ link }}">{{ title }}</a></li>
|
||||
{% endfor %}
|
||||
{% if DISPLAY_PAGES_ON_MENU %}
|
||||
{% for p in pages %}
|
||||
<li class="dib grow"><a class="{% if p == page %}active {% endif %}pr3 ph3-ns dib pv2" href="{{ SITEURL }}/{{ p.url }}">{{ p.title }}</a></li>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% if DISPLAY_CATEGORIES_ON_MENU %}
|
||||
{% for cat, null in categories %}
|
||||
<li{% if cat == category %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ cat.url }}">{{ cat }}</a></li>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
{% if output_file == 'index.html' %}
|
||||
<h1 id="title" class="f2 f1-m f-subheadline-ns lh-title mb4 mt4 code black-70 tracked-tight" style="color: #3b1c4a; opacity: 0; translate: 0 -10px; position: relative;">> {{ SITENAME }}</h1>
|
||||
<p class="f4 f3-ns measure lh-copy">{% if SITESUBTITLE %}{{ SITESUBTITLE }}{% endif %}</p>
|
||||
{% endif %}
|
||||
</header>
|
||||
|
||||
<main class="f5 f4-ns lh-copy ph3 ph4-ns pv3 pv4-ns lh-copy" style="max-width: 40em">
|
||||
{% block content %}{% endblock %}
|
||||
</main>
|
||||
|
||||
<footer id="contentinfo" class="f6 f6-ns ph3 ph4-ns pv3 pv4-ns mt5">
|
||||
Brought to you by:<br>
|
||||
<img src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/conservancy-header.svg" class="mt3" style="width: 150px; filter: saturate(0)" alt="Software Freedom Conservancy">
|
||||
<p class="f7 mt4">No Rights Reserved — CC0 1.0 Universal</p>
|
||||
<p class="f7 mt2 black-60">Jost font is copyright 2020 The Jost Project Authors, SIL Open Font License v1.1<br>
|
||||
Tachyons CSS is copyright 2020 Adam Morse & John Otander, MIT License<br>
|
||||
Velocity JS is copyright 2014 Julian Shapiro, MIT License<br>
|
||||
Pelican is copyright 2007 Free Software Foundation, Inc, GNU AGPL v3.0</p>
|
||||
</footer>
|
||||
<script src="{{ SITE_URL }}/{{ THEME_STATIC_DIR }}/js/velocity.min.js"></script>
|
||||
{% if output_file == 'index.html' %}
|
||||
<script>
|
||||
'use strict';
|
||||
document.getElementById('title').velocity(
|
||||
{
|
||||
opacity: 1,
|
||||
translate: '0 0',
|
||||
},
|
||||
{
|
||||
delay: 400,
|
||||
duration: 400,
|
||||
easing: 'ease',
|
||||
}
|
||||
);
|
||||
</script>
|
||||
{% endif %}
|
||||
{% if DISPLAY_CATEGORIES_ON_MENU %}
|
||||
{% for cat, null in categories %}
|
||||
<li{% if cat == category %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ cat.url }}">{{ cat }}</a></li>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</ul></nav><!-- /#menu -->
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
<footer id="contentinfo" class="body">
|
||||
<address id="about" class="vcard body">
|
||||
Proudly powered by <a href="https://getpelican.com/">Pelican</a>,
|
||||
which takes great advantage of <a href="https://www.python.org/">Python</a>.
|
||||
</address><!-- /#about -->
|
||||
</footer><!-- /#contentinfo -->
|
||||
</body>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,13 @@
|
|||
{% extends "base.html" %}
|
||||
{% block html_lang %}{{ page.lang }}{% endblock %}
|
||||
|
||||
{% block title %}{{ SITENAME }} - {{ page.title|striptags }}{%endblock%}
|
||||
{% block title %}
|
||||
{% if output_file != 'index.html' %}
|
||||
{{ SITENAME }} - {{ page.title|striptags }}
|
||||
{% else %}
|
||||
{{ SITENAME }}
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
{{ super() }}
|
||||
|
|
@ -13,7 +19,9 @@
|
|||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<h1>{{ page.title }}</h1>
|
||||
{% if output_file != 'index.html' %}
|
||||
<h1>{{ page.title }}</h1>
|
||||
{% endif %}
|
||||
{% import 'translations.html' as translations with context %}
|
||||
{{ translations.translations_for(page) }}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue