ci: fix use latest jekyll

.github/workflows/build-pages.yml

@@ -0,0 +1,64 @@
+# This workflow uses actions that are not certified by GitHub.
+# They are provided by a third-party and are governed by
+# separate terms of service, privacy policy, and support
+# documentation.
+
+# Sample workflow for building and deploying a Jekyll site to GitHub Pages
+name: Deploy Jekyll site to Pages
+
+on:
+  # Runs on pushes targeting the default branch
+  push:
+    branches: master
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
+# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
+concurrency:
+  group: "pages"
+  cancel-in-progress: false
+
+jobs:
+  # Build job
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup Ruby
+        uses: ruby/setup-ruby@8575951200e472d5f2d95c625da0c7bec8217c42 # v1.161.0
+        with:
+          ruby-version: '3.1' # Not needed with a .ruby-version file
+          bundler-cache: true # runs 'bundle install' and caches installed gems automatically
+          cache-version: 0 # Increment this number if you need to re-download cached gems
+      - name: Setup Pages
+        id: pages
+        uses: actions/configure-pages@v4
+      - name: Build with Jekyll
+        # Outputs to the './_site' directory by default
+        run: bundle exec jekyll build --baseurl "${{ steps.pages.outputs.base_path }}"
+        env:
+          JEKYLL_ENV: production
+      - name: Upload artifact
+        # Automatically uploads an artifact from the './_site' directory by default
+        uses: actions/upload-pages-artifact@v3
+
+  # Deployment job
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    needs: build
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4

_sass/navigation.scss

@@ -1,6 +1,6 @@
 // Main nav, breadcrumb, etc...
 // stylelint-disable selector-no-type, max-nesting-depth, selector-max-compound-selectors, selector-max-type, selector-max-specificity
-
+@use 'sass:math';
 .nav-list {
   padding: 0;
   margin-top: 0;
@@ -74,19 +74,19 @@
 
       width: $nav-list-item-height-sm;
       height: $nav-list-item-height-sm;
-      padding-top: #{$nav-list-item-height-sm / 4};
-      padding-right: #{$nav-list-item-height-sm / 4};
-      padding-bottom: #{$nav-list-item-height-sm / 4};
-      padding-left: #{$nav-list-item-height-sm / 4};
+      padding-top: math.div($nav-list-item-height-sm, 4);
+      padding-right: math.div($nav-list-item-height-sm, 4);
+      padding-bottom: math.div($nav-list-item-height-sm, 4);
+      padding-left: math.div($nav-list-item-height-sm, 4);
       color: $link-color;
 
       @include mq(md) {
         width: $nav-list-item-height;
         height: $nav-list-item-height;
-        padding-top: #{$nav-list-item-height / 4};
-        padding-right: #{$nav-list-item-height / 4};
-        padding-bottom: #{$nav-list-item-height / 4};
-        padding-left: #{$nav-list-item-height / 4};
+        padding-top: math.div($nav-list-item-height, 4);
+        padding-right: math.div($nav-list-item-height, 4);
+        padding-bottom: math.div($nav-list-item-height, 4);
+        padding-left: math.div($nav-list-item-height, 4);
       }
 
       // &:hover {
@@ -106,9 +106,9 @@
 
     > .nav-list {
       display: none;
-      padding-left: #{$nav-list-item-height-sm/2};
+      padding-left: math.div($nav-list-item-height-sm, 2);
       @include mq(md) {
-        padding-left: #{$nav-list-item-height/2};
+        padding-left: math.div($nav-list-item-height, 2);
       }
       list-style: none;
       background-color: $sidebar-color;

_sass/support/_functions.scss

@@ -1,5 +1,7 @@
+@use 'sass:math';
+
 @function rem($size, $unit: "") {
-  $rem-size: $size / $root-font-size;
+  $rem-size: math.div($size, $root-font-size);
 
   @if $unit == false {
     @return #{$rem-size};