Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/wayjam/hugo-theme-fluidity

A fluid and responsive Hugo theme.
https://github.com/wayjam/hugo-theme-fluidity

fluent-design gohugo hugo hugo-blog hugo-blog-theme hugo-theme tailwind tailwindcss tailwindcss-v4 theme

Last synced: 15 days ago
JSON representation

A fluid and responsive Hugo theme.

Host: GitHub
URL: https://github.com/wayjam/hugo-theme-fluidity
Owner: wayjam
License: mit
Created: 2024-12-01T13:11:51.000Z (2 months ago)
Default Branch: main
Last Pushed: 2025-01-12T13:10:59.000Z (21 days ago)
Last Synced: 2025-01-12T13:42:50.962Z (21 days ago)
Topics: fluent-design, gohugo, hugo, hugo-blog, hugo-blog-theme, hugo-theme, tailwind, tailwindcss, tailwindcss-v4, theme
Language: HTML
Homepage: https://wayjam.github.io/hugo-theme-fluidity/
Size: 101 KB
Stars: 0
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

# Theme Fluidity

[![hugo-theme-fluidity](https://img.shields.io/badge/Hugo%20Theme-%40Fluidity-blue)](https://themes.gohugo.io/hugo-theme-fluidity/)
[![Hugo](https://img.shields.io/badge/Hugo-%5E0.128.0-orange)](https://gohugo.io/)
![GitHub](https://img.shields.io/github/license/wayjam/hugo-theme-fluidity)
![GitHub code size in bytes](https://img.shields.io/github/languages/code-size/wayjam/hugo-theme-fluidity)

A fluid and responsive Hugo theme.

![screenshot](https://raw.githubusercontent.com/wayjam/hugo-theme-fluidity/main/images/tn.png)

## Features

- Fluent Design mixed with [Tailwind CSS](https://tailwindcss.com/)
- Search Support
- Code Highlight
- Dark Mode
- Responsive
- Archive Page

Checkout [demo](https://wayjam.github.io/hugo-theme-fluidity/) now.

## Installation

### Hugo Module

> https://gohugo.io/hugo-modules/use-modules/

```bash
hugo mod init github.com//
```

```yaml
module:
imports:
- path: github.com/wayjam/hugo-theme-fluidity
```

```bash
hugo mod npm pack && npm update
```

### Git Submodule

```bash
git submodule add https://github.com/wayjam/hugo-theme-fluidity.git themes/hugo-theme-fluidity
```

set theme in `hugo.yaml`

```yaml
theme: hugo-theme-fluidity
```

```bash
hugo mod npm pack && npm update
```

## Configuration

Site configuration see [exampleSite/hugo.yaml](exampleSite/hugo.yaml)

### About Page

Create a new page in the `content` directory, for example

### Archives Page

Create a new page in the `content` directory, for example

### Search Page

Create a new page in the `content` directory, for example

#### Google Search

```yaml
params:
search:
provider: google
```

#### PageFind

1. Step 1: Set the provider to pagefind

```yaml
params:
search:
provider: pagefind
```

2. Create a pagefind config file, for example

3. Install pagefind: `npm i pagefind`

4. Run pagefind before every build: `npx pagefind`

## License

[MIT](LICENSE)