jekyll-glass 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: db3b7606039886dd5f4ab8df2a0a4c5286aaf2d05b0b79e7d5f3e341b309ac2b
+  data.tar.gz: 1c6b47a1921fa60f5bc2f2f0395722f51fd80f72beb8ac5497b3a158ace88a2b
+SHA512:
+  metadata.gz: ffad05959b146585b754a7981d4fa8e0e83700083aedd6c25ba38dd65c3339fffad15eef53c3cf1797910af0f5164b534a3072e6631de0d964a008533a6b7ffa
+  data.tar.gz: 5c6eb011de9c8d028591a0ab7848c98584e00605c59f1354330eb53a8fc51318427798cbda8e20ee01f5f59e763263174427e4af1ff6a856e4b02198a23df287

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2024 Linus Warnatz
+
+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,79 @@
+---
+layout: page
+permalink: /index
+title: README
+---
+
+# jekyll-glass
+
+`jekyll-glass` is a Jekyll theme using glassmorphism design and clear block separation, created for my own blog. The theme's layout was loosely inspired by the page layout of [xkcd](https://xkcd.com/).
+
+
+## Installation
+
+Add this line to your Jekyll site's `Gemfile`:
+
+```ruby
+gem "jekyll-glass"
+```
+
+And add this line to your Jekyll site's `_config.yml`:
+
+```yaml
+theme: jekyll-glass
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install jekyll-glass
+
+## Usage
+
+### Layouts
+The theme provides the following four layouts:
+- `home`, intended for the index page, listing all posts
+- `post`, intended for blog posts
+- `page`, intended for static pages (currently identical to `post`)
+- `tag`, intended for tag pages, listing all posts with a certain tag
+
+The `base` layout is not intended to be used directly, but provides the basic structure for the other layouts, and is functionally identical to `page`.
+
+### Includes
+You may be interested in modifying the following `includes`:
+- `custom-head`, for custom CSS or JavaScript
+- `header`, for the header of the page, set to display the site title and description.
+
+If you modify the `footer` include, please retain some kind of theme credit, as per the MIT license.
+
+All other includes are not intended to be modified. Remember that overriding includes removes the original, so you may want to copy the original content into your new include.
+
+### Configuration
+All other configuration is in `_config.yml`, or dynamically created from Front Matter.
+
+The configuration is designed to closely follow [Minima] 3, the default Jekyll theme.
+
+The following configuration options are available:
+- `title`, the title of the site
+- `description`, a short description of the site
+- `author`, the author of the site. This expects a mapping of `name` and `email`.
+- `baseurl`, the subpath of the site, if it is not hosted at the root of the domain
+- `url`, the hostname of the site, and protocol, if not `https://`
+- `social`, a mapping of social media links, with the same format as [Minima] 3, although no icons are generated, so I recommend setting the `title` property.
+- `tag_page_dir`, the directory where tag pages are generated.
+
+## A note on GitHub Pages
+The default "Publish from Branch" option on GitHub Pages does not support custom Gems. While you can use this theme using `jekyll-remote-theme`, this will break tags. Use a GitHub Actions workflow to build the site instead. The Jekyll team have written a simple [guide](https://jekyllrb.com/docs/continuous-integration/github-actions/) for this.
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub at https://github.com/libewa/jekyll-glass. 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.
+
+## License
+
+The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
+
+[Minima]: https://github.com/jekyll/minima

data/_includes/footer.html

@@ -0,0 +1,5 @@
+<div id="page-footer" class="glass container">
+    <p>© 2024 - {{ site.author.name }}</p>
+    <p>Powered by <a href="https://jekyllrb.com/" target="_blank">Jekyll</a> and <a href="https://pages.github.com/" target="_blank">GitHub Pages</a></p>
+    <p>Theme by <a href="https://github.com/libewa">libewa</a>, licensed under the MIT License.</p>
+</div>

data/_includes/head.html

@@ -0,0 +1,9 @@
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}">
+    <title>{{ page.title }} | {{ site.title }}</title>
+    {%- feed_meta -%}
+    {%- include custom-head.html -%}
+</head>

data/_includes/header.html

@@ -0,0 +1,6 @@
+<div id="page-header" class="glass container">
+    <h1 id="site-title"><a href="/index">{{ site.title }}</a></h1>
+    {% if site.description %}
+    <p id="site-description">{{ site.description }}</p>
+    {% endif %}
+</div>

data/_includes/navlinks.html

@@ -0,0 +1,8 @@
+<ul class="static-links">
+    {%- include static-links.html -%}
+</ul>
+<ul class="social-links">
+    {%- for entry in site.social_links -%}
+        {%- include social-item.html item = entry -%}
+    {%- endfor -%}
+</ul>

data/_includes/sidebar.html

