mirror of
https://github.com/nairobilug/pelican-alchemy.git
synced 2024-12-30 12:15:06 +01:00
18996a6c1d
Alchemy is a great theme, but it was not using the full potential of underlying technology. Bootstrap provides an easy way to customize look and feel of rendered pages, and a lot of themes for Bootstrap are freely available, e.g. at <https://boostwatch.com> This commit introduces a new configuration variable BOOTSTRAP_CSS to make use of any existing Bootstrap skins. All incompatibilities in `theme.css` were fixed: - Instead of using constant color values we use Bootstrap css variables for colors: <https://getbootstrap.com/docs/4.3/getting-started/theming/#css-variables> - The only hardcoded color value left is the color for header/footer borders. It was moved into a variable `--alchemy-border` for easier overriding if needed. I have tested the current value against both dark and light Boostwatch themes, it works ok. - Pagination template was slightly changed to avoid producing invisible text with some of Bootstrap skins
52 lines
1.6 KiB
HTML
52 lines
1.6 KiB
HTML
<!doctype html>
|
|
<html lang="{{ DEFAULT_LANG }}">
|
|
|
|
<head>
|
|
<!-- Required meta tags -->
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
|
|
<title>{% block title %}| {{ SITENAME }}{% endblock %}</title>
|
|
<link rel="canonical" href="{{ SITEURL }}/{{ output_file }}">
|
|
|
|
{% if RFG_FAVICONS %}
|
|
<link rel="apple-touch-icon" href="{{ SITEURL }}/apple-touch-icon.png" sizes="180x180">
|
|
<link rel="icon" type="image/png" href="{{ SITEURL }}/favicon-32x32.png" sizes="32x32">
|
|
<link rel="icon" type="image/png" href="{{ SITEURL }}/favicon-16x16.png" sizes="16x16">
|
|
<link rel="manifest" href="{{ SITEURL }}/manifest.json">
|
|
<meta name="theme-color" content="#333333">
|
|
{% endif %}
|
|
|
|
<link rel="stylesheet" href="{{ BOOTSTRAP_CSS or SITEURL + '/theme/css/bootstrap.min.css'}}">
|
|
<link rel="stylesheet" href="{{ SITEURL }}/theme/css/font-awesome.min.css">
|
|
<link rel="stylesheet" href="{{ SITEURL }}/theme/css/pygments/{{ PYGMENTS_STYLE|default('default') }}.min.css">
|
|
<link rel="stylesheet" href="{{ SITEURL }}/theme/css/theme.css">
|
|
|
|
{% include 'include/xml_feeds.html' %}
|
|
{% block head %}{% endblock %}
|
|
{% include 'include/analytics.html' %}
|
|
</head>
|
|
|
|
<body>
|
|
<header class="header">
|
|
<div class="container">
|
|
{% include 'include/header.html' %}
|
|
</div>
|
|
</header>
|
|
|
|
<div class="main">
|
|
<div class="container">
|
|
<h1>{% block page_header %}{% endblock %}</h1>
|
|
<hr>
|
|
{% block content %}{% endblock %}
|
|
</div>
|
|
</div>
|
|
|
|
<footer class="footer">
|
|
<div class="container">
|
|
{% include 'include/footer.html' %}
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
|
|
</html>
|