serg / yourfolio Goto Github PK

Dear @serg,

This is not a bug, but in terms of security I was checking my page at https://webbkoll.dataskydd.net

Two things I don't get rid of:

1. Content Security Policy

Although I added <meta http-equiv="Content-Security-Policy" content="default-src 'none' *; script-src 'unsafe-inline' 'self' *; style-src 'unsafe-inline' 'self' *; base-uri 'none' 'self' *; form-action 'none' *; form-action 'self' *; object-src 'none' *; frame-ancestors 'none'"> in basof.html I get the following issues:

2. SRI

Maybe this could be implemented too in a future update.

Keep up the good work!

Dear @serg,

Sorry it's me again. I found another problem which used to be working before the 16 Nov. 20 changes. If you change the order of the picture arrangements from

..
class: short-col
...
class: wide-col
...
class: wide-col
..
class: short-col
..

to

..
class: wide-col
...
class: short-col
...
class: short-col
..
class: wide-col
..

the arrangement of the project pictures gets broken in Mozilla Firefox. Like this:

In Safari and Chrome it works. In my old version before the 16 Nov 2020 update it used to work to change the order, also in Mozilla Firefox. It's a bit of a shame, because I think Firefox is the best browser for this page.

I would love to find the error myself, but I don't know much about what is happening under the hood.

Please find the modified version to see for yourself here:

website standard.zip

Description

The navigation to the root of the website is bogus when the website isn't located at the root of a given domain (e.g. https://domain.tld/website/).

How to reproduce

1. Create a new hugo website with hugo new site some_name.
2. Install the yourfolio theme via git, following the instructions at https://github.com/serg/yourfolio#installation.
3. Configure the website's BaseURL in config.yaml to https://domain.tld/website/.
4. Build the website.
5. Place the newly built website in the directory served at https://domain.tld/website/.
6. Navigate to the address https://domain.tld/website/ with a browser.
7. Click on the website logo.

❌ What is happening:

