├── _includes ├── head-scripts.html ├── google-analytics.html ├── hero.html ├── post-item.html ├── navbar.html ├── head.html ├── author-media.html ├── social-buttons.html └── pagination.html ├── _layouts ├── page.html ├── authors.html ├── blog.html ├── homepage.html ├── default.html ├── post.html └── author.html ├── img ├── dave.png ├── home.jpg ├── avatar.png └── guest.png ├── assets ├── css │ └── app.scss └── js │ └── app.js ├── .gitignore ├── authors.md ├── _sass ├── _intro.scss ├── _layout.scss ├── _main.scss └── syntax.scss ├── Gemfile ├── .vscode └── settings.json ├── _authors ├── dave.md ├── guest.md └── chris.md ├── package.json ├── index.html ├── _posts ├── 2019-09-05-sixth-post.md ├── 2019-08-31-first-post.md ├── 2019-09-01-second-post.md ├── 2019-09-02-third-post.md ├── 2019-09-03-fourth-post.md └── 2019-09-04-fifth-post.md ├── LICENSE.txt ├── mere-blog-theme.gemspec ├── _config.yml ├── .github └── workflows │ └── jekyll-build-deploy.yml └── README.md /_includes/head-scripts.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /_layouts/page.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | 5 | {{ content }} 6 | -------------------------------------------------------------------------------- /img/dave.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chrisrhymes/mere-blog-theme/HEAD/img/dave.png -------------------------------------------------------------------------------- /img/home.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chrisrhymes/mere-blog-theme/HEAD/img/home.jpg -------------------------------------------------------------------------------- /img/avatar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chrisrhymes/mere-blog-theme/HEAD/img/avatar.png -------------------------------------------------------------------------------- /img/guest.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/chrisrhymes/mere-blog-theme/HEAD/img/guest.png -------------------------------------------------------------------------------- /assets/css/app.scss: -------------------------------------------------------------------------------- 1 | --- 2 | --- 3 | 4 | // Import Main CSS file from theme 5 | @import "main"; 6 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | *.gem 2 | .bundle 3 | .sass-cache 4 | _site 5 | Gemfile.lock 6 | .DS_Store 7 | .idea 8 | .jekyll-cache 9 | -------------------------------------------------------------------------------- /authors.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: authors 3 | title: Authors 4 | description: The authors page for mere blog theme 5 | --- 6 | 7 | This is the authors page. 8 | -------------------------------------------------------------------------------- /_sass/_intro.scss: -------------------------------------------------------------------------------- 1 | @import "../node_modules/bulma/sass/utilities/initial-variables"; 2 | 3 | .intro { 4 | padding: $gap; 5 | 6 | margin-bottom: 3rem; 7 | } 8 | -------------------------------------------------------------------------------- /Gemfile: -------------------------------------------------------------------------------- 1 | # frozen_string_literal: true 2 | 3 | source "https://rubygems.org" 4 | gemspec 5 | 6 | group :jekyll_plugins do 7 | gem "jekyll-feed", "~> 0.6" 8 | gem "jekyll-sitemap" 9 | gem "jekyll-paginate" 10 | gem "jekyll-seo-tag" 11 | end -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "files.associations": { 3 | "*.html": "liquid" 4 | }, 5 | "[liquid]": { 6 | "editor.defaultFormatter": "Shopify.theme-check-vscode", 7 | "editor.formatOnSave": true 8 | }, 9 | "editor.formatOnSave": true 10 | } 11 | -------------------------------------------------------------------------------- /_layouts/authors.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | 5 |
6 | {{ content }} 7 |
8 | 9 |
10 | {% for author in site.authors %} 11 |
12 | {% include author-media.html %} 13 |
14 | {% endfor %} 15 |
16 | -------------------------------------------------------------------------------- /_authors/dave.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Dave - web dev 3 | name: Dave Mc Dave 4 | position: Web Developer 5 | description: Dave is a web developer 6 | avatar: /img/dave.png 7 | facebook: https://www.facebook.com/ 8 | twitter: https://www.twitter.com/ 9 | github: https://www.github.com/ 10 | --- 11 | 12 | Dave is a web developer. This is a page all about Dave. 13 | -------------------------------------------------------------------------------- /_includes/google-analytics.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 12 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "artemis-blog-theme", 3 | "version": "1.0.0", 4 | "description": "Artemis Blog Theme for Jekyll sites", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1" 8 | }, 9 | "keywords": [ 10 | "jekyll" 11 | ], 12 | "author": "chrisrhymes", 13 | "license": "MIT", 14 | "dependencies": { 15 | "bulma": "^1.0" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /_layouts/blog.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | 5 | {{ content }} 6 | 7 |
8 |
9 | {% include pagination.html %} 10 |
11 | {% for post in paginator.posts %} 12 |
13 | {% include post-item.html %} 14 |
15 | {% endfor %} 16 |
17 | {% include pagination.html %} 18 |
19 |
-------------------------------------------------------------------------------- /_layouts/homepage.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 |
5 | {{ content }} 6 |
7 | 8 |
9 | {% assign post_width = '6|6|12|4|4|4' | split: '|' %} 10 | {% for post in paginator.posts limit: 6 %} 11 |
12 | {% include post-item.html %} 13 |
14 | {% endfor %} 15 | 16 |
17 | {% include pagination.html %} 18 |
19 |
20 | -------------------------------------------------------------------------------- /_includes/hero.html: -------------------------------------------------------------------------------- 1 |
7 |
8 |
9 |

{{ page.title }}

10 |

{{ page.subtitle }}

11 |
12 |
13 |
14 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: homepage 3 | title: Mere Blog Theme 4 | subtitle: This is the demo site for the Mere Blog Theme 5 | image: /img/home.jpg 6 | hero_image: /img/home.jpg 7 | hero_height: is-large 8 | --- 9 | 10 |

Mere Blog Theme

11 | 12 |

13 | Mere is a minimal and simple blog theme, and nothing more, for use with Jekyll 14 | and GitHub Pages. 15 |

16 | 17 |

18 | This is the homepage, it has some space at the top to display your 19 | introduction text and then it displays the latest 6 posts below. 20 |

