BUG: eleventy-load-css fails to handle a single stylesheet in subdirectory pages

[johnhunter]

Eleventy versions: 0.12.x .. 1.0.x

Minimal reproducable case: https://github.com/johnhunter/test-eleventy-load

When we have two top-level pages and one page in a sub-directory

index.md
contact.md
about/index.md

They all share a single layout that contains a stylesheet. When built, if we just have the top-level files then the a single css asset file is output as expected. However, with the nested source page:

Steps:

• Checkout the repo and npm install
• Run the dev build npm start

Expected:

• All pages contain a stylesheet link to a single css asset

Actual:

• The css asset file is output to _site/contact/assets
• The nested about/index page fails to transform the stylesheet link to the output css asset.
• The other pages have a 404 stylesheet link that assumes the file is output to _site/assets

[johnhunter]

Seems the problem is that when the template is processed it is not aware that the link is defined in a common layout. Ideally it should process the asset based on the layout file include but I don't think we will have enough information about the template includes. An alternative might be to support a root-relative link, e.g:

<link rel="stylesheet" href="/sass/styles.scss" />

We can then define its outputPath from the input dir so it should result in a single asset generated with the correct path. This feels a bit more idiomatic in generated html files.