daydream-theme 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 907abe87343ba576fe1d412352cbf0f3e4060d58b8ca1f6433e3b456180ef19f
+  data.tar.gz: 47eee201500a825ead10a4e1df064bcbf4bcccbf980e15d6a4885cbbf8b60718
+SHA512:
+  metadata.gz: dace0f8116f0316611def155af00540d208262b8468affe6b4fefca13941ad2faa9f1f9e9ef91ae3a6f06238e0caf63d686bdd875783c9f68225aafbfa8afb71
+  data.tar.gz: 6d64e2aee1f81de5bceafd2e842c3c0fed2f67064428e37abe2f60a276daab9018f1961bf89563b3a5da12eb2514526c05cf502ee5f51b3d7bc3b9985f933067

data/LICENSE.txt

@@ -0,0 +1,5 @@
+The High Five License
+
+If you deploy this software to a webserver exposed to the internet you must give me one high five if you ever meet me IRL.
+Make whatever changes you want, no need for attribution if you don't want to.
+Any copies of this software do not need to include this license.

data/README.md

@@ -0,0 +1,144 @@
+# Daydream
+
+Welcome to my Jekyll theme, its pretty basic, there isn't really much more too it.\
+
+![Picture of the theme](theme.PNG)
+
+A live demo can also be seen [here](https://embar.io).
+
+This theme is also in no way shape or form mobile friendly, you have been warned.
+
+This theme should be accessability friendly as its just HTML and CSS, but no gaurantees there, I am not a frontend developer.
+
+Photo by [Wolfgang Hasselmann](https://unsplash.com/@wolfgang_hasselmann?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/@wolfgang_hasselmann?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)
+  
+
+## Installation
+
+Add this line to your Jekyll site's `Gemfile`:
+
+```ruby
+gem "daydream-theme"
+```
+
+And add this line to your Jekyll site's `_config.yml`:
+
+```yaml
+theme: daydream-theme
+```
+as well as 
+```yaml
+cover: /assets/img/bg.jpg
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install daydream
+
+## Usage
+
+Edit config, replace bg.jpg if you want to, add a picture called me.jpg in `assets/me.jpg` to include a picture.
+
+## _config.yml fields
+Following fields are added on top of the default config.
+```yml
+tagline: This is the tagline bewlow the title
+cover: define a custom sidebar image
+```
+
+### Navigation
+For navigation links create the folder `_data` and within it the file `navigation.yml`, use the following format.
+```yaml
+- title: Home
+  url: /
+- title: ...
+  url: /.../
+```
+
+### Social
+For social links create the folder `_data` and within it the file `social.yml`, use the following format.
+
+```yaml
+- title: Email
+  url: mailto:<name>@<domain>
+  icon: fas fa-envelope
+- title: Twitter
+  url: https://twitter.com/<username>
+  icon: fab fa-twitter
+```
+
+### Creating a default home page
+
+In the root of the website create a index.md file, in here include the frontmatter
+```yml
+---
+layout: page
+title: <TITLE HERE>
+permalink: /
+---
+```
+
+### Creating an overview of all posts
+
+If you added a default home page you would then have lost the default overview of all posts, this is probably the wrong way to go about things but here is how I fixed it.
+In the root of the website create a posts.md file, in here paste the following.
+```html
+---
+layout: page
+title: Posts
+permalink: /posts/
+---
+<ul>
+
+  {% for post in site.posts %}
+    <li>
+      <a href="{{ post.url }}">
+        {{ post.title }}
+      </a>
+      - <time datetime="{{ post.date | date: "%Y-%m-%d" }}">{{ post.date | date_to_long_string }}</time>
+    </li>
+    {% if post.excerpt %}
+        {{ post.excerpt | truncate: 256 }}  
+    {% endif %}
+  {% endfor %}
+```
+
+### Removing / Editing the "Made with ❤️ by William Ben Embarek" from the footer
+
+Create the folder `_includes`.
+Within it create the file `footer.html`
+Paste in the following and edit it
+
+```html
+<footer class="footer">
+    <small>
+      Made with ❤️ by <a ref=https://github.com/williambenembarek>William Ben Embarek</a>
+    </small>
+</footer>
+```
+
+## TODO
+ - Add dark mode toggle, if you end up implementing this please send me a PR! Would be apprciated :)
+ - Make mobile friendly
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub at https://github.com/williambenembarek/daydream-theme. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.
+
+## Development
+
+To set up your environment to develop this theme, run `bundle install`.
+
+Your theme is setup just like a normal Jekyll site! To test your theme, run `bundle exec jekyll serve` and open your browser at `http://localhost:4000`. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.
+
+When your theme is released, only the files in `_layouts`, `_includes`, `_sass` and `assets` tracked with Git will be bundled.
+To add a custom directory to your theme-gem, please edit the regexp in `daydream.gemspec` accordingly.
+
+## License
+
+The theme is available as open source under the terms of the [High Five License](LICENSE.txt).
+

data/_includes/archive-by-tagories.html

@@ -0,0 +1,68 @@
+{%- if page.type == 'categories' -%}
+  {%- assign taxonomies = site.categories -%}
+{%- elsif page.type == 'tags' -%}
+  {%- assign taxonomies = site.tags -%}
+{%- else -%}
+  {%- assign taxonomies = none -%}
+{%- endif -%}
+
+{%- assign max_count = 0 -%}
+{%- for taxonomy in taxonomies -%}
+  {%- assign posts = taxonomy[1] -%}
+  {%- if posts.size > max_count -%}
+    {%- assign max_count = posts.size -%}
+  {%- endif -%}
+{%- endfor -%}
+
+<div class="taxonomies-wrapper">
+  <ul class="taxonomies">
+    {%- for i in (1..max_count) reversed -%}
+      {%- for taxonomy in taxonomies -%}
+        {%- assign taxonomy_name = taxonomy[0] -%}
+        {%- assign slugified_taxonomy_name = taxonomy_name | slugify -%}
+        {%- assign posts = taxonomy[1] -%}
+        {%- if posts.size == i -%}
+          <li>
+            {%- capture link -%}{{ page.permalink }}#{{ slugified_taxonomy_name }}{%- endcapture -%}
+            <a class="taxonomy" href="{{ link | relative_url }}">
+              <span>
+                {%- if page.type == 'tags' -%}
+                  {{ slugified_taxonomy_name }}
+                {%- else -%}
+                  {{ taxonomy_name }}
+                {%- endif -%}
+              </span>
+              <span class="taxonomy-count">{{ posts.size }}</span>
+            </a>
+          </li>
+        {%- endif -%}
+      {%- endfor -%}
+    {%- endfor -%}
+  </ul>
+</div>
+
+{%- for i in (1..max_count) reversed -%}
+  {%- for taxonomy in taxonomies -%}
+    {%- assign taxonomy_name = taxonomy[0] -%}
+    {%- assign slugified_taxonomy_name = taxonomy_name | slugify -%}
+    {%- assign posts = taxonomy[1] -%}
+    {%- if posts.size == i -%}
+      <h2 id="{{ slugified_taxonomy_name }}">
+        {%- if page.type == 'tags' -%}
+          {{ slugified_taxonomy_name }}
+        {%- else -%}
+          {{ taxonomy_name }}
+        {%- endif -%}
+      </h2>
+      <ul class="post-list-by-taxonomy">
+        {%- for post in posts -%}
+          <li>
+            <time datetime="{{ page.date | date_to_xmlschema }}">{{ post.date | date: "%Y-%m-%d" }}</time> 
+            &raquo; 
+            <a href="{{ post.url | relative_url }}">{{ post.title | escape }}</a>
+          </li>
+        {%- endfor -%}
+      </ul>
+    {%- endif -%}
+  {%- endfor -%}
+{%- endfor -%}

data/_includes/archive-by-years.html

@@ -0,0 +1,29 @@
+{% assign taxonomies = site.posts | group_by_exp: "post", "post.date | date: '%Y'" %}
+
+<div class="taxonomies-wrapper">
+  <ul class="taxonomies">
+    {%- for taxonomy in taxonomies -%}
+      <li>
+        {%- capture link -%}{{ page.permalink }}#{{ taxonomy.name }}{%- endcapture -%}
+        <a class="taxonomy" href="{{ link | relative_url }}">
+          <span>{{ taxonomy.name }}</span>
+          <span class="taxonomy-count">{{ taxonomy.size }}</span>
+        </a> 
+      </li>
+    {%- endfor -%}
+  </ul>
+</div>
+
+{%- for taxonomy in taxonomies -%}
+  <h2 id="{{ taxonomy.name }}">{{ taxonomy.name }}</h2>
+  <ul class="post-list-by-taxonomy">
+    {%- assign posts = taxonomy.items -%}
+    {%- for post in posts -%}
+      <li>
+        <time datetime="{{ page.date | date_to_xmlschema }}">{{ post.date | date: "%Y-%m-%d" }}</time> 
+        &raquo;
+        <a href="{{ post.url | relative_url }}">{{ post.title | escape }}</a>
+      </li>
+    {%- endfor -%}
+  </ul>
+{%- endfor -%}

data/_includes/custom-head.html

@@ -0,0 +1,6 @@
+{% comment %}
+  Placeholder to allow defining custom head, in principle, you can add anything here, e.g. favicons:
+
+  1. Head over to https://realfavicongenerator.net/ to add your own favicons.
+  2. Customize default _includes/custom-head.html in your source directory and insert the given code snippet.
+{% endcomment %}

data/_includes/footer.html

@@ -0,0 +1,5 @@
+<footer class="footer">
+    <small>
+      Made with ❤️ by <a ref=https://github.com/williambenembarek>William Ben Embarek</a>
+    </small>
+</footer>

data/_includes/head.html

@@ -0,0 +1,14 @@
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  {% feed_meta %}
+  
+  <link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/pure-min.css" crossorigin="anonymous">
+  <link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/grids-responsive-min.css">
+  <link rel="stylesheet" href="{{ 'assets/css/open-color.css' | relative_url }}">
+  <link rel="stylesheet" href="{{ 'assets/css/daydream.css' | relative_url }}">
+
+  <script async src="https://use.fontawesome.com/releases/v5.12.0/js/all.js"></script>
+
+  {% include custom-head.html %}
+</head>

data/_includes/header.html

@@ -0,0 +1,35 @@
+<header class="header">
+  <div class="image-cropper">
+    <img src="/assets/img/me.jpg" class="rounded" />
+  </div>
+  <a class="brand-title" href="{{ '/' | relative_url }}">{{ site.title }}</a>
+  <p class="brand-tagline">{{ site.tagline }}</p>
+
+  {% if site.data.navigation %}
+    <nav class="nav pure-menu">
+      <ul class="pure-menu-list">
+      {% for item in site.data.navigation %}
+        <li class="nav-item pure-menu-item">
+          <a href="{{ item.url | relative_url }}" class="pure-menu-link {% if page.url == item.url %}current{% endif %}">
+            {{ item.title }}
+          </a>
+        </li>
+      {% endfor %}
+      </ul>
+    </nav>
+  {% endif %}
+
+  {% if site.data.social %}
+    <div class="social pure-menu pure-menu-horizontal">
+      <ul class="social-list pure-menu-list">
+        {% for social in site.data.social %}
+          <li class="social-item pure-menu-item">
+            <a class="pure-menu-link pure-button" href="{{ social.url }}" target="_blank">
+              <i class="{{ social.icon | default: 'fas fa-link' }}" title="{{ social.title }}"></i>
+            </a>
+          </li>
+        {% endfor %}
+      </ul>
+    </div>
+  {% endif %}
+</header>

data/_includes/mathjax.html

@@ -0,0 +1,2 @@
+<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
+<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>

data/_layouts/archive.html

@@ -0,0 +1,15 @@
+---
+layout: default
+---
+
+<article>
+  <h1>{{ page.title }}</h1>
+
+  {{ content }}
+
+  {% if page.type == "years" %}
+    {% include archive-by-years.html %}
+  {% else %}
+    {% include archive-by-tagories.html %}
+  {% endif %}
+</article>

data/_layouts/default.html

@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="{{ page.lang | default: site.lang | default: 'en' }}">
+  {% include head.html %}
+
+  <body>
+    <div id="layout" class="pure-g">
+      {% assign cover = site.cover %}
+      {% if page.cover %}
+        {% assign cover = page.cover %}
+      {% endif %}
+      <div class="sidebar pure-u-1 pure-u-md-1-4" {% if cover %}style="background-image: url({{ cover | relative_url }});"{% endif %}>
+        <div class="sidebar-shield">
+          {% include header.html %}
+        </div>
+      </div>
+      <div class="content pure-u-1 pure-u-md-3-4">
+        <div class="main">
+          {{ content }}
+        </div>
+        {% include footer.html %}
+      </div>
+    </div>
+
+    {% if page.math %}
+      {% include mathjax.html %}
+    {% endif %}
+
+  </body>
+</html>

data/_layouts/home.html

@@ -0,0 +1,44 @@
+---
+layout: default
+---
+
+<div class="posts">
+  {% assign posts = site.posts %}
+  {% if paginator %}
+    {% assign posts = paginator.posts %}
+  {% endif %}
+  {% for post in posts %}
+    <div class="post">
+      <h2 class="post-title">
+        <a href="{{ post.url | relative_url }}">
+          {{ post.title }}
+        </a>
+      </h2>
+
+      <time datetime="{{ post.date | date_to_xmlschema }}" class="post-meta">{{ post.date | date_to_string }}</time>
+
+      <p class="post-excerpt">
+        {% if post.description %}
+          {{ post.description | strip_html }}
+        {% else %}
+          {{ post.excerpt | strip_html }}
+        {% endif %}
+      </p>
+    </div>
+  {% endfor %}
+</div>
+
+{% if paginator %}
+  <div class="pagination pure-g">
+    {% if paginator.next_page %}
+      <a class="pagination-item older pure-u-1-2 pure-button" href="{{ paginator.next_page_path | relative_url }}"><i class="fas fa-chevron-left"></i></a>
+    {% else %}
+      <span class="pagination-item older pure-u-1-2 pure-button pure-button-disabled"><i class="fas fa-chevron-left"></i></span>
+    {% endif %}
+    {% if paginator.previous_page %}
+      <a class="pagination-item newer pure-u-1-2 pure-button" href="{{ paginator.previous_page_path | relative_url }}"><i class="fas fa-chevron-right"></i></a>
+    {% else %}
+      <span class="pagination-item newer pure-u-1-2 pure-button pure-button-disabled"><i class="fas fa-chevron-right"></i></span>
+    {% endif %}
+  </div>
+{% endif %}

data/_layouts/page.html

@@ -0,0 +1,8 @@
+---
+layout: default
+---
+
+<article class="page">
+  <h1 class="page-title">{{ page.title }}</h1>
+  {{ content }}
+</article>

data/_layouts/post.html

@@ -0,0 +1,68 @@
+---
+layout: default
+---
+
+<article class="post">
+  {% if page.categories.size > 0 %}
+    <div class="post-meta">
+      <ul class="post-categories">
+        {%- for category in page.categories -%}
+          <li>
+            {% assign slugified_category = category | slugify %}
+            {%- if site.categories_path -%}
+              <a class="post-category" href="{{ site.categories_path | relative_url }}#{{ slugified_category }}">{{ category }}</a>
+            {%- else -%}
+              <span class="post-category">{{ category }}</span>
+            {%- endif -%}
+          </li>
+        {%- endfor -%}
+      </ul>
+    </div>
+  {% endif %}
+  <h1 class="post-title">{{ page.title }}</h1>
+  <div class="post-meta">
+    <time datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">
+      {{ page.date | date_to_string }}
+    </time>
+    {%- if page.last_modified_at -%}
+      <span> ~ </span>
+      {%- assign mdate = page.last_modified_at | date_to_xmlschema -%}
+      <time datetime="{{ mdate }}" itemprop="dateModified">
+        {{ mdate | date_to_string }}
+      </time>
+    {%- endif -%}
+    {%- if page.author -%}
+      <span> • </span>
+      {% for author in page.author %}
+        <span itemprop="author" itemscope itemtype="http://schema.org/Person">
+          {{ author }}
+        </span>
+        {%- if forloop.last == false %}, {% endif -%}
+      {% endfor %}
+    {%- endif -%}
+  </div>
+  
+  {{ content }}
+
+  {% if page.tags.size > 0 %}
+    <div class="post-meta">
+      <i class="post-tags-icon fas fa-tag"></i>
+      <ul class="post-tags">
+        {%- for tag in page.tags -%}
+          <li>
+            {% assign slugified_tag = tag | slugify %}
+            {%- if site.tags_path -%}
+              <a class="post-tag" href="{{ site.tags_path | relative_url }}#{{ slugified_tag }}">{{ slugified_tag }}</a>
+            {%- else -%}
+              <span class="post-tag">{{ slugified_tag }}</span>
+            {%- endif -%}
+          </li>
+        {%- endfor -%}
+      </ul>
+    </div>
+  {% endif %}
+
+  {% if jekyll.environment == "production" and site.disqus and page.comments != false %}
+    {% include disqus.html %}
+  {% endif %}
+</article>

data/_sass/daydream/_alignment.scss

@@ -0,0 +1,29 @@
+.align-right {
+  margin-bottom: 1rem;
+  margin-left: 1rem;
+  float: right;
+}
+
+.align-left {
+  margin-right: 1rem;
+  margin-bottom: 1rem;
+  float: left;
+}
+
+.align-center {
+  display: block;
+  margin-right: auto;
+  margin-left: auto;
+}
+
+figcaption.align-right {
+  text-align: right;
+}
+
+figcaption.align-left {
+  text-align: left;
+}
+
+figcaption.align-center {
+  text-align: center;
+}

data/_sass/daydream/_archive.scss

@@ -0,0 +1,40 @@
+.taxonomies-wrapper {
+  margin-bottom: 2em;
+}
+
+.taxonomies {
+  list-style: none;
+  display: grid;
+  grid-column-gap: 2em;
+  grid-template-columns: repeat(2, 1fr);
+  margin: 0;
+  padding: 0;
+  font-weight: bold;
+
+  .taxonomy {
+    display: flex;
+    padding: 0.25em 0;
+    justify-content: space-between;
+    border-bottom: 1px solid var(--border-color);
+    margin-bottom: 1em;
+    color: var(--body-color);
+
+    &:focus,
+    &:hover {
+      color: var(--link-color);
+      text-decoration: none;
+    }
+  }
+}
+
+.post-list-by-taxonomy {
+  time {
+    font-family: monospace;
+  }
+}
+
+@media (min-width: $sm-screen) {
+  .taxonomies {
+    grid-template-columns: repeat(3, 1fr);
+  }
+}

data/_sass/daydream/_base.scss

@@ -0,0 +1,121 @@
+* {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+body {
+  font-size: var(--body-font-size);
+  line-height: var(--body-line-height);
+  color: var(--body-color);
+  background-color: var(--body-bg);
+}
+
+h1, h2, h3, h4, h5, h6 {
+  line-height: 1.2;
+  letter-spacing: -1px;
+}
+
+a {
+  color: var(--link-color);
+  text-decoration: none;
+
+  &:focus,
+  &:hover {
+    text-decoration: underline;
+  }
+}
+
+figure {
+  margin: 0;
+}
+
+img {
+  display: block;
+  max-width: 100%;
+  margin: 0 0 1em 0;
+  border-radius: var(--border-radius);
+}
+
+code,
+pre {
+  font-family: var(--code-font);
+}
+
+code {
+  padding: .1em .25em;
+  background-color: var(--code-bg);
+  border-radius: var(--border-radius);
+}
+
+pre {
+  overflow: auto;
+  padding: 1em;
+  margin: 1em 0;
+
+  code {
+    padding: 0;
+    background-color: inherit;
+  }
+}
+
+blockquote {
+  padding: 0 1em;
+  margin: 0 0 1em 0;
+  border-left: .25em solid var(--border-color);
+  color: var(--body-color-light);
+}
+
+table {
+  margin: 1em 0;
+  width: 100%;
+  border: 0 solid var(--border-color);
+  border-collapse: collapse;
+}
+
+td,
+th {
+  padding: .25em .5em;
+  border-color: inherit;
+  border-style: solid;
+  border-width: 0;
+  border-bottom-width: 1px;
+}
+
+th {
+  text-align: left;
+}
+
+thead th {
+  border-bottom-color: currentColor;
+}
+
+mark {
+  padding: .15em;
+  border-radius: var(--border-radius);
+  color: var(--message-color);
+  background-color: var(--message-bg);
+}
+
+hr {
+  position: relative;
+  margin: 2em 0;
+  border: 0;
+  border-top: 1px solid var(--border-color);
+}
+
+abbr {
+  font-weight: bold;
+  text-transform: uppercase;
+
+  &[title] {
+    cursor: help;
+    border-bottom: 1px dotted var(--border-color);
+  }
+}
+
+@media (min-width: $lg-screen) {
+  body {
+    font-size: calc(var(--body-font-size) * 1.125);
+  }
+}