Ends in:
2 DAYS
18 HRS
6 MIN
48 SEC
Ends in:
2 D
18 H
6 M
48 S
Open Closed

Upgrade to 8.1.2 changed font awesome icons #7199


User avatar
0
stephen.boag created
  • ABP Framework version: v8.1.2
  • UI Type: Blazor Server
  • Database System: EF Core (SQL Server)
  • Tiered (for MVC) or Auth Server Separated (for Angular): no
  • Exception message and full stack trace: N/A
  • Steps to reproduce the issue: Upgrade to 8.1.2

After we upgraded to 8.1.2 a lot of our icons were changed to random icons. Digging in it looks to be an issue where the IconName.xxx is referencing 1.4.1. not 1.5.2 like it should be. Digging deeping I think I found where the transient dependency issue is. the package reference "Volo.Abp.AspNetCore.Components.Web.Theming V 8.1.2" has a dependency to Volo.Abp.BlazoriseUI (>= 8.1.2) which in turn references (among others) Blazorise (>= 1.4.1) which I think needs to be upgraded to 1.5.x.

I was able to fix our local module icons by adding in a direct package reference to Blazorise 1.5.2 which overode the 1.4.1 transient dependency but it didn't help for the abp modules (e.g. Identity / SAAS modules).

Can you please look into this and upgrade the transient dependency version if that does fix this issue or advise an alternative fix if it doesn't.

"


9 Answer(s)
  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    Please share the csproj file of your Blazor server project. I want to check the versions of Leptonx and Blazorise.

    Thanks.

  • User Avatar
    0
    stephen.boag created

    Hi Malming,

    Please see below our base blazor project file

    <Project Sdk="Microsoft.NET.Sdk.Web">
    	<Import Project="..\..\common.props" />
    	<PropertyGroup>
    		<TargetFramework>net8.0</TargetFramework>
    		<Nullable>enable</Nullable>
    		<AspNetCoreHostingModel>InProcess</AspNetCoreHostingModel>
    		<AutoGenerateBindingRedirects>true</AutoGenerateBindingRedirects>
    		<GenerateBindingRedirectsOutputType>true</GenerateBindingRedirectsOutputType>
    		<GenerateRuntimeConfigurationFiles>true</GenerateRuntimeConfigurationFiles>
    		<MvcRazorExcludeRefAssembliesFromPublish>false</MvcRazorExcludeRefAssembliesFromPublish>
    		<PreserveCompilationReferences>true</PreserveCompilationReferences>
    		<UserSecretsId>[redacted]</UserSecretsId>
    	</PropertyGroup>
    	<ItemGroup>
    		<PackageReference Include="AspNetCore.HealthChecks.UI" Version="8.0.1" />
    		<PackageReference Include="AspNetCore.HealthChecks.UI.Client" Version="8.0.1" />
    		<PackageReference Include="AspNetCore.HealthChecks.UI.InMemory.Storage" Version="8.0.1" />
    		<PackageReference Include="Quartz.Serialization.Json" Version="3.9.0" />
    		<PackageReference Include="Serilog.AspNetCore" Version="8.0.0" />
    		<PackageReference Include="Serilog.Sinks.Async" Version="1.5.0" />
    		<PackageReference Include="Blazorise.Bootstrap5" Version="1.5.2" />
    		<PackageReference Include="Blazorise.Icons.FontAwesome" Version="1.5.2" />
    		<PackageReference Include="Microsoft.AspNetCore.Authentication.Google" Version="8.0.4" />
    		<PackageReference Include="Microsoft.AspNetCore.Authentication.MicrosoftAccount" Version="8.0.4" />
    		<PackageReference Include="Microsoft.AspNetCore.Authentication.Twitter" Version="8.0.4" />
    		<PackageReference Include="Microsoft.AspNetCore.Authentication.Negotiate" Version="8.0.4" />
    		<PackageReference Include="SilkierQuartz" Version="5.0.356" />
    		<PackageReference Include="Volo.Abp.BackgroundJobs.Quartz" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.BackgroundWorkers.Quartz" Version="8.1.2" />
    		<PackageReference Include="Telerik.UI.for.Blazor" Version="5.1.1" />
    		<PackageReference Include="Volo.CmsKit.Pro.Admin.Blazor.Server" Version="8.1.2" />
    		<PackageReference Include="Volo.FileManagement.Blazor.Server" Version="8.1.2" />
    		<ProjectReference Include=[redacted] />
    	<ItemGroup>
    		<ProjectReference Include=[redacted] />
    		<PackageReference Include="Volo.Abp.Autofac" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.Swashbuckle" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.AspNetCore.Serilog" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.Account.Pro.Public.Web.OpenIddict" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.Account.Pro.Public.Blazor.Server" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.Account.Pro.Admin.Blazor.Server" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.Account.Pro.Public.Web.Impersonation" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.AuditLogging.Blazor.Server" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.Identity.Pro.Blazor.Server" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.OpenIddict.Pro.Blazor.Server" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.LanguageManagement.Blazor.Server" Version="8.1.2" />
    		<PackageReference Include="Volo.Saas.Host.Blazor.Server" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.TextTemplateManagement.Blazor.Server" Version="8.1.2" />
    		<PackageReference Include="Volo.Abp.Gdpr.Blazor.Server" Version="8.1.2" />
    	</ItemGroup>
    	<ItemGroup>
    		<PackageReference Include="Volo.Abp.AspNetCore.Mvc.UI.Theme.LeptonX" Version="3.1.2" />
    		<PackageReference Include="Volo.Abp.AspNetCore.Components.Server.LeptonXTheme" Version="3.1.2" />
    	</ItemGroup>
    </Project>
    
  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    For 8.1.2, you should use Blazorise 1.4.x and LeptonX 3.1.x.

  • User Avatar
    0
    stephen.boag created

    Hi Maliming,

    Thanks for your help, I traced the cause. Blazorise.Bootstrap5 and Blazorise.Icons.FontAwesome were not updated as part of abp update cli command but the solution wouldn't run at their 1.3.2 version so we updated to latest. reverting to 1.4.3 has worked. Thanks :)

  • User Avatar
    0
    stephen.boag created

    Hi Maliming,

    One last thing, 8.1.2 changed the return to host button icon but for some reason it seems to have both the arrow and the person icon classes which causes it to render blank.The demo site only has the persion icon class. Any ideas how to remove the class?

    Our site:

    LeptonX demo site

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    I will check this.

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    If I add the lpx-icon action-icon bi bi-person-workspace fa-solid fa fa-arrow-left class to demo website. It also works.

    I have checked the new template, and there is no such problem.

  • User Avatar
    0
    stephen.boag created

    Hi Maliming,

    Thank you for confiming, I found the issue was a compatability issue between the default font awesome free 5 and the font awesome pro 6 we added for additional icons. the .bi-person-workspace::before { content: "\f67a"; } was being overridden by the pro arrow before but it couldn't find that icon. I was able to fix it with some custom CSS. Thanks for your help :)

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    Good news

Made with ❤️ on ABP v9.1.0-preview. Updated on December 02, 2024, 12:35