Launching v5

[kdevo]

Launching v5 - Modular Manta

v5 of the theme goes by the nickname 'Modular Manta', since it packs many improvements that might not be that obvious on first sight by integrating Hugo Mods. I've started this project a few months ago to make website building with Hugo even more easy and modular. The goal is to have a high-quality selection of community-maintained Hugo modules for popular use-cases such as icon embedding, lazy image loading, static on-page discussions and more.

Behind the scenes: To create the modules, many parts of the theme's v4 version have been extracted and generalized, tested and then embedded into the theme again. This way everyone can profit even from a subset of the theme's functionality, with a great support for customization. 🚀

Changelog in commits: v4..v5
Changelog in plain english ⬇️

Improvements

• Hugo Modules:
  • Switch from Fontello icon font to SVG icon system using hugo-mods/icons
  • Use hugo-mods/lazyimg for improved imaging support
  • Add hugo-mods/release-notify module to get a notification for every minor/major version
• Visual:
  • Improve various screen size support for background image
  • Make button icons color transition compatible and ease the transition
• Improve theming capabilities:
  • Use dedicated bundle folder for each theme, allowing to supply colors, fontface, fontsizing and custom SCSS for each theme
  • Fallback to default if respective theme-specific file is not found
  • Theme-specific _custom.scss (under sass/themes) is loaded before more generic _custom.scss (under sass)
  • Add new dedark theme which is a word-playing ancestor of the default delight theme
  • Add new origin theme which is a revival of the original Osprey theme - with the same colors, text alignment and fonts
• Improve termynal integration and usage, extract to shortcode
• Docs:
  • Explain additional customization possibilities such as custom section, theming and advanced module configuration
  • Extend exampleSite to reflect all new configuration options and features
  • Improve image sizing recommendations
  • Add and explain new config options in example config.yaml
  • Improve consistency
• Add Oxanium and Rubik fonts locally in static folder

Bugs fixed

• Visual:
  • Remove distortion when image exceeds container width
  • Make images in regular content files responsive by changing default height to auto
  • When using the GitHub project gallery entry feature: Emojify GitHub project descriptions
• Remove obsolete visit GitHub link shortcode
• Fix nil pointer when no social icons are configured
• Remove old formspree URL from contact form
• Cleanup, remove unused files and fix some typos
• Repair custom section rendering

Breaking changes

• The theme should now be installed as a Hugo module, please follow the Quickstart instructions
• New icon mechanism potentially requires user intervention, see here
• Images that are referenced by the theme must be moved from static to assets for the lazyimg module to resolve them correctly
• Theming and color maps have been changed

See migration steps for more information.

Special thanks

This release has been sponsored by @gutzbenj who runs @earthobservations with his friends, a GitHub organization dedicated to ease access to open weather data. Thanks! ❤️

Become a sponsor and support my open source projects!

---

This discussion was created from the release Osprey Delight v5.

[bluefander]

Hello @kdevo

Thanks a lot for your work!
I think I did what you wrote in the "Quickstart instructions", but for a reason I don't understand hugo seems to download version 4.0.0 of your theme.

go: no module dependencies to download
go: added github.com/kdevo/osprey-delight v4.0.0+incompatible
Start building sites … 
hugo v0.96.0+extended linux/amd64 BuildDate=unknown
Error: Error building site: failed to render pages: render of "home" failed: execute of template failed: template: index.html:16:15: executing "index.html" at <partial $partial $page>: error calling partial: "/tmp/hugo_cache/modules/filecache/modules/pkg/mod/github.com/kdevo/[email protected]+incompatible/layouts/partials/sections/blog.html:1:11": execute of template failed: template: partials/sections/blog.html:1:11: executing "partials/sections/blog.html" at <.Site.Params.enforceSinglePage>: nil pointer evaluating page.Site.Params
Built in 12 ms

Does this make any sense to you?

[kdevo]

Hi @bluefander,

thanks for the note!

