jekyll-theme-miniplex 0.9.2 → 0.11.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5824a5e5f6768a2df574c4b5a45ec0b59368c0174183b70374df4a0a2cd4b36e
-  data.tar.gz: c424f1930c8dd47b3ef9a47aa9d190a4104a99c00273870f9a46fbfd0e1f493a
+  metadata.gz: 1f9a4eb82bd23673683f3c3081242818cfbba646ab65928acc19921ca74c218e
+  data.tar.gz: 6e1a0882e28b4bdc100e1614dc720eda582e0dcab3ae640eacf95605be5990bd
 SHA512:
-  metadata.gz: 2ab16e848ede97dd2ccf28981ac514aebe4fb9f241d5d6baa516d122c14d1e2bdd58c4ac4e0dd0a042a23ca8c4be79b6401c3a7d5be1a2fa7c55b10053fc5b14
-  data.tar.gz: 2adeda68ecca2f314c9e575d725734c35bcf4ab5063e4c20700e9939a104c4fddc5a036782cdec82ff7cc764e3a33afc4ab78a8239c1ad9849c2f907be4245b5
+  metadata.gz: b13916d83cb7d3444f4e17b199e0d3628c70b44e013279b459a3e984ba9458f1e85f124b6daa000f65e1fbd66f67fa56709987cd9f36b68a18d36eb91d560d34
+  data.tar.gz: 914deaf93d0958c19187eaf56010966f58b3222c146cda319efa717fcfd70cd775b8dd5fb0936e464d0e50bdeb20280d4c5a2ed3258b22df394e3ac0ef7826da

data/README.md

@@ -1,20 +1,29 @@
 # jekyll-theme-miniplex
 