@@ -0,0 +1,12 @@
+<div id="sidebar-left" class="sidebar glass container" >
+    <nav id="sidenav">
+        {%- include navlinks.html -%}
+        <h3>Tags</h3>
+        <ul id="sidebar-tag-list">
+            {%- include taglist.html -%}
+        </ul>
+    </nav>
+    <nav id="topnav">
+        {%- include navlinks.html -%}
+    </nav>
+</div>

data/_includes/social-item.html

@@ -0,0 +1,5 @@
+<li>{% assign entry = include.item %}
+    <a {% unless entry.platform == 'rss' %}rel="me" {% endunless %}href="{{ entry.user_url }}" target="_blank" title="{{ entry.title | default: entry.platform }}">
+    {{ entry.title | default: entry.platform }}
+    </a>
+</li>

data/_includes/static-links.html

@@ -0,0 +1,3 @@
+<li><a href="/index">Home</a></li>
+<li><a href="/contact">Contact</a></li>
+<li><a href="/feed.xml">RSS</a></li>

data/_includes/taglist.html

@@ -0,0 +1,3 @@
+{%- for tag in site.tags -%}
+<li><a href="{{ '/tag/' | append: tag[0] | relative_url }}">{{ tag[0] }}</a></li>
+{%- endfor -%}

data/_layouts/base.html

@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="{{ page.lang | default: site.lang | default: "en" }}">
+
+{%- include head.html -%}
+
+<body>
+
+{%- include header.html -%}
+
+<div id="below-header">
+{%- include sidebar.html -%}
+
+<main class="glass container" id="page-content" aria-label="Content">
+    <div class="wrapper">
+        {{ content }}
+    </div>
+</main>
+</div>
+
+{%- include footer.html -%}
+
+</body>
+
+</html>

data/_layouts/home.html

@@ -0,0 +1,59 @@
+---
+layout: base
+---
+
+<div class="home">
+    {{ content }}
+
+
+    <h1 class="post-list-heading">All posts</h1>
+
+    {% if site.paginate %}
+    {% assign posts = paginator.posts %}
+    {% else %}
+    {% assign posts = site.posts %}
+    {% endif %}
+
+
+    {%- if posts.size > 0 -%}
+    {%- if page.list_title -%}
+    <h2 class="post-list-heading">{{ page.list_title }}</h2>
+    {%- endif -%}
+    <ul class="post-list">
+        {%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%}
+        {%- for post in posts -%}
+        <li>
+            <span class="post-meta">{{ post.date | date: date_format }}</span>
+            <h3>
+                <a class="post-link" href="{{ post.url | relative_url }}">
+                    {{ post.title | escape }}
+                </a>
+            </h3>
+            {%- if site.show_excerpts -%}
+            {{ post.excerpt }}
+            {%- endif -%}
+        </li>
+        {%- endfor -%}
+    </ul>
+
+    {% if site.paginate %}
+    <div class="pager">
+        <ul class="pagination">
+            {%- if paginator.previous_page %}
+            <li><a href="{{ paginator.previous_page_path | relative_url }}" class="previous-page">{{ paginator.previous_page }}</a></li>
+            {%- else %}
+            <li><div class="pager-edge">•</div></li>
+            {%- endif %}
+            <li><div class="current-page">{{ paginator.page }}</div></li>
+            {%- if paginator.next_page %}
+            <li><a href="{{ paginator.next_page_path | relative_url }}" class="next-page">{{ paginator.next_page }}</a></li>
+            {%- else %}
+            <li><div class="pager-edge">•</div></li>
+            {%- endif %}
+        </ul>
+    </div>
+    {%- endif %}
+
+    {%- endif -%}
+
+</div>

data/_layouts/page.html

@@ -0,0 +1,4 @@
+---
+layout: base
+---
+{{ content }}

data/_layouts/post.html

@@ -0,0 +1,4 @@
+---
+layout: base
+---
+{{ content }}

data/_layouts/tag.html

@@ -0,0 +1,20 @@
+---
+layout: base
+---
+<h1 class="post-list-heading">Posts tagged with "{{ page.tag }}"</h1>
+<ul class="post-list">
+    {%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%}
+    {%- for post in site.tags[page.tag] -%}
+    <li>
+        <span class="post-meta">{{ post.date | date: date_format }}</span>
+        <h3>
+            <a class="post-link" href="{{ post.url | relative_url }}">
+                {{ post.title | escape }}
+            </a>
+        </h3>
+        {%- if site.show_excerpts -%}
+        {{ post.excerpt }}
+        {%- endif -%}
+    </li>
+    {%- endfor -%}
+</ul>

data/assets/css/main.scss

