Implementation

Harmony UI was designed to be a framework of .css and .js that would be implemented to a compatible project simply by including a couple of shared resources in your project.

Setup For .Net Projects

Choose Snippet According To Appropriate Version

<!-------    .NET 4.8 IMPLEMENTATIONS - Add to Template   ------->
@{
var HarmonyURL = System.Configuration.ConfigurationManager.AppSettings["HarmonyURL"];
}
<!-------   .NET 8 IMPLEMENTATIONS - Add to Template   ------->
@inject IConfiguration _config
  @{
      var HarmonyURL = _config["HarmonyUI:HarmonyURL"];
  }
<!---------------------------------------------->
          



DLIFLC CDN

Copy and include the following snippet containing the favicon, stylesheet, and javascript in your HTML template file <head> after <title> and <meta>, but before any additional overriding local stylesheets or javascript files.

<!-------    .NET 4.8 IMPLEMENTATIONS - Add to Template   ------->
@{
  var HarmonyURL = System.Configuration.ConfigurationManager.AppSettings["HarmonyURL"];
}
<!-------   .NET 8 IMPLEMENTATIONS - Add to Template   ------->
@inject IConfiguration _config
    @{
        var HarmonyURL = _config["HarmonyUI:HarmonyURL"];
    }
<!-------      Harmony UI Toolkit - Add to top of template <head>       ------->
<link rel="icon" type="image/x-icon" href="@HarmonyURL/dliflc-theme/assets/img/favicon.png">
<link rel="stylesheet" type="text/css" href="@HarmonyURL/css/theme.css" />
<script type="text/javascript" src="@HarmonyURL/js/main.js"></script>

<!---------------------------------------------->
            

LEGACY V1 THEME

PLEASE READ!! This is a temporary solution that hosts the V1 Styles and JS files which are currently in use on legacy projects. Including the Stylesheet and Javascript file below is with the intent to REPLACE all of the separated v1 files in this list. Because it already INCLUDES a compiled, minified copy of these files, you should place these before other assets in the <head> of your template.

v1-styles.css includes what was formerly in Layout file as "@UIURL/Content/{css-filename}", and it should replace these files...

  • jquery-ui.min.css
  • fontawesome-all.min.css
  • default-styles.min.css
  • Custom.min.css

v1-scripts.js includes what was formerly in Layout file as "@UIURL/Scripts/{js-filename}", and it should replace these files...

  • jquery-3.3.1.min.js
  • bootstrap/popper.min.js
  • bootstrap/bootstrap-4.0.0.min.js
  • buildHeaderFooter.js
  • modernizr-2.8.3.js
  • jquery-ui-1.12.1.min.js
  • jquery.label_inside.js
  • isotope.min.js
  • bootstrap/bootstrapvalidator.min.js

Copy and include the following snippet containing the favicon, stylesheet, and javascript in your HTML template file <head> after <title> and <meta>, but before any additional overriding local stylesheets or javascript files.

<!-------      LEGACY UI       ------->
<link rel="icon" type="image/x-icon" href="@HarmonyURL/dliflc-theme/assets/img/favicon.png">
<link rel="stylesheet" type="text/css" href="@HarmonyURL/css/v1-styles.css">
<script src="@HarmonyURL/js/v1-scripts.js"></script>
<!---------------------------------------------->