Hugo

PaperCSS theme feedback

Hey guys,

So long story short, whenever I create a new theme, I usually use it on my personal website and am able to work out all the kinks. But in this case, I stumbled upon a CSS library that I really liked so I wanted to make it into a theme.

If you have a spare moment, would you take it for a spin? Am looking for feedback: design, usability, “does it even work for scenario x”, any feedback really.

Here’s the source and demo.

Thanks :black_heart:

1 Like

That’s a nice looking theme @zwbetz with a slight touch of a comic :slight_smile:

To add my 2 cents: the list of links on the about page of your demo could have a bit more spacing between the list elements. The underlined links are too dense which makes them a bit hard to read.

Ha thanks @digitalcraftsman

Yeah agreed. Those are the default PaperCSS styles so I’m gonna look into overriding them. Maybe just do a simple bottom border

1 Like

Playing with this some more, have updated:

  • anchor styles to plain underline
  • each blog post gets a toc by default (documented how to disable in readme)
  • added a card shortcode for page resource images
  • added badge counter for tags listing

This is an excellent looking theme! I think I may be using this as I migrate my blog to Hugo!

Thanks!

1 Like

I have my site updated now :slight_smile: using Papercss. I love this theme.

https://blog.rainaldi.dev/

@ljrain Your site looks great man :slight_smile:

My one critique is that your “Home” and “Blog” pages are the same, so perhaps consider making the Blog page more of an archive that just lists blog post titles. Or do away with it totally and just keep your home page.

1 Like

Great suggestion! Thank you!!

I have the home page fixed now. It looks like I was missing the default layouts in my local layouts that was preventing it from showing.

I am a newbie to Hugo and am trying to figure out how to add a custom CSS without overriding your css for the theme. I thought I could add it to \static\css\custom.css but it doesn’t inject it it. I then tried to rename it to raindev.css and use the config like below

customCss: css/custom.css, css/raindev.css

UPDATE: I changed the config to
customCss: css/raindev.css
And it works.

Any suggestions?

Thanks in advance

Yep, your homepage looks better now.
For the custom CSS, you have some options

(1) Update the existing CSS file at /assets/css/custom.css, or

(2) Add your CSS file at /static/css/raindev.css then create a link to it in the head partial, for example

<link rel="stylesheet" type="text/css" href="/css/raindev.css">
1 Like