Posts

Showing posts with the label Font Awesome 5

Donate

How To Use FontAwesome Icons In jsTree Using ASP.NET MVC And JavaScript

Hello, Here's a tutorial on how to integrate FontAwesome Icons In jsTree Using ASP.NET MVC And JavaScript. First is to install the FontAwesome Nuget package using package console manager. Make sure to target the web project. Install - Package FontAwesome Then we add custom css styles for the icon color that corresponds to a file type. /* icon implementation */ . pdf-icon-color { color : red !important ; } . word-icon-color { color : blue !important ; } . xls-icon-color { color : green !important ; } . ppt-icon-color { color : orange !important ; } . img-icon-color { color : DodgerBlue !important ; } . txt-icon-color { color : gray !important ; } . video-icon-color { color : royalblue !important ; } . default-icon-color { color : black !important ; } Once we have the css styles in place, we then proceed with the essential JavaScript functions. The functions below will update the jsTree icons based on their types. T...

Font-Awesome Files Not Loading In Blazor Web Application In .NET 8

Image
Hello, As I was integrating the font-awesome library into Blazor Web Application, I noticed that the buttons were not showing the font-awesome icons. Upon checking through the browser console, the files such as fontawesome.css, regular.min.css and solid.min.css were not loaded even though they were referenced in App.razor component such as the code below. <head> <meta charset= "utf-8" /> <meta name= "viewport" content= "width=device-width, initial-scale=1.0" /> <base href= "/" /> <link rel= "stylesheet" href= "bootstrap/bootstrap.min.css" /> <link rel= "stylesheet" href= "app.css" /> <link rel= "icon" type= "image/png" href= "favicon.png" /> <link rel= "stylesheet" href= "~/lib/font-awesome/css/fontawesome.css" /> <link rel= "stylesheet" href= ...

How To Install Or Add Icons In ASP.NET Core MVC Pages Using Font Awesome

Image
This post illustrates on how to install or add icons to your ASP.NET Core MVC website pages using Font Awesome. If you added Bootstrap 4.x to your project, you might noticed that when you typed glyphicon in a class attribute of an html element, the intellisense does'nt show the glyphicons from Bootstrap 3.x. It's because Bootstrap 4.x does not support glyphicons anymore but instead encourage us to use Font Awesome. Given that you have already created your ASP.NET Core MVC project, the next thing to do is install via Libman the Font Awesome library. When installed, this will be mapped to your wwwroot folder. In Layout.cshtml page, reference these three files specifically fontawesome.css, regular.min.css and solid.min.css. In that way, Font Awesome is accessible globally in your project. <link rel= "stylesheet" href= "~/lib/font-awesome/css/fontawesome.css" /> <link rel= "stylesheet" href= "~/lib/Font-Awesome/css/regular.min.css...

Donate