Dark Poole is a permanent dark theme of the Poole theme by @mdo. I made the theme darker, inspired by Derek Kedziora's site. Unlike default Poole that utilizes CSS media queries to activate dark mode, the theme will stay dark regardless of the user's preference.
- I added a navbar that is easily customizable. Check out Development to see how.
- I also got rid of the "tagline" in the navbar. I think it looks cleaner without it.
- Finally, I changed the default font size to 20px. I have 20/20 vision and still thought the original font size was too small.
That's it! I tried to be least intrusive as possible to the Poole code base.
I noticed that Poole's documentation is slightly outdated and misleading. This documentation will try to address most, if not all, of these issues.
Poole is built on Jekyll and uses its built-in SCSS compiler to generate our CSS. Before getting started, you'll need to install the Jekyll gem and related dependencies:
$ gem install jekyll jekyll-gist jekyll-sitemap jekyll-seo-tagYou must have bundler installed. If you already have bundler installed, please skip this step.
# Update Rubygems
$ gem update --system
# Update bundler
$ gem install bundlerTo see your Jekyll site with Poole applied, start a Jekyll server. In Terminal, from /dark-poole (or whatever your Jekyll site's root directory is named):
$ bundle exec jekyll serveOpen http://localhost:4000 in your browser, and voilà.
If you host your code on GitHub, you can use GitHub Pages to host your project.
- Fork this repo and switch to the
gh-pagesbranch. - If you're using a custom domain name, modify the
CNAMEfile to point to your new domain. - If you're not using a custom domain name, modify the
urlin_config.ymlto point to your GitHub Pages URL. Example: for a site hosted atusername.github.io, usehttp://username.github.io. - If you want to use your repo name as a base url, set the
urlto your repo link and set thebaseurlto your repo name in_config.yml. Example: for site hosted onhttps://username.github.io/dark-poole, seturlashttps://username.github.io/dark-pooleandbaseurlas/dark-poole. - Done! Head to your GitHub Pages URL or custom domain.
No matter your production or hosting setup, be sure to verify the baseurl option file and CNAME settings. Not applying this correctly can mean broken styles on your site.
If you are using a base url for your site, (for example, hosted on https://username.github.io/dark-poole) you have to make some changes to get jekyll-pagination to work correctly:
In _config.yml, add this line:
paginate_path: "/baseurl/page:num/"In archive.md, add {{ site.baseurl }} before {{ post.url }}
<!-- Add "{{ site.baseurl }}" -->
<li><a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a></li>In index.html, remove the prepend::
<!-- Remove "prepend:" in "prepend: relative_url" -->
<a
class="pagination-item newer"
href="{{ paginator.previous_page_path | relative_url }}"
>Newer</a
>Poole has two branches, but only one is used for active development.
masterfor development. All pull requests should be to submitted againstmaster.gh-pagesfor hosted demo Please avoid using this branch.
CSS is handled via Jeykll's built-in Sass compiler. Source Sass files are located in _sass/, included into styles.scss, and compile to styles.css.
You can easily customize the navbar by tweaking the _config.yml file. Simply change the title and url of each of the nav elements, or add more. The order will be preserved in the site.
nav:
- title: Blog
url: /archive
- title: About
url: /aboutMark Otto
Open sourced under the MIT license.
<3