The user is brought back to the root of the domain (e.g. https://domain.tld/).

✔️ What is expected:

The user is brought back to the root of the website (e.g. https://domain.tld/website/).

I was wondering how you could easily embed a YouTube-Video to play on the site.

If possible, please provide more information on how to customise fonts and font color.

I would suggest a small footer for links to imprint and data privacy pages. At the moment I am using a modified contact page, but this not a very neat solution, because I don't want these two pages to be so prominent in the Menu.

It would be great if you could include a layout template for show-casing a single project. (Project detail page)

Hi Serg,

First of all, many thanks for your last commit, now the project images are perfectly inline if you add additional projects. But I realized another thing, when I updated the commits from 16 Nov 2020. It looks like the images don't scale in panorama mode anymore when you narrow the browser window or open it on a smartphone. I also tried a fresh install with the last yourfolio download with the standard pictures. It's the same. Maybe you missed something when yo restructured the styles?

Kind regards,
Mark

A few notes from trying this on Linux with following extended binary

Hugo Static Site Generator v0.74.2-48565DE6/extended linux/amd64 BuildDate: 2020-07-17T17:32:27Z

• it definitely doesn't work out of the box, but as implied in the main repo you need to use the exampleSite to test out this theme, ok

Here's the error I see trying the quickstart guide and seeing if it works, nope

hugo server
Building sites … WARN 2020/07/18 20:47:46 found no layout file for "HTML" for kind "taxonomy": You should create a template file which matches Hugo Layouts Lookup Rules for this combination.
WARN 2020/07/18 20:47:46 found no layout file for "HTML" for kind "taxonomy": You should create a template file which matches Hugo Layouts Lookup Rules for this combination.
Built in 12 ms
Error: Error building site: failed to render pages: render of "home" failed: execute of template failed: template: index.html:3:6: executing "main" at <partial "navigation" .>: error calling partial: "/home/admin/Documents/webdev/git-sites/hugotest/quickstart/themes/yourfolio/layouts/partials/navigation.html:2:25": execute of template failed: template: partials/navigation.html:2:25: executing "partials/navigation.html" at <len .Site.Menus.main>: error calling len: reflect: call of reflect.Value.Type on zero Value

Then I google the error and find a thread showing this refers to a type of content that is failing, so I check out the config.yaml site from exampleSite, ah I see some changes, looks like disableKinds line is what I need, so I try it out, however after adding this line

disableKinds: [RSS, taxonomy, taxonomyTerm]

However I see an error that explains that Hugo 0.73.0 made a change to the behavior of "taxonomy" value, but I don't have enough debugging skill to understand what different paramter I'm supposed to use instead of "taxonomy"

hugo server
ERROR 2020/07/18 21:00:56 You have the value 'taxonomy' in the disabledKinds list. In Hugo 0.73.0 we fixed these to be what most people expect (taxonomy and term).
But this also means that your site configuration may not do what you expect. If it is correct, you can suppress this message by following the instructions below.
If you feel that this should not be logged as an ERROR, you can ignore it by adding this to your site config:
ignoreErrors = ["error-disable-taxonomy"]
Building sites … WARN 2020/07/18 21:00:56 found no layout file for "HTML" for kind "section": You should create a template file which matches Hugo Layouts Lookup Rules for this combination.
Built in 12 ms
Error: Error building site: failed to render pages: render of "home" failed: execute of template failed: template: index.html:3:6: executing "main" at <partial "navigation" .>: error calling partial: "/home/admin/Documents/webdev/git-sites/hugotest/quickstart/themes/yourfolio/layouts/partials/navigation.html:2:25": execute of template failed: template: partials/navigation.html:2:25: executing "partials/navigation.html" at <len .Site.Menus.main>: error calling len: reflect: call of reflect.Value.Type on zero Value

At this point I've pretty much given up on trying to use this theme as it seems outdated and partially broken, but it is beautiful and I love the example site, so I may come back to this, hoping serg might try and help fix this to keep this theme up to date, if interested. Or perhaps I haven't followed the exampleSite properly, in which case I do apologize if I've missed something, but I do feel I've spent a decent bit of time trying to set this up and either:

• the setup instructions are sub-par in my opinion, OR
• due to changes in Hugo and how disableKinds parameter (or some other config paramter) works, this theme is not up to date and cannot be used "out of the box"

Cheers

Hello,

Thank you for creating this great theme! I may have encountered an issue and I am wondering if this is a bug. I noticed that whenever I compress the browser window, the position and size of the header image change when I revert back to the maximum browser size. I thought this was only a problem when I ran the theme via localhost:1313, but I tried doing this on the demo page via the Hugo themes page and the same results happened. I attached some snapshots below from the demo page (hugo themes).

Here's a snapshot of the demo page when window size is maximized:

Here's a snapshot of the demo page when the browser window is compressed:

Here is a snapshot of the demo page, browser window size is maximized after compressing the browser window (header image noticeably smaller):

The header image reverts back to its original form when I reload the page. I'm wondering if anyone else using the theme encountered this. I suppose addressing this issue would involve changing img in the critical.scss file but I'm not sure if i'm on the right track with my thinking or how I'd proceed with addressing this issue.

Thanks again for creating this webpage!

Dear @serg ,

I was wondering how I could deactivate the overlay text for projects, maybe even the accent color in responsive mode. The reason is: In my opinion it doesn't make sense, because a hover on a smartphone is not possible, and sometimes it just gets stuck. So I would like in responsive mode that the project images don't show any text or color. Maybe you could give me a hint.

If this is not so easy to do, maybe you can tell me how to change the font size for the type section.

EDIT: Alternatively it could be also nice to swipe to read the overlay text or click once to read the text and then click a second time to go to the link. It's just an idea.

All the best!
Mark

Hi @serg, I wanted to add another project to my website. So to try out the layout,I copied the first project entry and put it after the last project entry like this:

• title: Strato
  type: wed design
  link: https://unsplash.com/photos/hpjSkU2UYSU
  image:
  url: works/strato.jpg
  alt: The Strato web design theme
  media: "(max-width: 46.25em)"
  params:

  • options: 1130x590
  • options: 848x443
  • options: 565x420
  • options: 360x318 Left

• title: Analytik
  type: UI/UX
  link: https://unsplash.com/photos/yeB9jDmHm6M
  class: short-col
  image:
  url: works/analytik.jpg
  alt: The Analytic web design theme
  media: "(max-width: 46.25em)"
  params:

  • options: 364x590 Top
  • options: 848x443 Top
  • options: 565x420
  • options: 360x318

• title: Friends
  type: Product Development
  link: https://unsplash.com/photos/ir5lIkVFqC4
  class: wide-col
  image:
  url: works/friends.jpg
  alt: The Friends theme
  media: "(max-width: 46.25em)"
  params:

  • options: 746x590 Left
  • options: 848x443 Top
  • options: 565x420 Left
  • options: 360x318 Center

• title: Food
  type: web design
  link: https://unsplash.com/photos/JVSgcV8_vb4
  class: wide-col
  image:
  url: works/food.jpg
  alt: The Food website for recipes
  media: "(max-width: 46.25em)"
  params:

  • options: 746x590 Center
  • options: 848x443 Center
  • options: 565x420 Center
  • options: 360x318 Center

• title: StatApp
  type: UI/UX
  link: https://unsplash.com/photos/nJX74kn1yn4
  class: short-col
  image:
  url: works/statapp.jpg
  alt: The application for statistic
  media: "(max-width: 46.25em)"
  params:

  • options: 364x590 Left
  • options: 848x443
  • options: 565x420 Center
  • options: 360x318 Center

• title: Strato
  type: wed design
  link: https://unsplash.com/photos/hpjSkU2UYSU
  image:
  url: works/strato.jpg
  alt: The Strato web design theme
  media: "(max-width: 46.25em)"
  params:

  • options: 1130x590
  • options: 848x443
  • options: 565x420
  • options: 360x318 Left

The sixth project also appears on index.html, but unfortunately the picture is a little bit too small in regards to the other grouped pictures. Any idea how I can make it inline with the other 5 project pictures?