Skip to content

v7.0.0

Compare
Choose a tag to compare
@qwtel qwtel released this 24 Oct 09:31
· 1283 commits to master since this release

License Change

The free version of Hydejack is now GPL-3.0 licensed, which is a more restrictive license than MIT (but still Open Source). This was necessary because the two major components that make up Hydejack, hy-push-state and hy-drawer, are now GPL licensed in turn.

How will this affect you?

  • You can continue to use previous versions of Hydejack according to their license (MIT).
  • If you upgrade, keep the source code in a public repository and make sure you include the new LICENSE.md file.
    DO NOT publish the new code with an old license.
  • If you upgrade and make changes to the source code, you are required to make those changes available to the public
    under a GPL-3.0 compatible license.

The full license text is available here.
You can read a summary on tl;drLegel.

If this change is not acceptable to you, DO NOT upgrade or consider buying a PRO license.

Note that the above does not constitute legal advice.

Breaking

This is a major release, but almost all options and APIs that were described in the docs continue to work.
Some names have changed and are no longer mentioned in the docs, but they are still part of the code and continue to work.

That being said, you should be aware of these (small) breaking changes:

  • (Fav-)icons are now located in /assets/img/icons/. To change the (fav-)icon of the page, edit the images in the folder.
    Buyers of the PRO version get a .psd file to assist the creation.

  • Changed the way tables work, so that they do the right thing more often.
    Tables are now scrollable by default, but small tables are no longer stretched to span the full width.
    Setting scroll-table on a larger table is sill recommended, as it will set white-space: nowrap.

  • Autogenerated ids for posts now look like post-2017-01-01-my-title instead of post-2017/01/01/my-title.

  • Event names described in the scripting chapter have changed from y-push-state-* to hy-push-state-*,
    except y-push-state-animationend, which has been removed. See the docs for more.

Changes

  • image has been renamed to accent_image, but image continues to work unless you add the jekyll-seo-tag plugin.
    This change was necessary because jekyll-seo-tag uses the image keyword to set the thumbnail image of a page.
    While it may be desirable to use the same image for both the sidebar and the thumbnail,
    the new preferred way to set sidebar images is by using the accent_image key.

  • color has been renamed to accent_color to be consistent with the new accent_image key, but color continues to work.

  • Various options that do not make sense outside the context of Hydejack (like no_push_state or no_drawer)
    have been moved under a common hydejack key. However, the old options continue to work.

    hydejack:
      no_push_state: false
      no_drawer: false
  • All plugins (gems) are now optional.
    The gem-based version of the theme no longer uses any plugins by default,
    while the download version follow a "batteries-included" approach and enables some by default.

  • Links to the /assets/ folder are no longer intercepted by the push state features,
    which means clickable images and download links should work fine now.

  • Reader views in Firefox and Safari have an easier time recognizing the main content.

  • [Internal] No more <style> tags in the body.

  • [Internal] Content that is generated via JS (error pages, loading, etc...) is now cloned from template tags,
    where it is easier to modify (but before you do, check out the new _data/strings.yml file).

  • [Internal] Changed how CSS code is organized.
    Previously there were two versions of each CSS file for each 'topic',
    one containing core styles to be inlined into the page, the other containing those fetched asynchronously via link tag.
    Now there is only one file per topic, with the parts to be inlined/linked marked with comments.
    A script has been added to "split" the CSS into the inline/link parts.
    Note that this does not affect your my-*.scss files.

  • [Internal] Many CSS classnames have changes, specifically those that would conflict with Bootstrap class names.

  • [Internal] Many files in _includes have been reorganized, specially head.html and body.html have been broken up into smaller parts.

  • [Internal] The y-drawer component (MIT) has been replaced with the hy-drawer component (GPL-3.0).

  • [Internal] The y-push-state component (MIT) has been replaced with the hy-push-state component (GPL-3.0).