Go Modules (and therewith Hugo Modules) require a change of the import path for every major version release (e.g. v4 -> v5).
I initially forgot to make the change, and now fixed it. v5.0.1 changes the import path to make it work again, and v5.0.2 also documents the change (check out the exampleSite's adjustments).

[kdevo]

I've also left some more notes here for everyone: #34 (comment)

[kdevo]

How to migrate from v4 to v5?

Take a look at the exampleSite config and especially these changes: b63998e. Then start up via hugo server and the latest v5 will be downloaded automatically.

If this doesn't work for some reason, explicitly download the correct v5: hugo mod get github.com/kdevo/osprey-delight/[email protected]

Steps to follow afterwards:

• Adjust data/icons.yaml to fit your needs as described here
• Move all images that are referenced by the theme from static to assets directory
• Optional: Try out a different color theme

How to update the theme in the future?

It's enough to just run hugo mod get -u github.com/kdevo/osprey-delight/v5. Hugo will get the latest minor/bugfix version automatically.

Whenever there is a new major version, the import path needs to be adjusted accordingly.

💡 A new major version will only be introduced when there is a breaking change that requires user intervention (will not happen often in the future).

[bluefander]

Another thing I can't figure out. I created an "assets" directory in the root directory of my hugo project, but I am getting this error:

hugo server -D
Start building sites … 
hugo v0.96.0+extended linux/amd64 BuildDate=unknown
ERROR 2022/05/01 13:17:29 image path ./assets/%!s(<nil>) does not exist
WARN 2022/05/01 13:17:29 lazyimg:
    Usage like:
    - {{ partial "lazyimg" "image.jpg" }}
    - {{ partial "lazyimg" (resources.Get "image.jpg") }}

    ...or more verbose by specifying a dict overriding the site.Params.lazyimg, e.g.:
    - {{ partial "lazyimg" (dict "resizer" "auto" "renderer" "lqip") }}
    - {{ partial "lazyimg" (dict "img" "image.jpg" "responsiveSizes" (slice "320px" "640px") "resizer" "responsive") }}

    Please ensure that image exists in ./assets directory.
Error: Error building site: failed to render pages: render of "home" failed: execute of template failed: template: index.html:5:7: executing "index.html" at <partial "body-top" .>: error calling partial: execute of template failed: template: partials/body-top.html:11:9: executing "partials/body-top.html" at <partial "logo-img.html" .>: error calling partial: execute of template failed: template: partials/logo-img.html:1:3: executing "partials/logo-img.html" at <partial "lazyimg" (dict "img" site.Params.logoBig "maxsize" (default "1200x" site.Params.Image.Logo.resize) "lqipsize" (default "120x" site.Params.Image.Logo.resizeLQIP) "resizeoptions" (default "q90 MitchellNetravali" site.Params.Image.Logo.resizeOptions) "alt" site.Title "class" "home-logo" "renderer" (default "webp" site.Params.Image.Logo.renderer) "resizer" (default "auto" site.Params.Image.Logo.resizer))>: error calling partial: execute of template failed: template: partials/lazyimg.html:41:22: executing "partials/lazyimg.html" at <partial (printf "resizer/%s" $params.resizer) $paramsWebP>: error calling partial: execute of template failed: template: partials/resizer/auto.html:7:17: executing "partials/resizer/auto.html" at <partial "resizer/simple" .>: error calling partial: "/tmp/hugo_cache/modules/filecache/modules/pkg/mod/github.com/hugo-mods/[email protected]/layouts/partials/resizer/simple.html:12:35": execute of template failed: template: partials/resizer/simple.html:12:35: executing "partials/resizer/simple.html" at <resources.Concat>: error calling Concat: slice []interface {} not supported in concat
Built in 8 ms

[kdevo]

Do you have an image for each of your gallery items defined?

[bluefander]

Sorry, obviously had some sort of confusion there -.-
Works.

[kdevo]

No worries, it was not very clear that the "old image support from static folder" is now dropped (and therefore the lazyimg module will always try to resolve an image). Your feedback is appreciated and led to some improvements in release notes as well as planned code changes already 👍