21 | -------------------------------------------------------------------------------- /_authors/guest.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Guest Author - web designer 3 | name: Guest Author 4 | position: Web Designer 5 | description: This is an example of a guest author 6 | avatar: /img/guest.png 7 | facebook: https://www.facebook.com/ 8 | twitter: https://www.twitter.com/ 9 | github: https://www.github.com/ 10 | --- 11 | 12 | This is an example page for a guest author and how the page could look. 13 | 14 | Add as much content about the guest author and why not link back to their blog from here by setting the `website: http://www.example.com` in the page's front matter. 15 | -------------------------------------------------------------------------------- /_sass/_layout.scss: -------------------------------------------------------------------------------- 1 | .content { 2 | ul.pagination-list { 3 | list-style: none; 4 | margin-left: 0; 5 | margin-top: 0; 6 | 7 | li + li { 8 | margin-top: 0; 9 | } 10 | } 11 | } 12 | 13 | div.highlight { 14 | margin-bottom: 1rem; 15 | } 16 | 17 | @include desktop { 18 | .navbar-item { 19 | &.is-hoverable:hover { 20 | .navbar-dropdown { 21 | display: block; 22 | } 23 | } 24 | } 25 | } 26 | 27 | a:not(.button) { 28 | text-decoration: underline; 29 | 30 | &:hover { 31 | text-decoration-style: dotted; 32 | } 33 | } 34 | 35 | .avatar-link { 36 | display: inline-block; 37 | &:hover, 38 | &:focus { 39 | outline: 1px solid $link; 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /_includes/post-item.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | {{ post.title }} 4 |
5 |
6 |
7 | 8 |

9 | {{ post.title }} 10 |

11 | 12 | 13 |

Published {{ post.date | date: '%b %-d, %Y' }} by {{ post.author }}

14 |

{{ post.excerpt | strip_html | strip_newlines | truncate: 200 }}

15 |
16 |
17 |
18 | Read more 19 |
20 |
21 | -------------------------------------------------------------------------------- /_includes/navbar.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | 5 | {{ site.title }} 6 | 7 | 12 |
13 | 20 |
21 |
22 | -------------------------------------------------------------------------------- /_layouts/default.html: -------------------------------------------------------------------------------- 1 | 2 | 6 | {% include head.html %} 7 | 8 | {% include navbar.html %} 9 | {% unless page.hide_hero %} 10 | {% include hero.html %} 11 | {% endunless %} 12 |
13 |
14 | {{ content }} 15 |
16 |
17 |
18 |
19 |
20 |

Theme built by C.S. Rhymes

