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-tag
You must have bundler installed. If you already have bundler installed, please skip this step.
# Update Rubygems
$ gem update --system
# Update bundler
$ gem install bundler
To 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 serve
Open 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-pages
branch. - If you're using a custom domain name, modify the
CNAME
file to point to your new domain. - If you're not using a custom domain name, modify the
url
in_config.yml
to 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
url
to your repo link and set thebaseurl
to your repo name in_config.yml
. Example: for site hosted onhttps://username.github.io/dark-poole
, seturl
ashttps://username.github.io/dark-poole
andbaseurl
as/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.
master
for development. All pull requests should be to submitted againstmaster
.gh-pages
for 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: /about
Mark Otto
Open sourced under the MIT license.
<3