Merge pull request #79 from sio/boostwatch

Enable alternative themes for Bootstrap (e.g. Boostwatch)

README.md

@@ -56,6 +56,7 @@ Visit the [Settings wiki](https://github.com/nairobilug/pelican-alchemy/wiki/Set
 - **DESCRIPTION**: Index HTML head `<meta>` description.
 - **LINKS**: A list of tuples (Title, URL) for menu links.
 - **ICONS**: A list of tuples (Icon, URL) for icon links.
+- **BOOTSTRAP_CSS**: URL of Bootstrap CSS file. Use this to enable Boostwatch themes.
 - **PYGMENTS_STYLE**: Built-in Pygments style for syntax highlighting.
 - **HIDE_AUTHORS**: Hide the author(s) of an article - useful for single author sites.
 - **RFG_FAVICONS**: Use a Favicon Generator package.

alchemy/static/css/theme.css

@@ -1,24 +1,14 @@
+:root {
+    --alchemy-border: rgba(0,0,0,.1);
+}
 ::selection {
-  background: #0085a1;
-  color: #fff;
+  background: var(--primary);
+  color: var(--secondary);
   text-shadow: none;
 }
 
-body {
-  background-color: #f5f5f5;
-}
-
-a {
-  color: #333;
-}
-
-a:focus,
-a:hover {
-  color: #0085a1;
-}
-
 blockquote {
-  color: #818a91;
+  opacity: .7;
   font-style: italic;
 }
 
@@ -38,7 +28,7 @@ hr {
 }
 
 .header {
-  border-bottom: 1px solid rgba(0,0,0,.1);
+  border-bottom: 1px solid var(--alchemy-border);
 }
 
 .header img {
@@ -62,23 +52,18 @@ hr {
 }
 
 .main {
-  background-color: #fff;
   padding: 1.5rem 0;
 }
 
 .footer {
-  border-top: 1px solid rgba(0,0,0,.1);
+  border-top: 1px solid var(--alchemy-border);
 }
 
 .highlight pre {
-  border: 1px solid rgba(0,0,0,.1);
+  border: 1px solid var(--alchemy-border);
   padding: 1rem;
 }
 
-.pagination .page-link {
-  color: #333;
-}
-
 .teaser header ul {
   list-style: none;
   padding-left: 0;

alchemy/templates/base.html

@@ -17,7 +17,7 @@
     <meta name="theme-color" content="#333333">
   {% endif %}
 
-  <link rel="stylesheet" href="{{ SITEURL }}/theme/css/bootstrap.min.css">
+  <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">

alchemy/templates/include/pagination.html

@@ -9,7 +9,7 @@
         </a>
       </li>
     {% endif %}
-    <li class="page-item disabled">
+    <li class="page-item">
       <span class="page-link">{{ articles_page.number }} of {{ articles_paginator.num_pages }}</span>
     </li>
     {% if articles_page.has_next() %}