When testing locally, all the pages render properly. But when loaded to github pages, only the home page renders with the theme. And clicking a link to open a sub-page doesn't load the theme for the sub-page.
However, if I load the sub-page directly using its full link in a new browser tab, the theme is applied.
Here are the info:
Home page: https://deepworkmonk.com
Sub-page: https://deepworkmonk.com/blogs/books-i-recommend/
Code: https://github.com/meenaren/DeepWorkMonkWebsite/blob/main/_config.yml
How do I fix this issue?
Let's dissect the two cases:
Slashed: https://deepworkmonk.com/blogs/books-i-recommend/
Your _posts category generates pages using your default permalink: /blogs/:title/ (notice the slash at the end). The slashed URL is the correct URL, given your permalink as configured.
Note that if you have another category, it will also generate it under /blogs/, so it's not a great default permalink setting. Moving your _posts to a blogs collection, and using a proper permalink for the collection as described here would be better, but this is not the source of the current issue.
Unslashed: https://deepworkmonk.com/blogs/books-i-recommend
Jekyll copies all non-excluded files, and you have blogs/books-i-recommend.html file. I believe GitHub Pages automatically guesses the .html extension and just serves this file. So, it is not that your theme is not being applied; it is that you are displaying a different file entirely.