Icons in HxNav (with badge option)?

[rgbinnovation]

Is there no way to put icons in HxNav, and make them look good? I get extremely small icons, and had to bump them up to fa-xl to make them look even decent.

Also, is there no way to add a badge (dot) indicator to icons? This must be very functionality? It it just me that does not know how to get it done properly?

Sample of what I get when trying different things below:

    <HxNav CssClass="p-0 justify-content-end">
      <HxIcon Icon="@BootstrapIcon.Bootstrap">
        <HxBadge Color="ThemeColor.Danger"
          CssClass="position-absolute top-0 start-100 translate-middle rounded-circle p-2 border border-light">
          <span class="visually-hidden">New alerts</span>
        </HxBadge>
      </HxIcon>
      <HxButton Icon="BootstrapIcon.Trash" IconPlacement="ButtonIconPlacement.End" Color="ThemeColor.Secondary" />
      <button type="button" class="btn btn-icon btn-link-secondary position-relative">
        <i class="fa-duotone fa-solid fa-xl fa-grid-2"></i>
        <span
          class="position-absolute top-0 start-100 translate-middle p-1 bg-danger border border-light rounded-circle">
          <span class="visually-hidden">New alerts</span>
        </span>
      </button>
      <button type="button" class="btn btn-icon btn-link-secondary"><i
          class="fa-duotone fa-solid fa-xl fa-diamonds-4"></i></button>



      <!--
      <i class="fa-duotone fa-solid fa-xl fa-grid-2 me-3"></i>
      <i class="fa-duotone fa-solid fa-xl fa-grid-2 me-3"></i>
      <i class="fa-duotone fa-solid fa-xl fa-diamonds-4"></i>
      -->
    </HxNav>

[crdo]

Hi @rgbinnovation, not sure what visual are you trying to achieve, but you have to follow the structure shown in the docs.
The direct descendants of HxNav have to be HxNavLink.
Everything else (icons, text, badges) should be inside of the HxNavLink.
HxIcon has no ChildContent and cannot have anything inside of it.
Most of what you struggle with is more a HTML/CSS/Bootstrap related rather than our component library.