first draft

LICENSE

@@ -1,6 +1,6 @@
-MIT License
+The MIT License (MIT)
 
-Copyright (c) 2017 
+Copyright (c) 2016 Pieter Robberechts
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1 +1,138 @@
-# solar-theme-hexo
+# Cactus Dark
+
+A responsive, dark and simple [Hexo](http://hexo.io) theme for a personal website.
+
+:cactus: [Demo](https://probberechts.github.io/cactus-dark/)
+
+![cactus-dark](https://cloud.githubusercontent.com/assets/2175271/19885143/62e9269c-a01d-11e6-8e26-e36a36201d88.png)
+
+## Summary
+
+- [General](#general)
+- [Features](#features)
+- [Install](#install)
+- [Configuration](#configuration)
+- [License](#license)
+
+## General
+
+- **Version** : 2.0
+- **Compatibility** : Hexo 3 or later
+
+## Features
+
+- Fully responsive
+- Disqus
+- Googe analytics
+- Font Awesome icons
+- Pick your own code highlighting scheme
+- Configurable navigation menu
+- Projects list
+- Simplicity
+
+## Install
+1. In the `root` directory:
+
+    ```git
+    $ git clone https://github.com/probberechts/cactus-dark.git themes/cactus-dark
+    $ npm install hexo-pagination --save
+    ```
+
+2. Change the `theme` property in the `config.yml` file.
+
+    ```yml
+    # theme: landscape
+    theme: cactus-dark
+    ```
+
+3. Run: `hexo generate` and `hexo server`
+
+## Configuration
+
+### Navigation
+
+Setup the navigation menu in the theme's `_config.yml`:
+
+  ```
+  nav:
+    Home: /
+    About: /about/
+    Writing: /archives/
+    Projects: http://github.com/probberechts
+    LINK_NAME: URL
+  ```
+
+### Projects list
+
+Create a projects file `source/_data/projects.json`.
+
+  ```json
+  [
+      {
+         "name":"Hexo",
+         "url":"https://hexo.io/",
+         "desc":"A fast, simple & powerful blog framework"
+      },
+      {
+         "name":"Font Awesome",
+         "url":"http://fontawesome.io/",
+         "desc":"The iconic font and CSS toolkit"
+      }
+  ]
+  ```
+
+### Social media links
+
+Cactus Dark can automatically add links to your social media accounts. Therefore, update the theme's `_config.yml`:
+
+  ```
+  customize:
+    social_links:
+      github: your-github-url
+      twitter: your-twitter-url
+      NAME: your-NAME-url
+  ```
+
+where `NAME` is the name of a [Font Awesome icon](http://fontawesome.io/icons/#brand).
+
+### RSS
+
+Set the `rss` field in the theme's `_config.yml` to one of the following values:
+
+1. `rss: false` will totally disable rss (default).
+2. `rss: atom.xml` sets a specific feed link.
+3. `rss:`leave empty to use the [hexo-generator-feed](https://github.com/hexojs/hexo-generator-feed) plugin. 
+
+### Analytics
+
+Add you Google Analytics `tracking_id` to the theme's `_config.yml`.
+
+  ```
+  plugins:
+      gooogle_analytics: 'UA-49627206-1'            # Format: UA-xxxxxx-xx
+  ```
+
+### Comments
+
+First, create a site on Disqus: [https://disqus.com/admin/create/](http://disqus.com/admin/create/).
+
+Next, update the theme's `_config.yml` file:
+
+  ```
+  plugins:
+      disqus_shortname: SITENAME
+  ```
+
+where `SITENAME` is the name you gave your site on Disqus.
+
+### Code Highlighting
+
+Pick one of [the available colorschemes](https://github.com/probberechts/cactus-dark/tree/master/source/css/_highlight) and add it to the theme's `_config.yml`:
+
+  ```
+  customize:
+      highlight: COLORSCHEME_NAME
+  ```
+
+## License
+MIT

_config.yml

@@ -0,0 +1,52 @@
+nav:
+  Home: /
+  About: /about/
+  Writing: /archives/
+  Projects: http://github.com/probberechts
+
+projects_url: http://github.com/probberechts
+
+customize:
+    gravatar:
+        email: 
+    logo:
+        enabled: true
+        width: 50
+        height: 50
+        url: /images/logo.png
+        gravatar: false
+    favicon: 
+      # eg. generate with http://realfavicongenerator.net/
+      desktop:
+        url: /images/favicon.ico
+        gravatar: false
+      android:
+        url: /images/favicon-192x192.png
+        gravator: false
+      apple:
+        url: /images/apple-touch-icon.png
+        gravator: false
+    social_links:
+        github: http://github.com/probberechts/cactus-dark
+        twitter: /
+        facebook: /
+        linkedin: /
+    post_count: 5
+    highlight: lightcode
+    banner_image:  /images/bg_cactus.jpg
+
+# RSS
+rss: false
+
+# Plugins
+plugins:
+    disqus_shortname: # Disqus Comments Shortname
+    google_analytics: UA-86660611-1 # enter the tracking ID for your Google Analytics
+
+# Miscellaneous
+miscellaneous:
+    open_graph: # see http://ogp.me
+        fb_app_id:
+        fb_admins:
+        twitter_id:
+        google_plus:

layout/_partial/banner.ejs

@@ -0,0 +1,3 @@
+<div class="banner">HEADER CONTENT
+
+</div>

layout/_partial/comments.ejs

@@ -0,0 +1,7 @@
+<% if(page.comments && theme.plugins.disqus_shortname){ %>
+    <div class="blog-post-comments">
+        <div id="disqus_thread">
+            <noscript>Please enable JavaScript to view the <a href="//disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
+        </div>
+    </div>
+<% } %>

layout/_partial/footer.ejs

@@ -0,0 +1,14 @@
+<footer id="footer">
+  <div class="footer-left">
+    Copyright &copy; <%= new Date().getFullYear() %> <%= config.author || config.title %>
+  </div>
+  <div class="footer-right">
+    <nav>
+      <ul>
+        <% for (var i in theme.nav) { %> 
+          <li><a href="<%- url_for(theme.nav[i]) %>"><%= i %></a></li>
+        <% } %>
+      </ul>
+    </nav>
+  </div>
+</footer>

layout/_partial/head.ejs

@@ -0,0 +1,54 @@
+<head>
+    <!-- so meta -->
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="HandheldFriendly" content="True">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
+    <%- open_graph({
+        image:          thumbnail(page),
+        fb_app_id:      theme.miscellaneous.open_graph.fb_app_id,
+        fb_admins:      theme.miscellaneous.open_graph.fb_admins,
+        twitter_id:     theme.miscellaneous.open_graph.twitter_id,
+        google_plus:    theme.miscellaneous.open_graph.google_plus,
+    }) %>
+    <%- meta(page) %>
+    <% if (theme.customize.favicon) { %>
+        <% if (theme.customize.favicon.desktop) { %>
+          <% if (theme.customize.gravatar.email && theme.customize.favicon.desktop.gravatar) { %>
+              <link rel="shortcut icon" href="<%= gravatar(theme.customize.gravatar.email, 16) %>">
+          <% } else { %>
+              <link rel="shortcut icon" href="<%= url_for(theme.customize.favicon.desktop.url) %>">
+          <% } %>
+        <% } %>
+        <% if (theme.customize.favicon.android) { %>
+          <% if (theme.customize.gravatar.email && theme.customize.favicon.android.gravatar) { %>
+            <link rel="icon" type="image/png" href="<%= gravatar(theme.customize.gravatar.email, 192) %>" sizes="192x192">
+          <% } else { %>
+            <link rel="icon" type="image/png" href="<%= url_for(theme.customize.favicon.android.url) %>" sizes="192x192">
+          <% } %>
+        <% } %>
+        <% if (theme.customize.favicon.apple) { %>
+          <% if (theme.customize.gravatar.email && theme.customize.favicon.apple.gravatar) { %>
+            <link rel="apple-touch-icon" sizes="180x180" href="<%= gravatar(theme.customize.gravatar.email, 180) %>">
+          <% } else { %>
+            <link rel="apple-touch-icon" sizes="180x180" href="<%= url_for(theme.customize.favicon.apple.url) %>">
+          <% } %>
+        <% } %>
+    <% } %>
+    <!-- title -->
+    <title><%= page.title ? page.title : config.title %></title>
+    <!-- styles -->
+    <%- css('lib/font-awesome/css/font-awesome.min') %>
+    <%- css('lib/meslo-LG/styles') %>
+    <%- css('lib/justified-gallery/justifiedGallery.min.css') %>
+    <%- css('css/style') %>
+    <!-- rss -->
+    <% if (theme.rss === '' && config.feed && config.feed.path) { %>
+      <% theme.rss = config.feed.path %>
+    <% } %>
+    <% if (theme.rss) { %>
+      <link rel="alternate" href="<%= url_for(theme.rss) %>" title="<%= config.title %>" type="application/atom+xml" />
+    <% } %>
+    <!-- jquery -->
+    <%- js('lib/jquery/jquery.min') %>
+</head>

layout/_partial/header.ejs

@@ -0,0 +1,24 @@
+<header id="header">
+  <a href="<%- url_for("/") %>">
+  <% if (theme.customize.logo && theme.customize.logo.enabled) { %>
+    <% if (theme.customize.gravatar.email && theme.customize.logo.gravatar) { %>
+      <div id="logo" style="background-image: url(<%- gravatar(theme.customize.gravatar.email) %>);"></div>
+    <% } else { %>
+      <div id="logo" style="background-image: url(<%- url_for(theme.customize.logo.url) %>);"></div>
+    <% } %>
+  <% } %>
+    <div id="title">
+      <h1><%= config.title %></h1>
+    </div>
+  </a>
+  <div id="nav">
+    <ul>
+      <li class="icon">
+        <a href="#"><i class="fa fa-bars fa-2x"></i></a>
+      </li>
+      <% for (var i in theme.nav) { %> 
+        <li><a href="<%- url_for(theme.nav[i]) %>"><%= i %></a></li>
+      <% } %>
+    </ul>
+  </div>
+</header>

layout/_partial/post/actions_desktop.ejs

@@ -0,0 +1,38 @@
+<div id="header-post">
+  <a id="menu-icon" href="#"><i class="fa fa-bars fa-lg"></i></a>
+  <a id="menu-icon-tablet" href="#"><i class="fa fa-bars fa-lg"></i></a>
+  <a id="top-icon-tablet" href="#" onclick="$('html, body').animate({ scrollTop: 0 }, 'fast');" style="display:none;"><i class="fa fa-chevron-up fa-lg"></i></a>
+  <span id="menu">
+    <span id="nav">
+      <ul>
+        <% for (var i in theme.nav) { %> 
+          <li><a href="<%- url_for(theme.nav[i]) %>"><%= i %></a></li>
+        <% } %>
+      </ul>
+    </span>
+    <br/>
+    <span id="actions">
+      <ul>
+        <% if (page.prev) { %>
+        <li><a class="icon" href="<%- url_for(page.prev.path) %>"><i class="fa fa-chevron-left" aria-hidden="true" onmouseover='$("#i-prev").toggle();' onmouseout='$("#i-prev").toggle();'></i></a></li>
+        <% } %>
+        <% if (page.next) { %>
+        <li><a class="icon" href="<%- url_for(page.next.path) %>"><i class="fa fa-chevron-right" aria-hidden="true" onmouseover='$("#i-next").toggle();' onmouseout='$("#i-next").toggle();'></i></a></li>
+        <% } %>
+        <li><a class="icon" href="#" onclick="$('html, body').animate({ scrollTop: 0 }, 'fast');"><i class="fa fa-chevron-up" aria-hidden="true" onmouseover='$("#i-top").toggle();' onmouseout='$("#i-top").toggle();'></i></a></li>
+        <li><a class="icon" href="#"><i class="fa fa-share-alt" aria-hidden="true" onmouseover='$("#i-share").toggle();' onmouseout='$("#i-share").toggle();' onclick='$("#share").toggle();return false;'></i></a></li>
+      </ul>
+      <span id="i-prev" class="info" style="display:none;">Previous post</span>
+      <span id="i-next" class="info" style="display:none;">Next post</span>
+      <span id="i-top" class="info" style="display:none;">Back to top</span>
+      <span id="i-share" class="info" style="display:none;">Share post</span>
+    </span>
+    <br/>
+    <div id="share" style="display: none">
+      <%- partial('_partial/post/share', { icon_class_name: '' }) %>
+    </div>
+    <div id="toc">
+      <%- toc(page.content) %>
+    </div>
+  </span>
+</div>

layout/_partial/post/actions_mobile.ejs

@@ -0,0 +1,30 @@
+<div id="footer-post-container">
+  <div id="footer-post">
+
+    <div id="nav-footer" style="display: none">
+      <ul>
+        <% for (var i in theme.nav) { %> 
+          <li><a href="<%- url_for(theme.nav[i]) %>"><%= i %></a></li>
+        <% } %>
+      </ul>
+    </div>
+
+    <div id="toc-footer" style="display: none">
+      <%- toc(page.content) %>
+    </div>
+
+    <div id="share-footer" style="display: none">
+      <%- partial('_partial/post/share', { icon_class_name: 'fa-lg' }) %>
+    </div>
+
+    <div id="actions-footer">
+      <ul>
+        <li id="toc"><a class="icon" href="#" onclick='$("#toc-footer").toggle();return false;'><i class="fa fa-list fa-lg" aria-hidden="true"></i> TOC</a></li>
+        <li id="share"><a class="icon" href="#" onclick='$("#share-footer").toggle();return false;'><i class="fa fa-share-alt fa-lg" aria-hidden="true"></i> Share</a></li>
+        <li id="top" style="display:none"><a class="icon" href="#" onclick="$('html, body').animate({ scrollTop: 0 }, 'fast');"><i class="fa fa-chevron-up fa-lg" aria-hidden="true"></i> Top</a></li>
+        <li id="menu"><a class="icon" href="#" onclick='$("#nav-footer").toggle();return false;'><i class="fa fa-bars fa-lg" aria-hidden="true"></i> Menu</a></li>
+      </ul>
+    </div>
+
+  </div>
+</div>

layout/_partial/post/date.ejs

@@ -0,0 +1,5 @@
+<% if (post.date) { %>
+    <div class="<%= class_name %>">
+        <time datetime="<%= date_xml(post.date) %>" itemprop="datePublished"><%= date(post.date, config.date_format) %></time>
+    </div>
+<% } %>

layout/_partial/post/gallery.ejs

@@ -0,0 +1,9 @@
+<% if (page.photos && page.photos.length) { %>
+<div class="article-gallery">
+    <% page.photos.forEach(function(photo, i) { %>
+    <a class="gallery-item" href="<%- url_for(photo) %>" rel="gallery_<%= page._id %>">
+        <img src="<%- url_for(photo) %>" itemprop="image" />
+    </a>
+    <% }) %>
+</div>
+<% } %>