GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → leonardofaria → bento

leonardofaria / bento

Licence: MIT license
A minimalist theme for Hugo, build with Tailwind CSS - https://bento-hugo-theme.netlify.app/

Programming Languages

HTML
75241 projects
CSS
56736 projects
javascript
184084 projects - #8 most used programming language

Labels

hugohacktoberfesttailwindcss

Projects that are alternatives of or similar to bento

hugo-starter-tailwind-basic
A basic and simple to set up Hugo with TailwindCSS starter project.
Stars: ✭ 80 (+37.93%)
Mutual labels:  hugo, tailwindcss
Hugo Theme Tailwindcss Starter
Starter files for a Hugo theme with Tailwindcss
Stars: ✭ 187 (+222.41%)
Mutual labels:  hugo, tailwindcss
Hugo Eureka
Eureka is a feature-rich and highly customizable Hugo theme.
Stars: ✭ 239 (+312.07%)
Mutual labels:  hugo, tailwindcss
material-tailwind-kit-react
Free and Open Source UI Kit for Tailwind CSS and React based on Google's Material Design.
Stars: ✭ 45 (-22.41%)
Mutual labels:  tailwindcss
hugo eiio
Hugo Blog Theme
Stars: ✭ 19 (-67.24%)
Mutual labels:  hugo
pingping
Building a real world SaaS with Laravel, TailwindCSS and VueJS
Stars: ✭ 97 (+67.24%)
Mutual labels:  tailwindcss
stencil-tailwind-plugin
Plugin for using tailwindcss with StencilJS
Stars: ✭ 17 (-70.69%)
Mutual labels:  tailwindcss
eslint-plugin-tailwind
ESLint rules for Tailwind CSS
Stars: ✭ 97 (+67.24%)
Mutual labels:  tailwindcss
forty
Forty theme - Hugo theme ported from HTML5UP origrinal theme called Forty.
Stars: ✭ 116 (+100%)
Mutual labels:  hugo
hugo-theme-iris
Hugo IRIS Theme - Portfolio and Blog
Stars: ✭ 49 (-15.52%)
Mutual labels:  hugo
react-native-whirlwind
Whirlwind is a utility-first styling framework specifically designed for React Native. It is heavily inspired by Tachyons and Tailwind CSS and uses low-level building blocks for rapidly building custom designs.
Stars: ✭ 91 (+56.9%)
Mutual labels:  tailwindcss
graphite
✍️ A local-first Markdown note-taking app built with Vue.js, Tailwind CSS, and Electron.
Stars: ✭ 17 (-70.69%)
Mutual labels:  tailwindcss
react-storefront
An open-source storefront in React.js with Next.js. Built for Headless Commerce, using a modern stack with TypeScript, GraphQL, Apollo, and Tailwind CSS.
Stars: ✭ 265 (+356.9%)
Mutual labels:  tailwindcss
postcss-typed-css-classes
PostCSS plugin that generates typed entities from CSS classes for chosen programming language.
Stars: ✭ 12 (-79.31%)
Mutual labels:  tailwindcss
twin.examples
Packed with examples for different frameworks, this repo helps you get started with twin a whole lot faster.
Stars: ✭ 320 (+451.72%)
Mutual labels:  tailwindcss
hugo-identity-theme
Little profile/card-style template for Hugo. Based on Identity by HTML5 UP.
Stars: ✭ 87 (+50%)
Mutual labels:  hugo
animated-tailwindcss
A configuration to use Animate.css with Tailwind CSS.
Stars: ✭ 75 (+29.31%)
Mutual labels:  tailwindcss
headlesscommerce.org
Headless Commerce resources
Stars: ✭ 25 (-56.9%)
Mutual labels:  tailwindcss
Limg
An image hosting service powered by Laravel
Stars: ✭ 41 (-29.31%)
Mutual labels:  tailwindcss
react-datepicker
A Datepicker built using Tailwind and react-popper
Stars: ✭ 31 (-46.55%)
Mutual labels:  tailwindcss
View All Similar Projects ➔

Bento Hugo Theme

Buy me a coffee

A minimalist theme for Hugo, built with Tailwind CSS.

Demo: Bento demo site - My personal website

Theme screenshot

Features

  • Clean: inspired by Casper, Medium and other minimalist design ideas
  • Responsive
  • Super-fast - 100% in Lighthouse tests
  • Tailwind CSS with PostCSS: super tiny CSS file
  • Google Analytics, Fathom Analytics, Umami and Disqus integration
  • Syntax Highlighting with GitHub theme
  • Full content RSS
  • Turbolinks: no page refresh
  • Support to custom links in the top bar
  • Subtle animations
  • Check all features live and learn more about customization

Installation

Inside the folder of your Hugo site run:

$ git submodule add https://github.com/leonardofaria/bento.git themes/bento

For more information read the official setup guide of Hugo.

Getting started

After installing the theme successfully it requires a just a few more steps to get your site running.

The config file

Copy the config.toml in the exampleSite to the root of your Hugo site. Change strings as you like.

The package.json file

Copy the package.json in this folder to the root of your Hugo site and run:

$ npm install # or yarn install

Local preview

In order to see your site in action, run Hugo's built-in local server:

$ npm run dev

Now enter localhost:1313 in the address bar of your browser.

Customization

The home page

The home page will show the headline, description and a list of all posts.

If you don't like this setup, in your Hugo website you can create a layouts/index.html if the content you like.

Writing posts

Write posts using Markdown. You can also add HTML and use TailwindCSS classes for custom styles.

The theme has support to categories and tags. Tags will be shown in the archives page.

Learn more about writing posts in the live demo website.

Update the theme

Inside the folder of your Hugo site run:

$ git submodule update --remote --merge

Contributing

Have you found a bug or got an idea for a new feature? Feel free to use the issue tracker to let me know. Or make directly a pull request.

License

This theme is released under the MIT license.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].