Render html file inside a page

Hi,
I’m currently using kirby for a creative computing and network culture class and I would like to use my current website to share with my prof the exercises we are doing in class. What I would like to achieve is fairly easy but I just can’t figure out how to do it… I just want to render some sort of single page website that contains a css, a js and an img folder so the structure would be similar to a one page website. Here’s the structure of the folder.

/content
   /cart-211
        /1-exercise-1
            /css
            /img
             index.html
             exercise.txt
        /2-exercise-2
        ...

The folder structure must be configured exactly this way and the href inside index.html must remain as untouched as possible. I have tried the solution proposed in this solution but all I get is a blank page. I also tried

 $page->file('index.html')->show();

which renders the page but I’m stuck at trying to map the other files to the html. Could someone please assist me in achieving what I’m trying to do

How do you reference the styles/images in your index.hml?

It should actually work like this for the styles:

<link rel="stylesheet" href="exercise-1/css/styles.css">

The same should actually work for images:

<img src="excercise-1/img/someimage.jpg" alt="">

i.e. if you use links relative to the current page.

But what is the whole point of this structure? Why use an index.html file?

You could go the art directed post route, above the call to the html file.

Not if you want to call your css in the index.html file, that’s only possible in the php template.

hrefing like this returns a 400 error unfortunately, my guess is that the browser is trying to fetch from cart-211/exercises/exercise-1, but cart-211 does not exist at the root of the folder. I found a workaround with

 $url = $page->file('index.html')->url();
 header('Location:' . $url);

Although it is definitely not the prettiest solution as the url reveals the internal structure of my website, it is satisfactory for me as there are probably only a couple of people who is going to check my website. However, I am open to other suggestion or try better solution.

Also, the idea of using an index.html is to ‘simulate’ the structure of a website with each exercises folder being the root folder of the website.

But wouldn’t that only make sense if the user would actually see the internal structure of the website? Which is not the case here, because what the visitor sees is a URL that displays some content, no index.hml in the URL.

Maybe I’m missing something, but I don’t really get the point of this. Unless maybe the user could then download the files and install on their own server as is.