21 |
22 |
23 |
24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /_includes/head.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | {{ page.title }} 6 | - 7 | {{ site.title }} 8 | 9 | 10 | 11 | 18 | {% seo %} 19 | {%- if site.google_analytics -%} 20 | {%- include google-analytics.html -%} 21 | {%- endif -%} 22 | {%- include head-scripts.html -%} 23 | 24 | -------------------------------------------------------------------------------- /assets/js/app.js: -------------------------------------------------------------------------------- 1 | document.addEventListener("DOMContentLoaded", () => { 2 | // Get all "navbar-burger" elements 3 | const $navbarBurgers = Array.prototype.slice.call( 4 | document.querySelectorAll(".navbar-burger"), 5 | 0 6 | ); 7 | 8 | // Check if there are any navbar burgers 9 | if ($navbarBurgers.length > 0) { 10 | // Add a click event on each of them 11 | $navbarBurgers.forEach((el) => { 12 | el.addEventListener("click", () => { 13 | // Get the target from the "data-target" attribute 14 | const target = el.dataset.target; 15 | const $target = document.getElementById(target); 16 | 17 | // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu" 18 | el.classList.toggle("is-active"); 19 | $target.classList.toggle("is-active"); 20 | }); 21 | }); 22 | } 23 | }); 24 | -------------------------------------------------------------------------------- /_includes/author-media.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 | 6 |

7 | {% if author.avatar %} 8 | {{ author.name }} 9 | {% else %} 10 | 11 | {% endif %} 12 |

13 | 14 |
15 |
16 | 17 |

{{ author.name }}

18 | 19 | 20 |

{{ author.position }}

21 |
22 |

{{ author.description }}

23 |
24 |
25 |
26 |
27 |
28 | -------------------------------------------------------------------------------- /_authors/chris.md: -------------------------------------------------------------------------------- 1 | --- 2 | short_name: C.S. Rhymes 3 | title: C.S. Rhymes - web dev and author 4 | name: C.S. Rhymes 5 | position: Web Designer 6 | description: C.S. Rhymes is a web developer and a part time author, specialising in Laravel, Vue.js and developing Jekyll themes. 7 | avatar: /img/avatar.png 8 | website: https://www.csrhymes.com 9 | facebook: https://www.facebook.com/ 10 | twitter: https://www.twitter.com/chrisrhymes 11 | github: https://www.github.com/chrisrhymes 12 | gitlab: https://www.gitlab.com 13 | instagram: https://www.instagram.com 14 | linkedin: https://www.linkedin.com/in/chris-rhymes-a6a85971 15 | medium: https://www.medium.com/@chrisrhymes 16 | stack_overflow: https://stackoverflow.com/ 17 | --- 18 | 19 | C.S. Rhymes is a web developer and a part time author, specialising in Laravel, Vue.js and developing Jekyll themes. 20 | 21 | This theme was built by C.S. Rhymes as well as the [Bulma Clean Theme](https://www.csrhymes.com/bulma-clean-theme). 22 | -------------------------------------------------------------------------------- /_sass/_main.scss: -------------------------------------------------------------------------------- 1 | @charset "utf-8"; 2 | 3 | // Fonts 4 | @import url("https://fonts.googleapis.com/css?family=Open+Sans|Righteous&display=swap"); 5 | $family-sans-serif: "Open Sans", sans-serif; 6 | $family-serif: "Righteous", cursive; 7 | $family-primary: $family-sans-serif; 8 | $family-secondary: $family-serif; 9 | $title-family: $family-secondary; 10 | 11 | // Colours 12 | $primary: #4fa6a3 !default; 13 | $dark: #363636; 14 | $light: #f6f6f6; 15 | $white: #ffffff; 16 | 17 | //Cards 18 | $card-radius: 2px; 19 | // $card-shadow: none; 20 | // $card-footer-border-top: none; 21 | // $card-background-color: $light; 22 | 23 | // Pagination 24 | // $pagination-focus-border-color: $dark; 25 | // $pagination-current-color: $white; 26 | // $pagination-current-background-color: $dark; 27 | // $pagination-current-border-color: $dark; 28 | 29 | // Radius 30 | $radius: 2px; 31 | $radius-large: 2px; 32 | $radius-small: 2px; 33 | 34 | @import "../node_modules/bulma/sass"; 35 | @import "../node_modules/bulma/sass/utilities/mixins"; 36 | @import "layout"; 37 | @import "syntax"; 38 | @import "intro"; 39 | -------------------------------------------------------------------------------- /_posts/2019-09-05-sixth-post.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Post with Intro 4 | author: Guest Author 5 | description: This is a post with an introduction image and text 6 | intro: This is the introduction text for this post. It appears large and bold at the top of the post! 7 | intro_image: https://picsum.photos/id/112/1200/800 8 | intro_image_ratio: is-16by9 9 | image: https://picsum.photos/id/109/1200/800 10 | --- 11 | 12 | Version 0.3 allows you to provide a intro and an intro image. When creating your post add a short `intro` text an `intro_image` as a path to an image and then specify the `intro_image_ratio` which should be a [Bulma image](https://bulma.io/documentation/elements/image/) class. 13 | 14 | ```yaml 15 | layout: post 16 | title: Post with Intro 17 | author: Guest Author 18 | intro: This is the introduction text for this post. It appears large and bold at the top of the post 19 | intro_image: /img/home.jpg 20 | intro_image_ratio: is-16by9 21 | ``` 22 | 23 | Only the intro is required if you want to display it. If you don't want an image then don't specify one and just the intro text will display. 24 | -------------------------------------------------------------------------------- /LICENSE.txt: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2019 chrisrhymes 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /mere-blog-theme.gemspec: -------------------------------------------------------------------------------- 1 | # frozen_string_literal: true 2 | 3 | Gem::Specification.new do |spec| 4 | spec.name = "mere-blog-theme" 5 | spec.version = "1.0.1" 6 | spec.authors = ["chrisrhymes"] 7 | spec.email = ["csrhymes@gmail.com"] 8 | 9 | spec.summary = "Mere is a minimal and simple blog theme, and nothing more, for use with Jekyll and GitHub Pages." 10 | spec.homepage = "https://github.com/chrisrhymes/mere-blog-theme" 11 | spec.license = "MIT" 12 | 13 | spec.files = `git ls-files -z`.split("\x0").select { |f| f.match(%r!^(assets|_layouts|_includes|_sass|LICENSE|README|package|node_modules)!i) } 14 | 15 | spec.add_runtime_dependency "jekyll", ">= 4.3", "< 5.0" 16 | spec.add_runtime_dependency "jekyll-feed", "~> 0.15" 17 | spec.add_runtime_dependency "jekyll-sitemap", "~> 1.4" 18 | spec.add_runtime_dependency "jekyll-paginate", "~> 1.1" 19 | spec.add_runtime_dependency "jekyll-seo-tag", "~> 2.7" 20 | spec.add_runtime_dependency "kramdown-parser-gfm", "~> 1.1" 21 | 22 | spec.add_development_dependency "bundler", "~> 2.0" 23 | spec.add_development_dependency "rake", "~> 12.0" 24 | end 25 | -------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | # Site Settings 2 | title: Mere Blog Theme 3 | tagline: Mere Blog Theme 4 | email: your-email@domain.com 5 | description: > 6 | The demo site for Mere Blog Theme, made for Jekyll and GitHub pages websites 7 | baseurl: "/mere-blog-theme" 8 | url: "https://www.csrhymes.com" 9 | permalink: pretty 10 | force_theme: light 11 | 12 | paginate: 6 13 | paginate_path: "/page:num" 14 | 15 | plugins: 16 | - jekyll-sitemap 17 | - jekyll-paginate 18 | - jekyll-feed 19 | - jekyll-seo-tag 20 | - kramdown 21 | - rouge 22 | 23 | exclude: 24 | - Gemfile 25 | - clean-theme.gemspec 26 | - Gemfile.lock 27 | - node_modules 28 | - vendor/bundle/ 29 | - vendor/cache/ 30 | - vendor/gems/ 31 | - vendor/ruby/ 32 | 33 | livereload: true 34 | 35 | sass: 36 | style: compressed 37 | source_dir: _sass 38 | 39 | defaults: 40 | - scope: 41 | path: "" 42 | type: "posts" 43 | values: 44 | author: "C.S. Rhymes" 45 | layout: post 46 | image: /img/home.jpg 47 | show_sidebar: true 48 | - scope: 49 | path: "" 50 | type: "authors" 51 | values: 52 | layout: "author" 53 | 54 | collections: 55 | authors: 56 | output: true 57 | -------------------------------------------------------------------------------- /_layouts/post.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | {% if page.intro %} 5 |
6 |
7 | {% if page.intro_image %} 8 |
9 |
10 | {{ page.title }} 11 |
12 |
13 | {% endif %} 14 |
15 |

{{ page.intro }}

16 |
17 |
18 |
19 | {% endif %} 20 | 21 |
22 |
23 |
24 |

25 | Published: {{ page.date | date: '%b %-d, %Y' }} by {{ page.author }} 26 |

27 | {{ content }} 28 |
29 | 30 |
31 | {% for tag in page.tags %} 32 | {{ tag }} 33 | {% endfor %} 34 |
35 |
36 |
37 | {% assign author = site.authors | where: 'name', page.author | first %} 38 | {% if author %} 39 | {% include author-media.html %} 40 | {% endif %} 41 |
42 |
43 | -------------------------------------------------------------------------------- /_includes/social-buttons.html: -------------------------------------------------------------------------------- 1 |
2 | {% if page.facebook %} 3 | 4 | 5 | 6 | {% endif %} 7 | 8 | {% if page.twitter %} 9 | 10 | 11 | 12 | {% endif %} 13 | 14 | {% if page.github %} 15 | 16 | 17 | 18 | {% endif %} 19 | 20 | {% if page.gitlab %} 21 | 22 | 23 | 24 | {% endif %} 25 | 26 | {% if page.instagram %} 27 | 28 | 29 | 30 | {% endif %} 31 | 32 | {% if page.linkedin %} 33 | 34 | 35 | 36 | {% endif %} 37 | 38 | {% if page.medium %} 39 | 40 | 41 | 42 | {% endif %} 43 | 44 | {% if page.stack_overflow %} 45 | 46 | 47 | 48 | {% endif %} 49 |
50 | -------------------------------------------------------------------------------- /_includes/pagination.html: -------------------------------------------------------------------------------- 1 | 44 | -------------------------------------------------------------------------------- /_layouts/author.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | {% assign page.title = page.name %} 5 | 6 |
7 |
8 | {% if page.avatar %} 9 |

10 | {{ page.name }} 11 |

12 | {% else %} 13 |
14 | 15 |
16 | {% endif %} 17 |
18 |
19 |
20 |
21 |

{{ page.name }}

22 |

{{ page.position }}

23 |
24 | 25 | {% if page.website %} 26 |
27 |

28 | {{ page.website }} 29 |

30 |
31 | {% endif %} 32 |
33 | {% include social-buttons.html %} 34 |
35 |
36 |
37 | {{ content }} 38 |
39 |
40 |
41 |

Latest Posts

42 |
43 | 44 | {% assign filtered_posts = site.posts | where: 'author', page.name %} 45 | {% for post in filtered_posts limit: 4 %} 46 |
47 |
48 |
49 | 50 |

{{ post.title }}

51 | 52 | 53 |
54 |

Published {{ post.date | date: '%b %-d, %Y' }} by {{ post.author }}

55 |

{{ post.excerpt | strip_html | strip_newlines | truncate: 100 }}

56 |
57 |
58 | 59 |
60 | Read more 61 |
62 |
63 |
64 | {% endfor %} 65 |
66 |
67 |
68 | -------------------------------------------------------------------------------- /.github/workflows/jekyll-build-deploy.yml: -------------------------------------------------------------------------------- 1 | # This workflow uses actions that are not certified by GitHub. 2 | # They are provided by a third-party and are governed by 3 | # separate terms of service, privacy policy, and support 4 | # documentation. 5 | 6 | # Sample workflow for building and deploying a Jekyll site to GitHub Pages 7 | name: Build and Deploy Jekyll site to Pages 8 | 9 | on: 10 | # Runs on pushes targeting the default branch 11 | push: 12 | branches: [master] 13 | 14 | # Allows you to run this workflow manually from the Actions tab 15 | workflow_dispatch: 16 | 17 | # Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages 18 | permissions: 19 | contents: read 20 | pages: write 21 | id-token: write 22 | 23 | # Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued. 24 | # However, do NOT cancel in-progress runs as we want to allow these production deployments to complete. 25 | concurrency: 26 | group: "pages" 27 | cancel-in-progress: false 28 | 29 | jobs: 30 | # Build job 31 | build: 32 | runs-on: ubuntu-latest 33 | steps: 34 | - name: Checkout 35 | uses: actions/checkout@v4 36 | - name: Setup Ruby 37 | uses: ruby/setup-ruby@v1 38 | with: 39 | ruby-version: "3.1" # Not needed with a .ruby-version file 40 | bundler-cache: true # runs 'bundle install' and caches installed gems automatically 41 | cache-version: 0 # Increment this number if you need to re-download cached gems 42 | - name: Setup Pages 43 | id: pages 44 | uses: actions/configure-pages@v5 45 | - name: Build with Jekyll 46 | # Outputs to the './_site' directory by default 47 | run: bundle exec jekyll build --baseurl "${{ steps.pages.outputs.base_path }}" 48 | env: 49 | JEKYLL_ENV: production 50 | - name: Upload artifact 51 | # Automatically uploads an artifact from the './_site' directory by default 52 | uses: actions/upload-pages-artifact@v3 53 | 54 | # Deployment job 55 | deploy: 56 | environment: 57 | name: github-pages 58 | url: ${{ steps.deployment.outputs.page_url }} 59 | runs-on: ubuntu-latest 60 | needs: build 61 | steps: 62 | - name: Deploy to GitHub Pages 63 | id: deployment 64 | uses: actions/deploy-pages@v4 65 | -------------------------------------------------------------------------------- /_posts/2019-08-31-first-post.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: First Post 4 | image: /img/home.jpg 5 | --- 6 | 7 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elit eros, porta eget dapibus vitae, tempus et mi. Maecenas sollicitudin ligula vel metus condimentum, ac commodo sem vestibulum. Morbi tempus dui sapien, vel mattis orci faucibus id. Nulla congue elit vel accumsan mattis. Ut vel dolor porttitor, laoreet risus in, tempus velit. Praesent eu nisi enim. Integer sed venenatis risus, eget semper sapien. Nulla at lacinia lectus. Sed rutrum lectus at vestibulum tristique. Cras ex sem, consequat at dapibus scelerisque, iaculis sit amet tellus. Fusce eu orci ut ex consequat semper. Mauris pharetra dictum dui, vestibulum egestas erat. 8 | 9 | Aliquam diam eros, maximus non consectetur sed, faucibus et risus. Morbi quis velit ultrices, ultrices magna ut, pretium mauris. Sed interdum dolor augue, in ultrices tellus rutrum eu. Donec a tellus gravida, imperdiet sapien et, mollis nibh. Aenean at diam eu diam gravida malesuada. In egestas est arcu, porttitor luctus orci dapibus eu. Maecenas ac justo quam. Sed blandit hendrerit massa, vel semper augue sagittis consequat. Aliquam non finibus massa, a semper est. Etiam ornare elit sed vestibulum semper. Nunc nec blandit augue. Etiam molestie massa et justo luctus sagittis. Suspendisse tincidunt maximus tellus non iaculis. Proin ut sodales magna. Integer cursus orci sit amet diam vehicula molestie. Nam luctus arcu a consequat blandit. 10 | 11 | Nunc accumsan, leo eget porta auctor, odio augue consectetur lectus, sit amet laoreet nibh ex vitae orci. Aliquam erat volutpat. Nunc ultricies magna sem, vitae rhoncus augue commodo vitae. Suspendisse commodo nisl dui, eu maximus tortor rhoncus sit amet. Nulla facilisi. Mauris condimentum massa rhoncus, tempus risus sit amet, elementum turpis. Etiam quis urna tempus, tempus ipsum in, egestas arcu. Duis nibh nibh, vulputate sed fringilla pellentesque, hendrerit at lorem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Phasellus elementum ultrices ultrices. Quisque ac erat pharetra ipsum imperdiet rhoncus. Donec fermentum ante nec scelerisque tempus. Proin at aliquam orci. Quisque interdum nibh eu justo cursus egestas. Integer sed est turpis. 12 | 13 | Aenean nec erat a sapien ornare tincidunt. Nam at lorem nunc. Praesent euismod hendrerit diam in pulvinar. Integer vulputate ligula ut commodo vehicula. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed ut turpis in lacus vestibulum rhoncus sed eget arcu. Donec sit amet venenatis est, vitae varius diam. Etiam at dictum ligula. Nullam id turpis sem. Phasellus ut pellentesque risus. Maecenas ultricies dolor a nisi pretium, quis tempor sem pharetra. 14 | -------------------------------------------------------------------------------- /_posts/2019-09-01-second-post.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Second Post 4 | image: https://picsum.photos/id/57/1200/800 5 | --- 6 | 7 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elit eros, porta eget dapibus vitae, tempus et mi. Maecenas sollicitudin ligula vel metus condimentum, ac commodo sem vestibulum. Morbi tempus dui sapien, vel mattis orci faucibus id. Nulla congue elit vel accumsan mattis. Ut vel dolor porttitor, laoreet risus in, tempus velit. Praesent eu nisi enim. Integer sed venenatis risus, eget semper sapien. Nulla at lacinia lectus. Sed rutrum lectus at vestibulum tristique. Cras ex sem, consequat at dapibus scelerisque, iaculis sit amet tellus. Fusce eu orci ut ex consequat semper. Mauris pharetra dictum dui, vestibulum egestas erat. 8 | 9 | Aliquam diam eros, maximus non consectetur sed, faucibus et risus. Morbi quis velit ultrices, ultrices magna ut, pretium mauris. Sed interdum dolor augue, in ultrices tellus rutrum eu. Donec a tellus gravida, imperdiet sapien et, mollis nibh. Aenean at diam eu diam gravida malesuada. In egestas est arcu, porttitor luctus orci dapibus eu. Maecenas ac justo quam. Sed blandit hendrerit massa, vel semper augue sagittis consequat. Aliquam non finibus massa, a semper est. Etiam ornare elit sed vestibulum semper. Nunc nec blandit augue. Etiam molestie massa et justo luctus sagittis. Suspendisse tincidunt maximus tellus non iaculis. Proin ut sodales magna. Integer cursus orci sit amet diam vehicula molestie. Nam luctus arcu a consequat blandit. 10 | 11 | Nunc accumsan, leo eget porta auctor, odio augue consectetur lectus, sit amet laoreet nibh ex vitae orci. Aliquam erat volutpat. Nunc ultricies magna sem, vitae rhoncus augue commodo vitae. Suspendisse commodo nisl dui, eu maximus tortor rhoncus sit amet. Nulla facilisi. Mauris condimentum massa rhoncus, tempus risus sit amet, elementum turpis. Etiam quis urna tempus, tempus ipsum in, egestas arcu. Duis nibh nibh, vulputate sed fringilla pellentesque, hendrerit at lorem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Phasellus elementum ultrices ultrices. Quisque ac erat pharetra ipsum imperdiet rhoncus. Donec fermentum ante nec scelerisque tempus. Proin at aliquam orci. Quisque interdum nibh eu justo cursus egestas. Integer sed est turpis. 12 | 13 | Aenean nec erat a sapien ornare tincidunt. Nam at lorem nunc. Praesent euismod hendrerit diam in pulvinar. Integer vulputate ligula ut commodo vehicula. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed ut turpis in lacus vestibulum rhoncus sed eget arcu. Donec sit amet venenatis est, vitae varius diam. Etiam at dictum ligula. Nullam id turpis sem. Phasellus ut pellentesque risus. Maecenas ultricies dolor a nisi pretium, quis tempor sem pharetra. 14 | -------------------------------------------------------------------------------- /_posts/2019-09-02-third-post.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Third Post 4 | image: https://picsum.photos/id/66/1200/800 5 | --- 6 | 7 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elit eros, porta eget dapibus vitae, tempus et mi. Maecenas sollicitudin ligula vel metus condimentum, ac commodo sem vestibulum. Morbi tempus dui sapien, vel mattis orci faucibus id. Nulla congue elit vel accumsan mattis. Ut vel dolor porttitor, laoreet risus in, tempus velit. Praesent eu nisi enim. Integer sed venenatis risus, eget semper sapien. Nulla at lacinia lectus. Sed rutrum lectus at vestibulum tristique. Cras ex sem, consequat at dapibus scelerisque, iaculis sit amet tellus. Fusce eu orci ut ex consequat semper. Mauris pharetra dictum dui, vestibulum egestas erat. 8 | 9 | Aliquam diam eros, maximus non consectetur sed, faucibus et risus. Morbi quis velit ultrices, ultrices magna ut, pretium mauris. Sed interdum dolor augue, in ultrices tellus rutrum eu. Donec a tellus gravida, imperdiet sapien et, mollis nibh. Aenean at diam eu diam gravida malesuada. In egestas est arcu, porttitor luctus orci dapibus eu. Maecenas ac justo quam. Sed blandit hendrerit massa, vel semper augue sagittis consequat. Aliquam non finibus massa, a semper est. Etiam ornare elit sed vestibulum semper. Nunc nec blandit augue. Etiam molestie massa et justo luctus sagittis. Suspendisse tincidunt maximus tellus non iaculis. Proin ut sodales magna. Integer cursus orci sit amet diam vehicula molestie. Nam luctus arcu a consequat blandit. 10 | 11 | Nunc accumsan, leo eget porta auctor, odio augue consectetur lectus, sit amet laoreet nibh ex vitae orci. Aliquam erat volutpat. Nunc ultricies magna sem, vitae rhoncus augue commodo vitae. Suspendisse commodo nisl dui, eu maximus tortor rhoncus sit amet. Nulla facilisi. Mauris condimentum massa rhoncus, tempus risus sit amet, elementum turpis. Etiam quis urna tempus, tempus ipsum in, egestas arcu. Duis nibh nibh, vulputate sed fringilla pellentesque, hendrerit at lorem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Phasellus elementum ultrices ultrices. Quisque ac erat pharetra ipsum imperdiet rhoncus. Donec fermentum ante nec scelerisque tempus. Proin at aliquam orci. Quisque interdum nibh eu justo cursus egestas. Integer sed est turpis. 12 | 13 | Aenean nec erat a sapien ornare tincidunt. Nam at lorem nunc. Praesent euismod hendrerit diam in pulvinar. Integer vulputate ligula ut commodo vehicula. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed ut turpis in lacus vestibulum rhoncus sed eget arcu. Donec sit amet venenatis est, vitae varius diam. Etiam at dictum ligula. Nullam id turpis sem. Phasellus ut pellentesque risus. Maecenas ultricies dolor a nisi pretium, quis tempor sem pharetra. 14 | -------------------------------------------------------------------------------- /_posts/2019-09-03-fourth-post.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Fourth Post 4 | image: https://picsum.photos/id/62/1200/800 5 | --- 6 | 7 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elit eros, porta eget dapibus vitae, tempus et mi. Maecenas sollicitudin ligula vel metus condimentum, ac commodo sem vestibulum. Morbi tempus dui sapien, vel mattis orci faucibus id. Nulla congue elit vel accumsan mattis. Ut vel dolor porttitor, laoreet risus in, tempus velit. Praesent eu nisi enim. Integer sed venenatis risus, eget semper sapien. Nulla at lacinia lectus. Sed rutrum lectus at vestibulum tristique. Cras ex sem, consequat at dapibus scelerisque, iaculis sit amet tellus. Fusce eu orci ut ex consequat semper. Mauris pharetra dictum dui, vestibulum egestas erat. 8 | 9 | ## Example heading 2 10 | 11 | Aliquam diam eros, maximus non consectetur sed, faucibus et risus. Morbi quis velit ultrices, ultrices magna ut, pretium mauris. Sed interdum dolor augue, in ultrices tellus rutrum eu. Donec a tellus gravida, imperdiet sapien et, mollis nibh. Aenean at diam eu diam gravida malesuada. In egestas est arcu, porttitor luctus orci dapibus eu. Maecenas ac justo quam. Sed blandit hendrerit massa, vel semper augue sagittis consequat. Aliquam non finibus massa, a semper est. Etiam ornare elit sed vestibulum semper. Nunc nec blandit augue. Etiam molestie massa et justo luctus sagittis. Suspendisse tincidunt maximus tellus non iaculis. Proin ut sodales magna. Integer cursus orci sit amet diam vehicula molestie. Nam luctus arcu a consequat blandit. 12 | 13 | ### Example heading 3 14 | 15 | Nunc accumsan, leo eget porta auctor, odio augue consectetur lectus, sit amet laoreet nibh ex vitae orci. Aliquam erat volutpat. Nunc ultricies magna sem, vitae rhoncus augue commodo vitae. Suspendisse commodo nisl dui, eu maximus tortor rhoncus sit amet. Nulla facilisi. Mauris condimentum massa rhoncus, tempus risus sit amet, elementum turpis. Etiam quis urna tempus, tempus ipsum in, egestas arcu. Duis nibh nibh, vulputate sed fringilla pellentesque, hendrerit at lorem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Phasellus elementum ultrices ultrices. Quisque ac erat pharetra ipsum imperdiet rhoncus. Donec fermentum ante nec scelerisque tempus. Proin at aliquam orci. Quisque interdum nibh eu justo cursus egestas. Integer sed est turpis. 16 | 17 | ## Example heading 2 18 | 19 | Aenean nec erat a sapien ornare tincidunt. Nam at lorem nunc. Praesent euismod hendrerit diam in pulvinar. Integer vulputate ligula ut commodo vehicula. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed ut turpis in lacus vestibulum rhoncus sed eget arcu. Donec sit amet venenatis est, vitae varius diam. Etiam at dictum ligula. Nullam id turpis sem. Phasellus ut pellentesque risus. Maecenas ultricies dolor a nisi pretium, quis tempor sem pharetra. 20 | -------------------------------------------------------------------------------- /_posts/2019-09-04-fifth-post.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Fifth Post 4 | author: Dave Mc Dave 5 | intro: This is the intro for this post. This post has no intro image, just text 6 | image: https://picsum.photos/id/95/1200/800 7 | --- 8 | 9 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elit eros, porta eget dapibus vitae, tempus et mi. Maecenas sollicitudin ligula vel metus condimentum, ac commodo sem vestibulum. Morbi tempus dui sapien, vel mattis orci faucibus id. Nulla congue elit vel accumsan mattis. Ut vel dolor porttitor, laoreet risus in, tempus velit. Praesent eu nisi enim. Integer sed venenatis risus, eget semper sapien. Nulla at lacinia lectus. Sed rutrum lectus at vestibulum tristique. Cras ex sem, consequat at dapibus scelerisque, iaculis sit amet tellus. Fusce eu orci ut ex consequat semper. Mauris pharetra dictum dui, vestibulum egestas erat. 10 | 11 | Aliquam diam eros, maximus non consectetur sed, faucibus et risus. Morbi quis velit ultrices, ultrices magna ut, pretium mauris. Sed interdum dolor augue, in ultrices tellus rutrum eu. Donec a tellus gravida, imperdiet sapien et, mollis nibh. Aenean at diam eu diam gravida malesuada. In egestas est arcu, porttitor luctus orci dapibus eu. Maecenas ac justo quam. Sed blandit hendrerit massa, vel semper augue sagittis consequat. Aliquam non finibus massa, a semper est. Etiam ornare elit sed vestibulum semper. Nunc nec blandit augue. Etiam molestie massa et justo luctus sagittis. Suspendisse tincidunt maximus tellus non iaculis. Proin ut sodales magna. Integer cursus orci sit amet diam vehicula molestie. Nam luctus arcu a consequat blandit. 12 | 13 | Nunc accumsan, leo eget porta auctor, odio augue consectetur lectus, sit amet laoreet nibh ex vitae orci. Aliquam erat volutpat. Nunc ultricies magna sem, vitae rhoncus augue commodo vitae. Suspendisse commodo nisl dui, eu maximus tortor rhoncus sit amet. Nulla facilisi. Mauris condimentum massa rhoncus, tempus risus sit amet, elementum turpis. Etiam quis urna tempus, tempus ipsum in, egestas arcu. Duis nibh nibh, vulputate sed fringilla pellentesque, hendrerit at lorem. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Phasellus elementum ultrices ultrices. Quisque ac erat pharetra ipsum imperdiet rhoncus. Donec fermentum ante nec scelerisque tempus. Proin at aliquam orci. Quisque interdum nibh eu justo cursus egestas. Integer sed est turpis. 14 | 15 | Aenean nec erat a sapien ornare tincidunt. Nam at lorem nunc. Praesent euismod hendrerit diam in pulvinar. Integer vulputate ligula ut commodo vehicula. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed ut turpis in lacus vestibulum rhoncus sed eget arcu. Donec sit amet venenatis est, vitae varius diam. Etiam at dictum ligula. Nullam id turpis sem. Phasellus ut pellentesque risus. Maecenas ultricies dolor a nisi pretium, quis tempor sem pharetra. 16 | -------------------------------------------------------------------------------- /_sass/syntax.scss: -------------------------------------------------------------------------------- 1 | .highlight table td { 2 | padding: 5px; 3 | } 4 | .highlight table pre { 5 | margin: 0; 6 | } 7 | .highlight .cm { 8 | color: #999988; 9 | font-style: italic; 10 | } 11 | .highlight .cp { 12 | color: #999999; 13 | font-weight: bold; 14 | } 15 | .highlight .c1 { 16 | color: #999988; 17 | font-style: italic; 18 | } 19 | .highlight .cs { 20 | color: #999999; 21 | font-weight: bold; 22 | font-style: italic; 23 | } 24 | .highlight .c, 25 | .highlight .cd { 26 | color: #999988; 27 | font-style: italic; 28 | } 29 | .highlight .err { 30 | color: #a61717; 31 | background-color: #e3d2d2; 32 | } 33 | .highlight .gd { 34 | color: #000000; 35 | background-color: #ffdddd; 36 | } 37 | .highlight .ge { 38 | color: #000000; 39 | font-style: italic; 40 | } 41 | .highlight .gr { 42 | color: #aa0000; 43 | } 44 | .highlight .gh { 45 | color: #999999; 46 | } 47 | .highlight .gi { 48 | color: #000000; 49 | background-color: #ddffdd; 50 | } 51 | .highlight .go { 52 | color: #888888; 53 | } 54 | .highlight .gp { 55 | color: #555555; 56 | } 57 | .highlight .gs { 58 | font-weight: bold; 59 | } 60 | .highlight .gu { 61 | color: #aaaaaa; 62 | } 63 | .highlight .gt { 64 | color: #aa0000; 65 | } 66 | .highlight .kc { 67 | color: #000000; 68 | font-weight: bold; 69 | } 70 | .highlight .kd { 71 | color: #000000; 72 | font-weight: bold; 73 | } 74 | .highlight .kn { 75 | color: #000000; 76 | font-weight: bold; 77 | } 78 | .highlight .kp { 79 | color: #000000; 80 | font-weight: bold; 81 | } 82 | .highlight .kr { 83 | color: #000000; 84 | font-weight: bold; 85 | } 86 | .highlight .kt { 87 | color: #445588; 88 | font-weight: bold; 89 | } 90 | .highlight .k, 91 | .highlight .kv { 92 | color: #000000; 93 | font-weight: bold; 94 | } 95 | .highlight .mf { 96 | color: #009999; 97 | } 98 | .highlight .mh { 99 | color: #009999; 100 | } 101 | .highlight .il { 102 | color: #009999; 103 | } 104 | .highlight .mi { 105 | color: #009999; 106 | } 107 | .highlight .mo { 108 | color: #009999; 109 | } 110 | .highlight .m, 111 | .highlight .mb, 112 | .highlight .mx { 113 | color: #009999; 114 | } 115 | .highlight .sb { 116 | color: #d14; 117 | } 118 | .highlight .sc { 119 | color: #d14; 120 | } 121 | .highlight .sd { 122 | color: #d14; 123 | } 124 | .highlight .s2 { 125 | color: #d14; 126 | } 127 | .highlight .se { 128 | color: #d14; 129 | } 130 | .highlight .sh { 131 | color: #d14; 132 | } 133 | .highlight .si { 134 | color: #d14; 135 | } 136 | .highlight .sx { 137 | color: #d14; 138 | } 139 | .highlight .sr { 140 | color: #009926; 141 | } 142 | .highlight .s1 { 143 | color: #d14; 144 | } 145 | .highlight .ss { 146 | color: #990073; 147 | } 148 | .highlight .s { 149 | color: #d14; 150 | } 151 | .highlight .na { 152 | color: #008080; 153 | } 154 | .highlight .bp { 155 | color: #999999; 156 | } 157 | .highlight .nb { 158 | color: #0086b3; 159 | } 160 | .highlight .nc { 161 | color: #445588; 162 | font-weight: bold; 163 | } 164 | .highlight .no { 165 | color: #008080; 166 | } 167 | .highlight .nd { 168 | color: #3c5d5d; 169 | font-weight: bold; 170 | } 171 | .highlight .ni { 172 | color: #800080; 173 | } 174 | .highlight .ne { 175 | color: #990000; 176 | font-weight: bold; 177 | } 178 | .highlight .nf { 179 | color: #990000; 180 | font-weight: bold; 181 | } 182 | .highlight .nl { 183 | color: #990000; 184 | font-weight: bold; 185 | } 186 | .highlight .nn { 187 | color: #555555; 188 | } 189 | .highlight .nt { 190 | color: #000080; 191 | } 192 | .highlight .vc { 193 | color: #008080; 194 | } 195 | .highlight .vg { 196 | color: #008080; 197 | } 198 | .highlight .vi { 199 | color: #008080; 200 | } 201 | .highlight .nv { 202 | color: #008080; 203 | } 204 | .highlight .ow { 205 | color: #000000; 206 | font-weight: bold; 207 | } 208 | .highlight .o { 209 | color: #000000; 210 | font-weight: bold; 211 | } 212 | .highlight .w { 213 | color: #bbbbbb; 214 | } 215 | .highlight { 216 | background-color: #f8f8f8; 217 | } 218 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # mere-blog-theme 2 | 3 | [![Gem Version](https://badge.fury.io/rb/mere-blog-theme.svg)](https://badge.fury.io/rb/mere-blog-theme) 4 | ![Gem](https://img.shields.io/gem/dt/mere-blog-theme) 5 | 6 | Mere is a minimal and simple blog theme, and nothing more, for use with Jekyll and GitHub Pages. It has been built with the Bulma frontend framework. 7 | 8 | It has a homepage which displays the latest 6 posts and a paginated blog page used to list out all blog posts. 9 | 10 | **Mere Blog Theme uses Jekyll 4.3 for compatibility with Bulma v1** 11 | 12 | ## Installation 13 | 14 | Add this line to your Jekyll site's `Gemfile`: 15 | 16 | ```ruby 17 | gem "mere-blog-theme" 18 | ``` 19 | 20 | And add this line to your Jekyll site's `_config.yml`: 21 | 22 | ```yaml 23 | theme: mere-blog-theme 24 | ``` 25 | 26 | And then execute: 27 | 28 | $ bundle 29 | 30 | Or install it yourself as: 31 | 32 | $ gem install mere-blog-theme 33 | 34 | ## Upgrading to v1 35 | 36 | Version 1 of mere-blog-theme uses version 1 of Bulma. Bulma v1 has been updated to use dart sass and Jekyll was updated to use dart sass from version 4.3 and up, so this is now the minimum supported version of Jekyll for this theme. 37 | 38 | The standard build for GitHub pages only works with Jekyll 3.9, so you will need to migrate to using a GitHub action to build and deploy your site. 39 | 40 | Please read through the [Jekyll docs for GitHub Actions](https://jekyllrb.com/docs/continuous-integration/github-actions/) for more information. 41 | 42 | ## Usage 43 | 44 | - [Blog Setup](#blog-setup) 45 | - [Posts](#posts) 46 | - [Post Intro](#post-intro) 47 | - [Homepage](#homepage) 48 | - [Authors](#authors) 49 | - [Google Analytics](#google-analytics) 50 | - [Themes](#themes) 51 | 52 | ### Blog Setup 53 | 54 | As of 0.4, the blog posts will be displayed on the homepage including pagination, instead of in a separate blog page. 55 | 56 | **The homepage page needs to be called index.html for the blog pagination** 57 | 58 | Set the paginator up in the `_config.yml` file with the posts per page and the path to the blog. 59 | 60 | ```yaml 61 | paginate: 6 62 | paginate_path: "/page:num" 63 | ``` 64 | 65 | ### Posts 66 | 67 | Posts should be created in the `_posts` directory as per standard Jekyll usage. The front matter should contain the layout of post, the image to use in the header and the homepage / blog page, the title of the post and the author of the post. You can also set a subtitle for the post if you want to. 68 | 69 | ```yaml 70 | layout: post 71 | title: First Post 72 | image: /img/home.jpg 73 | author: C.S. Rhymes 74 | ``` 75 | 76 | Wide images will work best, with a minimum width of 1400px. 77 | 78 | #### Post Intro 79 | 80 | Version 0.3 allows you to provide a intro and an intro image in your frontmatter. When creating your post add a short `intro` text an `intro_image` as a path to an image and then specify the `intro_image_ratio` which should be a [Bulma image](https://bulma.io/documentation/elements/image/) class. 81 | 82 | ```yaml 83 | layout: post 84 | title: Post with Intro 85 | author: Guest Author 86 | intro: This is the introduction text for this post. It appears large and bold at the top of the post 87 | intro_image: /img/home.jpg 88 | intro_image_ratio: is-16by9 89 | ``` 90 | 91 | Only the intro is required if you want to display it. If you don't want an image then don't specify one and just the intro text will display. 92 | 93 | ### Homepage 94 | 95 | Finally, configure the homepage by creating an `index.html` page and configure the frontmatter with the layout of homepage, the title, subtitle (optional) and the image. You can set the hero_height to is-large if you want to make the homepage header a bit larger. 96 | 97 | ```yaml 98 | layout: homepage 99 | title: Mere Blog Theme 100 | subtitle: This is the demo site for the Mere Blog Theme 101 | image: /img/home.jpg 102 | hero_height: is-large 103 | ``` 104 | 105 | ### Authors 106 | 107 | To enable the authors section, create a directory named `_authors` and create a page for each author within it. The author pages should have front matter in the following format. 108 | 109 | **NOTE** The author name should match the author name in their posts exactly. 110 | 111 | ```yaml 112 | layout: author 113 | title: The authors page title 114 | name: Author Name 115 | position: Web Designer 116 | description: The short description of the author 117 | avatar: /img/avatar.png 118 | website: https://www.csrhymes.com 119 | ``` 120 | 121 | The website and avatar are optional, but if you are stuck for author images, why not try [https://getavataaars.com](https://getavataaars.com). Square images work best. You can then write about the author in the page content. 122 | 123 | Next, create an `authors.md` page in the root of your site and set the layout to authors. 124 | 125 | ```yaml 126 | layout: authors 127 | title: Authors 128 | description: The authors page 129 | ``` 130 | 131 | Add authors as a collection in your `_config.yml` file with output set to true so the pages are generated. 132 | 133 | ```yaml 134 | collections: 135 | authors: 136 | output: true 137 | ``` 138 | 139 | When you build your site, the authors link will appear in the navbar. The authors page will display the authors you have added. You can then click on their name or image to view the author page, along with a list of their 4 latest posts. 140 | 141 | There will also be a link back to the authors page at the bottom of the post. 142 | 143 | #### Author Social Profiles 144 | 145 | **New in 0.2.1 ** 146 | 147 | You can add links to an author's social profile pages by adding the profile name and link to the front matter in the author's page (such as `_authors/chris.md`). The below social profiles are available. 148 | 149 | ```yaml 150 | facebook: https://www.facebook.com/ 151 | twitter: https://www.twitter.com/ 152 | github: https://www.github.com/ 153 | gitlab: https://www.gitlab.com 154 | instagram: https://www.instagram.com 155 | linkedin: https://www.linkedin.com/ 156 | medium: https://www.medium.com/ 157 | stack_overflow: https://stackoverflow.com/ 158 | ``` 159 | 160 | ### Google Analytics 161 | 162 | To enable Google Analytics add `google_analytics: UA-xxxxxxxx` to your `_config.yml` replacing the UA-xxxxxxxx with your Google Analytics property. 163 | 164 | ### Themes 165 | 166 | Bulma v1 has a concept of themes and [automatic dark mode](https://bulma.io/documentation/features/dark-mode/). 167 | 168 | > Modern browsers come with a way to detect if a user has set their theme preference to light or dark by using the prefers-color-scheme keyword. 169 | 170 | To disable this behaviour and force a theme, set the `force_theme:` in the \_config.yml to either 'dark' or 'light'. 171 | 172 | ```yaml 173 | # _config.yml 174 | force_theme: light 175 | ``` 176 | 177 | ## Contributing 178 | 179 | Bug reports and pull requests are welcome on GitHub at https://github.com/chrisrhymes/mere-blog-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. 180 | 181 | ## Development 182 | 183 | To set up your environment to develop this theme, run `bundle install`. 184 | 185 | 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. 186 | 187 | When your theme is released, only the files in `_layouts`, `_includes`, `_sass` and `assets` tracked with Git will be bundled. 188 | To add a custom directory to your theme-gem, please edit the regexp in `mere-blog-theme.gemspec` accordingly. 189 | 190 | ## License 191 | 192 | The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT). 193 | --------------------------------------------------------------------------------