Added

  • The theme now has support for the jekyll-seo-tag plugin.
    To use this gem, make sure you use the latest Gemfile and Gemfile.lock and run bundle install.
    In your config file, add jekyll-seo-tag to plugins (formerly called gems).

  • All texts that were previously hard-coded into the theme can now be configured via _data/strings.yml.
    This makes it possible to change certain phases without having to change source files,
    but it should also make it easier to use Hydejack with other languages.
    Time and date formats can also be configured, using Ruby's
    format directives.

  • The lang key now accepts values like en-us or de_AT.

  • Made the site "mobile web app capable"

    • Added manifest.json for "Add to Homescreen" support on Android
    • Added theme-color meta tag that matches the accent_color and changes dynamically
    • Added apple-mobile-web-app-* meta tags
    • Added ieconfig.xml for "Pin to start menu" support in Windows 10.
    • Old icons and new ones are now located in assets/icons.
  • Hydejack now marks up content as structured data, to the extent possible.
    The resume is provided as https://schema.org/Person
    as well as hCard,
    while projects are provided as https://schema.org/CreativeWork.
    You can use the Structured Data Testing Tool to see the results.

    If you do not want to expose your data in machine-readable form, you can set the no_structured_data flag to true in your config file.

    hydejack:
      no_structured_data: true

    Note that this only applies to the resume and project layout, not the data generated by by jekyll-seo-tag
    (Facebook Open Graph and Twitter cards).

  • [PRO] Added "big projects". You can make a project card span the entire content width (instead of half),
    by setting big_project to true in the project's front matter.

  • [PRO] The welcome layout now has a content_separator option,
    which allows content to move below the "Selected/Latest Projects" and "Selected/Latest Posts" section.
    Usage:

    ---
    layout: welcome
    content_separator: <!--more-->
    ---
    
    Content above
    
    <!--more-->
    
    Content below
  • [PRO] The PRO version now has built-in support for Tinyletter.
    To show a newsletter subscription box below each post, set tinyletter: <username> in your config file.
    If you want to use a different mailing provider, you can add your own form in _includes/my-newsletter.html.

  • [PRO] The PRO version now includes styles for input elements, using the same CSS class names as Bootstrap.
    Check out the Bootstrap docs to learn more.

  • [PRO] Added links to random posts at the bottom of each post. This can be beneficial for search engine rankings and content discovery.
    You can remove them with the new post_addons option (see below).

  • [PRO] If a endDate is missing in your resume.json, it will render as "<startDate> -- present".
    You can change the wording in the new strings.yml file.

  • Added support for jekyll-avatar.
    If this plugin is enabled in your config file, it will show the avatar of your github account
    (author.social.github, author.github.username author.github).

  • Added support for jekyll-gist.

  • You can now add links to external sites in the sidebar.
    Create a file like something.md and add a title, menu, order (optional) and a redirect_to field to the front matter, e.g.:

    ---
    title: External
    menu: true
    redirect_to: https://example.com/
    ---

    You may combine this with the jekyll-redirect-from plugin
    to generate a redirect page, but this is optional.

  • You can now configure the order of complementary content below posts and projects.
    By default, Hydejack will show the author first (if any), the newsletter box next (if any),
    and related posts/projects last.

    hydejack:
      post_addons:    [about, newsletter, related, random]
      project_addons: [about, newsletter, other]

    To change the order in the output, change to order in the array.
    You can also drop entries from the output by removing them from the list.

  • Added an error page that is shown when client-side network errors occur. It contains a link to retry loading the page.
    Previously, the browser's default error page would have been shown.

  • Added no_description option to pages to prevent the content of description fields to show up in the output.
    This allows you to use the description field in the front matter to set descriptions for search engines and sharing on social media,
    without having to worry about the output.

    You can activate this for all pages by adding to your config file:

    defaults:
      - scope:
          path: ''
        values:
          no_description: true
  • Added a new option called no_inline_css.
    When true, Hydejack will generate a single CSS file to be fetched (synchronously) via link tag,
    instead of inlining half and including the rest via link tag.

    This option may be useful when serving content over HTTP/2, but you should perform your own tests.
    For more on inlining CSS, see this.

    hydejack:
      no_inline_css: true
  • Added dns-prefetch links to Google Fonts and Google Analytics domains to further boost page load speed.
    These are only included when using Google Fonts/Analytics.

  • You can now define an arbitrary CSS background for the sidebar instead of just images, e.g.:

    accent_image:
      background: 'linear-gradient(to bottom, rgba(35,62,76,1) 0%,rgba(60,146,158,1) 50%,rgba(213,213,212,1) 100%) #4fb1ba'
  • Category and tag pages can now have arbitrary content (to be shown above the list).

  • Links can now be marked for FLIP animations by adding the flip-title class. Use this for links that have
    the exact same text as the title of the page they are linking, e.g. [NOTICE](NOTICE.md){:.heading.flip-title}.

Performance

  • Reduced building time during development.
    Roughly 50% of the time was spent rebuilding the inline CSS, which is now built once and included via link tag.
    Production builds still inlines CSS, so the building speed remains unchanged.
    For more on how to improve building speeds, see here.

Design

  • The default background image is no longer anti-selling the theme...

  • Code blocks, math blocks and tables now use as much space as there is available on the screen.
    Limiting the line length makes sense for paragraphs, as they are more difficult to read
    when they span the entire length on a large display,
    but it is less useful for content, like tables, long formulas or code.

    If you do not like this change, you can set no_break_layout to true in your config file.

    hydejack:
      no_break_layout: true
  • Margin below code blocks, math blocks and tables increased from 1rem to 2rem.

  • Gray text now has a higher contrast ratio:
    I don't want anybody to "suffer from design".

  • Reduced the number of responsive breakpoints.

  • Added a hover effect on project images.

  • On mobile, footnotes will be shown as [1] instead of superscript, making them easer to tap.

  • The sidebar now has a subtle shadow on mobile, to indicate that it can be drawn from the side.

  • The sidebar now has less margin on the sides.

  • The sidebar now fits 5 social media icons, up from 4.

  • The description in the sidebar now has a smaller font size when it is longer than 100 characters.
    This is to encourage writing a longer description for search engines (~160 characters).

  • h1, h2 and h3 headings now have different line-heights to improve readability when they span multiple lines.

  • Marks on external links are now less opaque, but have a hover effect.

  • More responsible usage of font_heading in resume layout.

  • When hovering over a headline, a # link will appear, so that readers can link to individual headlines.

  • Changed the loading spinner to use a single icon instead of several animated divs.

Fixes

  • When linking to an internal document that doesn't match the regular content structure,
    the 'hot replacement' will no longer get stuck, and reload the page instead.
  • Fix jumping to # links after navigating to a new page.
  • Fix jumping to # links in MS Edge.
  • Fixed a bug on iOS were scrolling was blocked after closing the drawer.
  • Fixed a bug where the image used during the project FLIP animation would note be replaced with the higher resolution image
    after the animation in certain browsers.
  • The drawer is now less likely to be opened by accident.