bento
bento copied to clipboard
leonardofaria
Incomplete formatting and no disqus comments
Hi,
I'm using your theme to build my blog, when viewed locally the website seems fine but as soon as I use a service like Netlify or Render, some elements are not formatted correctly. For instance:
- The name of the website
- The tags for each post
- Disqus comments not loading
I got the Disqus comments to load, however, I needed to modify the formatting for the website title with regular HTML, tailwindCSS was not rendering correctly.
The tags are also formatted incorrectly with the orange link background not showing up at all
I believe I'm encountering the same issue deploying to Github Pages, there are some very obvious styling differences between running on the local hugo server vs. deployed to Github Pages.
Hard to know if there's an issue with the theme, hugo, or the build process. I did notice some differences in the CSS "header" locally vs remote:
Local CSS: /*!modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize*/
Remote CSS: /*!normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css*/
Edit: I think Tailwind is missing entirely on the remote build.
@mattdeluco I didn't manage to resolve this unfortunately, I wasn't really sure how to go about it since CSS isn't really my strong suit
@leonardofaria are there any special requirements for the build command? Right now my gh-pages.yml uses hugo --minify to build.
@starship9 I found a solution with help on the Hugo discourse forums: either you need to commit the resources directory in your project, or your automated build needs to include installing nodejs and running npm install to install node dependencies (like Tailwind.)
Here's my gh-pages.yml for an example.
@starship9 I ended up reverting the changes to my gh-pages.yml file and instead committing the resources/ directory with the CSS generated for the Bento theme.