jekyll-theme-bean 1.0.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 8aacce50b854381ca8a6e9d138e949778c36c9a878ae84c782192712563d135a
+  data.tar.gz: 387cefe7f9cebe4a13e1b306d7b2ddf9bdb7ba651afafa02f06a152ca00b2f5d
+SHA512:
+  metadata.gz: 777ed1b83e801554ed41d6f9285e45da39baf6b853a9c739d09e3de598a5de588a38f3c61118dca5f7dc09156992c8e6faddcde29fec45198e9a0217aaa5e897
+  data.tar.gz: 179f18af7376c3063fd153db45e5adc26cdbea81d07eef013de49eab2aa2c00af352fe432722688dfc8c1371192124e57d9d312bfb60bb553b3cfb8b27134503

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2024 Arthur Freitas
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

data/README.md

@@ -0,0 +1,262 @@
+# Bean
+
+Bean, named after [the best Spore creature](https://spore.fandom.com/wiki/Bean) out there, is a Jekyll theme made to use in both [Esporo](https://esporo.net) and [Simulando](https://simulando.net) fansites. It can be used freely by anyone.
+
+Bean is colorful and customizable. You can change how it looks using CSS variables, you can add widgets to the sidebar or scripts easily.
+
+## Features
+
+- Make it yours with custom colors, typography and backgrounds.
+- Automatic light and dark themes!
+- Custom sidebar widgets and scripts with includes.
+- Support for [pagination](https://github.com/jekyll/jekyll-paginate), [sitemap](https://github.com/jekyll/jekyll-sitemap), [SEO tags](https://github.com/jekyll/jekyll-seo-tag) and [archives](https://github.com/jekyll/jekyll-archives) out of the box.
+- Translatable using [theme options](#configuration).
+
+## Installation
+
+### As a remote theme
+
+You can use this theme with the [`jekyll-remote-theme`](https://github.com/benbalter/jekyll-remote-theme) plugin.
+
+On your site repo, run:
+
+```bash
+$ bundle add jekyll-remote-theme
+```
+
+And add the following to your `_config.yml`:
+
+```yaml
+remote_theme: esporo/bean@latest
+
+plugins:
+  - jekyll-remote-theme
+```
+
+### As a gem-theme
+
+You can also use this theme as a gem-based dependency to your Jekyll site.
+
+Add this line to your Jekyll site's `Gemfile`:
+
+```ruby
+gem "bean"
+```
+
+And add this line to your Jekyll site's `_config.yml`:
+
+```yaml
+theme: bean
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install bean
+
+## Usage
+
+Your theme can be configured using your `_config.yml`. You can also customize the theme, sidebar widgets and site-wide scripts by adding them to your Jekyll setup.
+
+### Configuration
+
+This is an example of a `_config.yml` with all the options available to Bean.
+
+```yaml
+title: Your awesome title
+description: >-
+  Your blog description. It will be shown at the bottom of your website.
+tagline: A short-and-sweet tagline.
+
+lang: en
+logo: /path/to/your/logo.svg
+
+# Build settings
+permalink: "/:year/:month/:day/:title.html"
+slug_mode: latin
+
+# Theme Settings
+bean:
+  show_excerpts: true # this can also be set per-loop page.
+  copyright_notice: >-
+    Site built using [Bean](https://github.com/esporo/bean).
+  date_formats:
+    day: "%v"
+    month: "%B, %Y"
+    year: "%Y"
+  translations:
+    jump_to_navigation: "Go to navigation"
+    jump_to_content: "Go to content"
+    archive_date_title: "Posts from %s" # don't forget `%s`, it will be replaced by the date
+    archive_tag_title: "Posts with the tag “%s”" # don't forget `%s`, it will be replaced by the tag name.
+    archive_category_title: "Posts filed under “%s”" # don't forget `%s`, it will be replaced by the category name.
+    post_tagged_with: "Tagged with:"
+    blog_pagination_title: "Blog Pagination"
+    blog_pagination_next_page: "Older posts"
+    blog_pagination_prev_page: "Newer posts"
+  
+# Menus
+main_menu:
+  title: Navigate
+  items:
+    - label: Home
+      path: /
+    - label: About
+      path: /about/
+    - label: Bugs?
+      path: https://github.com/esporo/bean/issues
+    - label: Docs
+      path: hhttps://github.com/esporo/bean?tab=readme-ov-file#readme
+
+footer_menu:
+  title: Socials
+  items:
+    - label: Discord
+      path: https://discord.gg/
+    - label: YouTube
+      path: https://youtube.com/
+    - label: Facebook
+      path: https://www.facebook.com/
+```
+
+#### Plugins
+
+Bean adds support for pagination, archives, feeds and SEO tags, so you can configure the settings following these plugins docs:
+
+* [jekyll-paginate](https://jekyllrb.com/docs/pagination/)
+* [jekyll-archives](https://github.com/jekyll/jekyll-archives/blob/master/docs/configuration.md)
+* [jekyll-feed](https://github.com/jekyll/jekyll-feed?tab=readme-ov-file#usage)
+* [jekyll-seo-tag](https://github.com/jekyll/jekyll-seo-tag/blob/master/docs/usage.md)
+* [jekyll-sitemap](https://github.com/jekyll/jekyll-sitemap)
+
+#### Style Options
+
+You can add a `theme.css` in your `/assets/css` directory to customize the style options of your site.
+
+Just copy our [`theme.css`](https://github.com/esporo/bean/blob/main/assets/css/theme.css) and uncomment the lines of the variables you want to change, and you're good to go. Please note that background and color variables have different values for light and dark color schemes.
+
+`theme.css` is also a good place to add custom style rules as well, since it's the last stylesheet called by your theme. It will overwrite any rules set by default.
+
+You can also replace the fonts used in your theme by placing them in your `/assets/fonts` directory and declaring them on `/assets/fonts/fonts.css`.
+
+### Menus
+
+Bean has two menus available. One at the header and other at the bottom of your site. Both are set up in your `_config.yml`:
+
+```yaml
+main_menu:
+  title: Navigate
+  items:
+    - label: Home
+      path: /
+    - label: About
+      path: /about/
+    - label: Bugs?
+      path: https://github.com/esporo/bean/issues
+    - label: Docs
+      path: hhttps://github.com/esporo/bean?tab=readme-ov-file#readme
+
+footer_menu:
+  title: Socials
+  items:
+    - label: Discord
+      path: https://discord.gg/
+    - label: YouTube
+      path: https://youtube.com/
+    - label: GitHub
+      path: https://github.com/
+```
+
+A menu title is used by screen reader software. It's strongly recommended that you add one to your menus.
+
+### Includes
+
+You can customize parts of the theme by adding includes to your repo.
+
+There are three available includes for you to customize:
+
+* `_includes/below-post.html`: will add content to your post page after the post structure. Useful for comments or notices.
+* `_includes/widgets.html`: will add widgets to your blog sidebar. See [Sidebar](#sidebar) below.
+* `_includes/scripts.html` will add add site-wide scripts like Disqus and analytics stuff at the end of the `<body>` tag.
+
+### Sidebar
+
+Your blog sidebar can be customized by adding widgets to your `_includes/widgets.html`. The theme provides a default layout for widgets.
+
+You can do something like this:
+
+```html
+<!-- Your `_include/widgets.html` -->
+
+{% assign widget_title = "My beautiful widget" %}
+
+{% capture widget_content %}
+  <p>This will be shown in my website sidebar! It's useful for a blogroll, useful links, etc.</p>
+{% endcapture %}
+
+{% include blog/widget.html title=widget_title content=widget_content %}
+```
+
+You can as many widgets as you want, just repeat the process above.
+
+The sidebar can be hidden in a page with the `page` layout. Just add it to your front-matter:
+
+```yml
+---
+layout: page
+title: About
+hide_sidebar: true
+---
+```
+
+### Post authors
+
+Bean tries to bring up post author information from the following sources:
+
+1. An `author` object in the front-matter of your post:
+  ```yaml
+  author:
+    name: Will Wright
+    url: https://example.com
+  ```
+2. Your `_data/authors.yml`.
+  It may look like this:
+  
+  ```yaml
+  will:
+    name: Will Wright
+    url: https://example.com
+  ```
+3. A `site.authors` or `site.author` object in your `_config.yml`.
+  Something like this will do:
+  
+  ```yaml
+  authors:
+    will:
+      name: Will Wright
+      url: https://example.com
+      lucy:
+      name: Lucy Bradshaw
+      url: https://example.net
+
+  # or
+
+  author:
+    name: Will Wright
+    url: "https://willwright.blog"
+  ```
+
+If none of these sources are available, Bean will just show the value of your `post.author` as it is.
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub at https://github.com/esporo/bean.
+
+Be aware that, as this theme is intended to be used by my own fansite, not every suggestion may be applied. You are free to fork it and change it to fit your needs!
+
+## License
+
+The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/_config.yml

@@ -0,0 +1,78 @@
+title: Bean
+tagline: A modern, fun theme for Jekyll.
+description: >-
+  Bean is a fun, colorful, theme for Jekyll.
+  It's made for @esporo, but you can use it as well.
+
+# Build settings
+permalink: "/:year/:month/:day/:title.html"
+slug_mode: latin
+
+# Theme Settings
+bean:
+  show_excerpts: true
+  copyright_notice: >-
+    Site built using [Bean](https://github.com/esporo/bean)
+  date_formats:
+    day: "%v"
+    month: "%B, %Y"
+    year: "%Y"
+  translations:
+    jump_to_navigation: "Go to navigation"
+    jump_to_content: "Go to content"
+    archive_date_title: "Posts from %s" # don't forget `%s`, it will be replaced by the date
+    archive_tag_title: "Posts with the tag “%s”" # don't forget `%s`, it will be replaced by the tag name.
+    archive_category_title: "Posts filed under “%s”" # don't forget `%s`, it will be replaced by the category name.
+    post_tagged_with: "Tagged with:"
+    blog_pagination_title: "Blog Pagination"
+    blog_pagination_next_page: "Older posts"
+    blog_pagination_prev_page: "Newer posts"
+    
+# logo: /assets/images/logo.png
+
+main_menu:
+  title: Navigate
+  items:
+    - label: Home
+      path: /
+    - label: About
+      path: /about/
+    - label: Bugs?
+      path: https://github.com/esporo/bean/issues
+    - label: Docs
+      path: hhttps://github.com/esporo/bean?tab=readme-ov-file#readme
+
+footer_menu:
+  title: Socials
+  items:
+    - label: Discord
+      path: https://discord.gg/
+    - label: YouTube
+      path: https://youtube.com/
+    - label: Facebook
+      path: https://www.facebook.com/
+
+# Plugin settings
+plugins:
+  - jekyll-feed
+  - jekyll-json-feed
+  - jekyll-paginate
+  - jekyll-sitemap
+  - jekyll-seo-tag
+  - jekyll-archives
+
+# Plugin: jekyll-paginate
+paginate: 12
+paginate_path: "/page/:num/"
+
+# Plugin: jekyll-archives
+jekyll-archives:
+  enabled:
+  - year
+  - month
+  - tags
+  layout: blog
+  permalinks:
+    year: "/:year/"
+    month: "/:year/:month/"
+    tag: "/tags/:name.html"

data/_data/authors.yml

@@ -0,0 +1,3 @@
+arthur:
+  name: Arthur
+  url: https://arthr.me

data/_data/blogroll.yml

@@ -0,0 +1,9 @@
+- title: Arthur Freitas
+  url: https://arthr.me/
+  description: The author of this theme.
+- title: Repository
+  url: https://github.com/esporo/bean/
+  description: If you find any bugs, file them here.
+- title: RubyGems
+  url: https://rubygems.org/gem/jekyll-theme-bean/
+  description: Bean on RubyGems registry.

data/_includes/below-post.html

@@ -0,0 +1,4 @@
+<!-- 
+  You can replace this file in your website with comments, 
+  call-to-actions or whatever you want to add below your post. 
+-->

data/_includes/blog/archive-title.html

@@ -0,0 +1,12 @@
+<h1 class="archive-title">
+  {%- if include.date -%}
+    {%- assign archive_date = include.date | date: site.bean.date_formats[include.type] -%}
+    {{ site.bean.translations.archive_date_title | replace: "%s", archive_date }}
+  {% else %}
+    {%- if include.type == "tag" -%}
+      {{ site.bean.translations.archive_tag_title | replace: "%s", include.title }}
+    {%- else -%}
+      {{ site.bean.translations.archive_category_title | replace: "%s", include.title }}
+    {%- endif -%}
+  {% endif %}
+</h1>

data/_includes/blog/post.html

@@ -0,0 +1,84 @@
+<article class="post">
+  <header class="post-header">
+    <div class="post-meta">
+      <a class="post-permalink" href="{{- include.post.permalink | absolute_path -}}" rel="bookmark">
+        <time class="post-date" datetime="{{- include.post.date | date_to_xmlschema -}}">
+          {{ include.post.date | date: site.bean.date_formats.day }}
+        </time>
+      </a>
+      
+      {% if include.post.author -%}
+        {%- assign author = include.post.author -%}
+        
+        {%- if site.data.authors -%}
+          {%- assign author = site.data.authors[include.post.author] -%}
+        {%- elsif site.authors -%}
+          {%- assign author = site.authors[include.post.author] -%}
+        {%- endif -%}
+      {%- elsif site.author -%}
+        {% assign author = site.author %}
+      {%- endif -%}
+      
+      {% if author -%}
+        <a class="post-author" rel="author" href="{{- author.url | default: site.url -}}">
+          {{ author.name | default: author }}
+        </a>
+      {%- endif %}
+    </div>
+    
+    {% if page.layout == "post" -%}
+      {% if include.post.title and include.post.title != "" %}
+        <h1 class="post-title">
+          {{ include.post.title }}
+        </h1>
+      {%- endif %}
+    {%- else -%}
+      {% if include.post.title and include.post.title != "" -%}
+        <h2 class="post-title">
+          <a href="{{- include.post.url | relative_path -}}" rel="bookmark">
+            {{ include.post.title }}
+          </a>
+        </h2>
+      {%- endif %}
+    {%- endif %}
+  </header>
+  
+  {% if include.post.title and include.post.title != "" %}
+    {% unless hide_posts_content or page.hide_posts_content -%}
+      <div class="post-content">
+        
+        {% if page.layout != "post" and include.show_excerpts or page.show_excerpts or site.bean.show_excerpts %}
+          {{ post.excerpt }}
+        {% else %}
+          {{ include.content }}
+        {% endif %}
+        
+      </div>
+    {%- endunless %}
+    
+  {%- else -%}
+    <div class="post-content">
+      {{ include.content }}
+    </div>
+  {%- endif %}
+  
+  {% if include.post.tags -%}
+    <footer class="post-footer">
+      <span class="post-meta">
+        {{ site.bean.translations.post_tagged_with }}
+      </span>
+      
+      <ul class="post-meta post-tags">
+        {% for tag in include.post.tags -%}
+          {%- assign tag_url = site.jekyll-archives.permalinks.tag | replace: ":name", tag | replace: " ", "-" -%}
+          <li class="post-tag">
+            
+            <a href="{{- tag_url -}}" rel="tag">
+              {{ tag }}
+            </a>
+          </li>
+        {%- endfor %}
+      </ul>
+    </footer>
+  {%- endif %}
+</article>

data/_includes/blog/sidebar.html

@@ -0,0 +1,3 @@
+<div class="sidebar">
+  {%- include widgets.html -%}  
+</div>

data/_includes/blog/widget.html

@@ -0,0 +1,9 @@
+<aside class="sidebar-widget">
+  <h2 class="widget-title">
+    {{ include.title }}
+  </h2>
+  
+  <div class="widget-content">
+    {{ include.content }}
+  </div>
+</aside>

data/_includes/head.html

@@ -0,0 +1,22 @@
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  
+  {% if page.title -%}
+    <title>{{ page.title }} ({{ site.title }})</title>
+  {%- else -%}
+    <title>{{ site.title }} &mdash; {{ site.tagline }}</title>
+  {%- endif %}
+  
+  {% seo title=false %}
+  
+  <link rel="stylesheet" href="{%- link assets/css/reset.css -%}" />
+  <link rel="stylesheet" href="{%- link assets/css/base.css -%}" />
+  <link rel="stylesheet" href="{%- link assets/css/layout.css -%}" />
+  <link rel="stylesheet" href="{%- link assets/css/highlights.css -%}" />
+  <link rel="stylesheet" href="{%- link assets/css/theme.css -%}" />
+  <link rel="stylesheet" href="{%- link assets/fonts/fonts.css -%}" />
+  
+  {% feed_meta %}
+  {% json_feed_meta %}
+</head>

data/_includes/scripts.html

@@ -0,0 +1 @@
+<!-- You can replace this file in your website with custom scripts that you may need. -->

data/_includes/site/footer.html

@@ -0,0 +1,36 @@
+<footer class="site-footer">
+  <div class="container">
+    <div class="site-info">
+      <div class="site-branding">
+        <h2 class="site-title">{{ site.title }}</h2>
+        <p class="site-tagline">{{ site.tagline }}</p>
+      </div>
+      
+      <div class="site-description">
+        {{ site.description | markdownify }}
+      </div>
+      
+      {% if site.bean.copyright_notice -%}
+        <div class="site-copyright">
+          {{ site.bean.copyright_notice | markdownify }}
+        </div>
+      {%- endif %}
+    </div>
+    
+    {% if site.footer_menu.items -%}
+      <nav class="footer-menu">
+        {% if site.footer_menu.title -%}
+          <h2 class="screen-reader-text">
+            {{ site.footer_menu.title }}
+          </h2>
+        {%- endif %}
+        
+        {% for item in site.footer_menu.items -%}
+          <a class="menu-item" {% if item.color -%} style="--item-color: {{ item.color }}" {%- endif %} href="{{ item.path }}">
+            {{ item.label }}
+          </a>
+        {%- endfor %}
+      </nav>
+    {%- endif %}
+  </div>
+</footer>

data/_includes/site/header.html

@@ -0,0 +1,40 @@
+{%- capture site_branding -%}
+  <a href="{{ '/'| absolute_url }}">
+    {% if site.logo -%}
+      <img class="site-logo" src="{{- site.logo -}}" alt="{{ site.title }}" role="presentation" />
+      <span class="screen-reader-text">{{ site.title }}</span>
+    {%- else -%}
+      {{ site.title }}
+    {%- endif %}
+  </a>
+{%- endcapture -%}
+
+<header class="site-header">
+  <div class="container">
+    {% if page.title -%}
+      <span class="site-title">
+        {{ site_branding }}
+      </span>
+    {%- else -%}
+      <h1 class="site-title">
+        {{ site_branding }}
+      </h1>
+    {%- endif %}
+    
+    {% if site.main_menu -%}
+      <nav class="main-menu" id="navigation">
+        {% if site.main_menu.title -%}
+          <h2 class="screen-reader-text">
+            {{ site.main_menu.title }}
+          </h2>
+        {%- endif %}
+        
+        {% for item in site.main_menu.items -%}
+          <a class="menu-item" {% if item.color -%} style="--item-color: {{ item.color }}" {%- endif %} href="{{ item.path }}">
+            {{ item.label }}
+          </a>
+        {%- endfor %}
+      </nav>
+    {%- endif %}
+  </div>
+</header>

data/_includes/widgets.html

@@ -0,0 +1,33 @@
+{% comment %}
+  Sidebar widgets
+  
+  You can add custom widgets to the sidebar of your site by sending 
+  both title and contents of your widget through an include. For example:
+  
+  {% capture widget_content %}
+    <p>This will appear in my sidebar!</p>
+  {% endcapture %}
+  
+  {% assign widget_title = "This is an example" %}
+  
+  {% include blog/widget.html title=widget_title content=widget_content %}
+{% endcomment %}
+
+{% assign blogroll_title = "Useful links" %}
+
+{% capture blogroll_content %}
+  <dl class="blogroll">
+    {%- for item in site.data.blogroll -%}
+      <dt>
+        <a href="{{ item.url }}" rel="external">
+          {{ item.title }}
+        </a>
+      </dt>
+      <dd>
+        {{ item.description }}
+      </dd>
+    {%- endfor -%}
+  </dl>
+{% endcapture %}
+
+{%- include blog/widget.html title=blogroll_title content=blogroll_content -%}