Generated stylesheet link is incorrect

[adryzz]

Problem

I have a stylesheet, named whatever.css.

style = ["whatever.css"]

When adding routes however, let's say /blog/doesntmatter, the stylesheet path that the browser tries to load is /blog/doesntmatter/whatever.css, which is incorrect. In order to fix this, you can add a forward slash before the file name so the browser loads it from the path root instead of the current path

style = ["/whatever.css"]

However the dioxus cli strips that slash away in the generated index.html file, and thus this doesn't work anymore

Steps To Reproduce

Steps to reproduce the behavior:

• Create new project and add a stylesheet (whatever.css)
• In Dioxus.toml add the stylesheet with a forward slash before the file name (/whatever.css)
• Run the app

Expected behavior The generated html file should point to /whatever.css and not whatever.css A clear and concise description of what you expected to happen.

Screenshots

If applicable, add screenshots to help explain your problem.

Environment:

• Dioxus version: [v0.3]
• Rust version: [1.71.0-nightly (d0a4cbcee 2023-04-16)]
• OS info: [Linux]
• App platform: [web]

Questionnaire

• [x] I'm interested in fixing this myself but don't know where to start
• [ ] I would like to fix and I have a solution
• [ ] I don't have time to fix this right now, but maybe later

[ealmloff]

It seems more intuitive to make styles act as paths to the styles instead of links to where the styles are served. In the future, we could use the Dioxus.toml format to allow including styles for desktop an mobile applications as well. These platforms only use local assets, so they would need to interpret styles as a list of paths instead of a list of urls where the assets are served.

If you are interested in implementing this, you can change how the styles are inserted into the final HTML here in the CLI

[ealmloff]

collect assets is a better way to include styles in the future that does not have this issue: https://github.com/DioxusLabs/collect-assets. Here is an example that uses collect assets to include a style from your local path in a cross platform way: https://github.com/DioxusLabs/dioxus/blob/b1921cf17d68f981be84c775bc9ab2894a18b8c9/examples/file_explorer.rs#L21

We should probably depreciate the styles section now that we have a more reliable cross platform, cross package way of linking assets.