Fork of @spf13's port of Mdo's excellent theme to Hugo https://brendan.abolivier.bzh/
philgs 9ea795e148 Lowercase variables for .Site.Params 10 yıl önce
archetypes adding archetypes to the existing themes 10 yıl önce
images removing old screenshot 10 yıl önce
layouts Lowercase variables for .Site.Params 10 yıl önce
static Hyde theme: sync with upstream to v2.0.0. 10 yıl önce
LICENSE.md Adding the hyde theme 10 yıl önce
README.md renaming chrome to partials 10 yıl önce
theme.toml bringing theme up to date for inclusion in the gallery 10 yıl önce

README.md

Hyde

Hyde is a brazen two-column hugo theme based on the Jekyll theme of the same name. It pairs a prominent sidebar with uncomplicated content.

Hyde screenshot

Contents

Options

Hyde includes some customizable options, typically applied via classes on the <body> element.

Sidebar menu

Create a list of nav links in the sidebar by assigning "menu=main" in the front matter.

Sticky sidebar content

By default Hyde ships with a sidebar that affixes it's content to the bottom of the sidebar. You can optionally disabled this by removing the .sidebar-sticky class from the sidebar's .container. Sidebar content will then normally flow from top to bottom.

<!-- Default sidebar -->
<div class="sidebar">
  <div class="container sidebar-sticky">
    ...
  </div>
</div>

<!-- Modified sidebar -->
<div class="sidebar">
  <div class="container">
    ...
  </div>
</div>

Themes

Hyde ships with eight optional themes based on the base16 color scheme. Apply a theme to change the color scheme (mostly applies to sidebar and links).

Hyde in red

There are eight themes available at this time.

Hyde theme classes

To use a theme, add anyone of the available theme classes to the <body> element in the default.html layout, like so:

<body class="theme-base-08">
  ...
</body>

To create your own theme, look to the Themes section of included CSS file. Copy any existing theme (they're only a few lines of CSS), rename it, and change the provided colors.

Reverse layout

Hyde with reverse layout

Hyde's page orientation can be reversed with a single class.

<body class="layout-reverse">
  ...
</body>

Author

Mark Otto

Ported By

Steve Francia

License

Open sourced under the MIT license.

<3