@@ -0,0 +1,164 @@
+---
+---
+
+@charset "utf-8";
+@import "custom";
+
+// Define defaults for each variable.
+
+$base-font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI",
+    "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", Roboto, Helvetica,
+    Arial, sans-serif !default;
+$code-font-family: "Menlo", "Inconsolata", "Consolas", "Roboto Mono",
+    "Ubuntu Mono", "Liberation Mono", "Courier New", monospace;
+
+// https://coolors.co/1b2f33-28502e-47682c-8c7051-ef3054
+$dark-color: #1b2f33ff !default; // Dark color used e.g. for the background
+$color-2: #28502eff !default;
+$color-3: #47682cff !default;
+$color-4: #8c7051ff !default;
+$color-5: #ef3054ff !default;
+$light-color: #fff !default; // Light color used e.g. for foreground text
+$link-color: #bbb !default;
+$link-color-visited: #888 !default;
+
+$spacing-unit: 30px !default;
+
+$table-text-align: left !default;
+
+body {
+    font-family: $base-font-family;
+    color: $light-color;
+    -webkit-text-size-adjust: 100%;
+    -webkit-font-feature-settings: "kern" 1;
+    -moz-font-feature-settings: "kern" 1;
+    -o-font-feature-settings: "kern" 1;
+    font-feature-settings: "kern" 1;
+    font-kerning: normal;
+    background-color: $dark-color;
+}
+
+a {
+    color: $link-color;
+}
+
+a:visited {
+    color: $link-color-visited;
+}
+
+.container {
+    box-sizing: border-box;
+    padding: 1em 2em 1em 2em;
+}
+ul {
+    padding-left: inherit;
+}
+nav ul li {
+    list-style-type: none;
+}
+#page-content ul {
+    padding-left: 20px;
+}
+
+h1 {
+    font-family: $code-font-family, monospace;
+}
+
+.post-list-heading {
+    font-size: 26px;
+}
+
+h1 a {
+    color: $light-color;
+    text-decoration: none;
+}
+h1 a:visited {
+    color: $light-color;
+}
+
+.static-links a:visited {
+    color: $link-color;
+}
+
+code {
+    font-family: $code-font-family, monospace;
+    padding: 1px 3px 1px 3px;
+    @extend .glass;
+}
+
+.glass {
+    /* From https://css.glass */
+    background: rgba(255, 255, 255, 0.2);
+    border-radius: 16px;
+    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
+    backdrop-filter: blur(7.1px);
+    -webkit-backdrop-filter: blur(7.1px);
+    border: 1px solid rgba(255, 255, 255, 0.3);
+}
+
+/* Grid layout */
+
+body {
+    display: grid;
+    grid-template-areas:
+        "header"
+        "content"
+        "footer";
+    grid-template-columns: 1fr;
+    grid-template-rows: auto 1fr auto;
+    gap: 10px;
+}
+
+#page-header {
+    grid-area: header;
+    width: 100%;
+}
+
+#below-header {
+    display: grid;
+    grid-template-areas: "sidebar content";
+    grid-template-columns: 250px 1fr;
+    gap: 10px;
+}
+
+#sidebar-left {
+    grid-area: sidebar;
+}
+
+#page-content {
+    grid-area: content;
+}
+
+#page-footer {
+    grid-area: footer;
+    width: 100%;
+}
+
+@media (max-width: 600px) {
+    #below-header {
+        grid-template-areas:
+            "sidebar"
+            "content";
+        grid-template-columns: 1fr;
+    }
+    .social-link {
+        display: none;
+    }
+}
+
+#topnav {
+    display: none; /* Hide by default */
+}
+#topnav ul {
+    display: flex;
+    gap: 1rem; /* Optional: Adjust the gap between links */
+}
+
+@media (max-width: 600px) {
+    #sidenav {
+        display: none;
+    }
+    #topnav {
+        display: block;
+    }
+}

metadata

@@ -0,0 +1,145 @@
+--- !ruby/object:Gem::Specification
+name: jekyll-glass
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- Linus Warnatz
+autorequire:
+bindir: bin
+cert_chain: []
+date: 2024-12-27 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: jekyll
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '3.10'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '3.10'
+- !ruby/object:Gem::Dependency
+  name: jekyll-tagging
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 1.1.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 1.1.0
+- !ruby/object:Gem::Dependency
+  name: jekyll-feed
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 0.17.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 0.17.0
+- !ruby/object:Gem::Dependency
+  name: jekyll-sitemap
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 1.4.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 1.4.0
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+- !ruby/object:Gem::Dependency
+  name: kramdown-parser-gfm
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+description:
+email:
+- linus@libewa.xyz
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- LICENSE.txt
+- README.md
+- _includes/custom-head.html
+- _includes/footer.html
+- _includes/head.html
+- _includes/header.html
+- _includes/navlinks.html
+- _includes/sidebar.html
+- _includes/social-item.html
+- _includes/static-links.html
+- _includes/taglist.html
+- _layouts/base.html
+- _layouts/home.html
+- _layouts/page.html
+- _layouts/post.html
+- _layouts/tag.html
+- _sass/_custom.scss
+- assets/css/main.scss
+homepage: https://github.com/libewa/jekyll-glass
+licenses:
+- MIT
+metadata: {}
+post_install_message:
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.5.22
+signing_key:
+specification_version: 4
+summary: A Jekyll theme using glass blocks.
+test_files: []