Learn how to use Connect.Koi to ensure your module/temlate has the right CSS frameworks, to either auto-include otherwise, show messages to the admin or generate different output. This uses Connect.Koi.
Some notes before we start
Koi works like magic behind the scenes, ensuring that your component knows what CSS-framework is already included, and can adapt its behavior.
For this to work, the theme must communicate what framework it's using, by including a koi.json file as explained in the docs. This is included in the default DNN themes since DNN 9.2, as well as in Bootstrap Instant, nvQuickTheme and many other.
Some themes may not include that file, so your best bet is to always have something which either alerts the user, that this is missing, or automatically adds your framework, if it can't detect what's happening.
Source Code of this file
Below you'll see the source code of the file. Note that we're just showing the main part, and hiding some parts of the file which are not relevant for understanding the essentials. Click to expand the code
@inherits Custom.Hybrid.Razor14
<!-- unimportant stuff, hidden -->
@Html.Partial("../shared... <!-- unimportant stuff, hidden -->
@* Footer *@
@Html.Partial("../Shared/Layout/FooterWithSource.cshtml", new { Sys = Sys })