Pico shows content without proper layout after theme installation

Question

Pico shows content without proper layout after theme installation

lukaswe opened this issue 2 years ago · comments

I've installed the pico theme and hugo-extended as documented in readme on my archlinux system.
building the example site is successful in terms of error messages:

$ hugo server --disableFastRender
Start building sites … 
hugo v0.92.0-B3549403+extended linux/amd64 BuildDate=2022-01-12T08:23:18Z VendorInfo=gohugoio

                   | FR | EN  
-------------------+----+-----
  Pages            | 18 | 18  
  Paginator pages  |  0 |  0  
  Non-page files   |  0 |  0  
  Static files     | 39 | 39  
  Processed images |  0 |  0  
  Aliases          |  2 |  1  
  Sitemaps         |  2 |  1  
  Cleaned          |  0 |  0  

Built in 3233 ms
Watching for changes in /home/user/hugo_pico_test/{archetypes,assets,content,package.json,static,themes}
Watching for config changes in /home/user/hugo_pico_test/config.toml
Environment: "development"
Serving pages from memory
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop

however the preview in my browser refers to some mis-interpration of css:
Resizing the browser window doesn't change anything. I tried multiple browsers including upload to my webserver.

Roman Kobosil commented 2 years ago

same here

Alexandre Negrel · Answer 1 · Fri May 27 2022 20:09:43 GMT+0800 (China Standard Time)

Could you provide more information as I'm not able to reproduce the issue. Do you have all the dependencies installed (npm, postcss, ...) ? Are you running a web server or hugo server ?

Roman Kobosil · Answer 2 · Fri May 27 2022 22:24:54 GMT+0800 (China Standard Time)

Hi,

thanks for the fast response. I start the project with "hugo server".

hugo v0.99.1+extended darwin/amd64 BuildDate=unknown
npm 6.14.17
node v14.19.3

Roman Kobosil · Answer 3 · Fri May 27 2022 22:32:24 GMT+0800 (China Standard Time)

Of course, I also ran "./setup.sh" and "./update.sh" before that. I installed the dependencies again by hand. There are no errors in the JS console or network tab of the safari web tools.

Alexandre Negrel · Answer 4 · Fri May 27 2022 22:55:59 GMT+0800 (China Standard Time)

Could you show the content of the HTML head tag pls ?

Roman Kobosil · Answer 5 · Fri May 27 2022 22:57:17 GMT+0800 (China Standard Time)

In the same time, I managed to get the website to display correctly. I deleted the node_modules folder and called the ./setup.sh script again in the root and /themes/pico subdirectory.

Alexandre Negrel · Answer 6 · Fri May 27 2022 23:03:46 GMT+0800 (China Standard Time)

Great !
I will close the issue. If you did something that is not part of the "Getting started" section of the README pls tell me so I can add it.

lukaswe · Answer 7 · Mon Jun 13 2022 02:54:05 GMT+0800 (China Standard Time)

Hello @NullP0interEx ,
thanks for that hint. I was able to get pico running after i ran setup.sh in the pico theme directory.
@negrel I somehow didn't understand form the "Getting Started" secton on https://themes.gohugo.io/themes/hugo-theme-pico/ that this re-run in the theme folder is necessary.
I think there are two ways to accommodate that:

either add a step in the Getting Started section
or update the script so that it performs that step automatically.

Or did I miss something in the docu?

However: Thanks, it works now also for me!

Nico Teufel · Answer 8 · Fri Oct 21 2022 17:01:25 GMT+0800 (China Standard Time)

A workaround for this issue is calling yarn install or npm install in the themes/pico directory and the script.sh on root level.