Injecting CSS into HTML
Injecting CSS follows the same approach as injecting JavaScript. We will have a CSS tag in the HTML file that will be replaced with the CSS from the file. To achieve this, we must carry out the following steps:
- Add CSS tags to our HTML file.
- Create a base CSS file for the whole app.
- Create a CSS file for our main view.
- Update our Rust crate to serve the CSS and JavaScript.
Let us have a closer look at the preceding steps by initially adding CSS tags to our HTML files with the following sections.
Adding CSS tags to our HTML file
First of all, let's make some changes to our templates/main.html file:
<style> Â Â Â Â {{BASE_CSS}} Â Â Â Â {{CSS}} </style> <body> Â Â Â Â <div class="mainContainer"> Â Â Â Â Â Â Â Â <h1>Done Items</h1> Â Â Â Â Â Â Â Â <div id="doneItems...