Search code examples
angularformio

Form builder close icon issue using Formio

I am using Form builder in my application where when I drag a new element a popup appear with the properties related to that element,what the issue is in that popup close icon is not showing instead of that close icon related key (D7) is showing and the close functionality also working fine.

Can anyone let me know what the issue is...I don't have any clue as I googled it and doesn't found any solution

By the way,I'm using Bootstrap CSS in my application,I think bootstrap icons are overriding the form build icons but not sure.

enter image description here

Here are the styles:

 "styles": [
          "node_modules/bootstrap/dist/css/bootstrap.css",
          "src/assets/styles/app.scss",],

and the formio version I'm using is "angular-formio": "3.17.0",

Solution

  • I guess this is a typo from formio missing a \ and not any font issues. You can override it like below. 

    .formio-dialog-close:before {
   content: '\D7' !important;
 }

    OR

    .formio-dialog.formio-dialog-theme-default .formio-dialog-close:before
{
   content: 'X' !important;
}