-A theme for [Jekyll](https://jekyllrb.com/). Features and characteristics:
+A theme for [Jekyll](https://jekyllrb.com/). Features:
 
+- Light & dark modes.
+- Table reformatting on mobile and for very small screens.
+- Styles for printing.
+- At least some basic accessibility.
 - Responsive.
-- Table reformatting for very small screens.
 - Hamburger menu at the bottom right, easy to reach.
 - Uses the [IBM Plex](https://www.ibm.com/plex/) typeface, hence the name.
 
-I'm using this for my personal web site, so don't expect this to fit your needs.
+I'm using this for [my personal web site](https://timowuersch.com/), so don't expect this to fit your needs.
 
 ## What it looks like
 
+### On desktop
+
 ![](screenshot.png)
 
 
 
+### On mobile
+
+![](screenshot-mobile.png)
+
 ## Installation
 
 Add the following to your Jekyll site's `Gemfile`:
@@ -22,35 +31,45 @@ Add the following to your Jekyll site's `Gemfile`:
 ```ruby
 gem "jekyll-theme-miniplex"
 
-# jekyll-theme-miniplex depends on this.
+# jekyll-theme-miniplex depends on these.
 gem "jekyll-titles-from-headings", "~> 0.5.3"
+gem "jekyll-seo-tag"
 
 # Use the most recent version of jekyll-sass-converter, to force Dart Sass
 gem "sass-embedded"
 gem "jekyll-sass-converter", github: "jekyll/jekyll-sass-converter"
 ```
 
+(Note that this will also install [jekyll-titles-from-headings](https://github.com/benbalter/jekyll-titles-from-headings) and [jekyll-seo-tag](https://github.com/jekyll/jekyll-seo-tag/), which this theme depends on.)
+
 Add the following to your Jekyll site's `_config.yml`:
 
 ```yaml
 theme: jekyll-theme-miniplex
 
+plugins:
+  - jekyll-coffeescript
+  - jekyll-titles-from-headings
+  - jekyll-seo-tag
+
 titles_from_headings:
   enabled: true
   strip_title: true
   collections: true
 ```
 
-And then execute:
+Execute...
 
     $ bundle
 
+... to install everything.
+
 
 ## Usage
 
 ### Layouts
 
-At the moment, there is a `page` and a `post` layout, but they use the `default` layout and so are identical.
+There are two layouts: `page` and `post`. They are almost identical, except for the `post` layout that shows the post's date and author below the title.
 
 ### Configuration options
 
@@ -61,10 +80,17 @@ miniplex:
   mobile_nav_menu_title: "Menü"
 ```
 
+### Navigation & footer content, and additional HEAD content
+
+Optionally, put any of the following files into the `_includes` folder to override or extend the defaults:
+
+- `footer.html` contains the footer content
+- `additional_head_tags.html` will be included at the end of the HEAD block, before BODY starts
+- `navigation_desktop.html` and `navigation_mobile.html` contain the contents of the desktop and mobile navigation, respectively.
+
 ## ToDos & Missing Features
 
 - [ ] In-page navigation
-- [ ] Footer
 - [ ] Maximizable tables
 - [ ] Breadcrumbs, if possible
 - [ ] Side notes, if possible
@@ -74,6 +100,7 @@ miniplex:
 
 Most recent at the top.
 
+- [X] Footer
 - [X] Dark mode
 - [X] Print CSS
 - [X] Mobile nav bugfixing

data/_config.yml

@@ -7,6 +7,7 @@ title: Miniplex Theme for Jekyll
 plugins:
   - jekyll-coffeescript
   - jekyll-titles-from-headings
+  - jekyll-seo-tag
 
 exclude:
   - .sass-cache/

data/_includes/footer.html

@@ -0,0 +1 @@
+Made with <a href="https://jekyllrb.com/" target="_new">Jekyll</a> and <a href="https://gitlab.com/twuersch/jekyll-theme-miniplex" target="_new">jekyll-theme-miniplex</a>.

data/_layouts/default.html

@@ -1,9 +1,6 @@
 <!doctype html>
 <html lang="en">
   <head>
-
-    <title>{{ page.title }} - {{ site.title }}</title>
-
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta name="theme-color" content="#ffffff">
@@ -13,6 +10,7 @@
 
     {% include additional_head_tags.html %}
 
+    {% seo %}
   </head>
 
   <body>
@@ -30,6 +28,9 @@
       <nav id="navigation-mobile" data-state="closed" role="navigation">
         {% include navigation_mobile.html %}
       </nav>
+      <footer>
+        {% include footer.html %}
+      </footer>
     </div>
   </body>
 </html>

data/_sass/jekyll-theme-miniplex.sass

@@ -251,7 +251,6 @@ $large_breakpoint: $medium_breakpoint + $large_minimum_left_navigation_width + 2
   --group_color_level_1: #eeeeee
   --group_color_level_2: #dddddd
 
-
 :root
   @media (prefers-color-scheme: dark)
     --primary_foreground_color: #ffffff
@@ -276,7 +275,7 @@ body
       display: grid
       height: 100vh
       grid-template-columns: [left-navigation] auto [content] 1fr
-      grid-template-rows: auto
+      grid-template-rows: [navigation-and-content] min-content [footer] min-content
 
     @include below_large_mode
       display: flex
@@ -308,9 +307,12 @@ body
         grid-column: content / span 1
         grid-row: 1 / span 1
         width: $medium_content_width
-        padding: $medium_padding
+        padding-top: $medium_padding
+        @include linear_responsive_property("padding-right", $large_breakpoint, $unit, $large_breakpoint + 8 * $unit, 8 * $unit)
+        padding-bottom: $medium_padding
+        padding-left: $medium_padding
         margin-left: auto
-        margin-right: auto
+        margin-right: 0
         margin-top: $medium_maximum_horizontal_margin
         margin-bottom: $medium_maximum_horizontal_margin
 
@@ -693,7 +695,7 @@ body
 
           li#site-title
             @include title_font
-            @include responsive_property(font-size, $xs: 1.125 * $unit, $s: 1.25 * $unit, $m: 1.5 * $unit, $otherwise: 1.5 * $unit)
+            @include responsive_property(font-size, $xs: 1 * $unit, $s: 1.25 * $unit, $m: 1.5 * $unit, $otherwise: 1.5 * $unit)
             @include responsive_property(padding-left, $m: $unit, $otherwise: math.div($unit, 2))
             @include responsive_property(padding-top, $m: math.div($unit, 2), $otherwise: math.div($unit, 4))
             @include responsive_property(padding-bottom, $m: math.div($unit, 2), $otherwise: math.div($unit, 4))
@@ -707,9 +709,8 @@ body
           li
             @include responsive_property(padding-right, $m: $unit, $otherwise: math.div($unit, 2))
 
-
             button#mobile-navigation-toggle
-              @include responsive_property(font-size, $xs: 1.125 * $unit, $s: 1.25 * $unit, $m: 1.5 * $unit, $otherwise: 1.5 * $unit)
+              @include responsive_property(font-size, $xs: 1 * $unit, $s: 1.25 * $unit, $m: 1.5 * $unit, $otherwise: 1.5 * $unit)
               font-weight: bold
               color: var(--heading_foreground_color)
               cursor: pointer  
@@ -768,3 +769,31 @@ body
           --icon-url: url("/assets/images/close-outline.svg")
           @include dark_mode
             --icon-url: url("/assets/images/close-outline-darkmode.svg")
+
+    footer
+      text-align: end
+      color: var(--accent_color_1)
+      background-color: var(--group_color_level_1)
+
+      a
+        color: var(--accent_color_1)
+
+      @include extrasmall_mode
+        padding: math.div($unit, 2)
+        padding-bottom: 4 * $unit
+      
+      @include small_mode
+        padding: math.div($unit, 2)
+        padding-bottom: 4 * $unit
+
+      @include medium_mode
+        padding: $unit
+        padding-bottom: 4 * $unit
+      
+      @include large_mode
+        grid-column: left-navigation / span 2
+        grid-row: footer / span 1
+        padding-top: $medium_padding
+        padding-bottom: $medium_padding
+        @include linear_responsive_property("padding-left", $large_breakpoint, $unit, $large_breakpoint + 8 * $unit, 8 * $unit)
+        @include linear_responsive_property("padding-right", $large_breakpoint, $unit, $large_breakpoint + 8 * $unit, 8 * $unit)

data/assets/js/main.coffee

@@ -14,7 +14,7 @@ document.addEventListener "DOMContentLoaded", (DOMLoadedEvent) ->
 
   # Mobile navigation
   mobileNavigation = document.querySelector "nav#navigation-mobile"
-  mobileNavigationItems = document.querySelector "nav#navigation-mobilenav#navigation-mobile ul#navigation-items"
+  mobileNavigationItems = document.querySelector "nav#navigation-mobile ul#navigation-items"
   mobileNavigationControls = document.querySelector "nav#navigation-mobile #navigation-controls"
   navigationToggleButton = document.querySelector "button#mobile-navigation-toggle"
   transparentNavCloseArea = document.querySelector "div#transparent-nav-close-area"
@@ -50,5 +50,7 @@ document.addEventListener "DOMContentLoaded", (DOMLoadedEvent) ->
 
         mobileNavigationItems.setAttribute "aria-hidden", "true"
 
+        mobileNavigation.scrollIntoView {block: "end"}
+
   navigationToggleButton.addEventListener "click", toggleNavigation
   transparentNavCloseArea.addEventListener "click", toggleNavigation

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-theme-miniplex
 version: !ruby/object:Gem::Version
-  version: 0.9.2
+  version: 0.11.0
 platform: ruby
 authors:
 - Timo Würsch
-autorequire:
+autorequire: 
 bindir: bin
 cert_chain: []
-date: 2023-02-24 00:00:00.000000000 Z
+date: 2023-03-03 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -38,7 +38,7 @@ dependencies:
     - - "~>"
       - !ruby/object:Gem::Version
         version: 2.0.0
-description:
+description: 
 email:
 - twuersch@fastmail.com
 executables: []
@@ -49,6 +49,7 @@ files:
 - README.md
 - _config.yml
 - _includes/additional_head_tags.html
+- _includes/footer.html
 - _includes/navigation_desktop.html
 - _includes/navigation_mobile.html
 - _layouts/default.html
@@ -77,7 +78,7 @@ homepage: https://gitlab.com/twuersch/jekyll-theme-miniplex
 licenses:
 - MIT
 metadata: {}
-post_install_message:
+post_install_message: 
 rdoc_options: []
 require_paths:
 - lib
@@ -92,8 +93,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.3.7
-signing_key:
+rubygems_version: 3.3.26
+signing_key: 
 specification_version: 4
 summary: A Jekyll theme.
 test_files: []