When editing content that contains an entity reference to nodes using the autocomplete widget, the "Add another item" button extends all the way across the screen.
This is because that button has the input class when it should not.
| Comment | File | Size | Author |
|---|---|---|---|
| #8 | 3142801-8.patch | 1.17 KB | matija5 |
| #6 | Screenshot 2020-05-26 at 6.31.33 PM.png | 31.08 KB | himanshu_sindhwani |
| #6 | Screenshot 2020-05-26 at 6.29.15 PM.png | 36.93 KB | himanshu_sindhwani |
| #3 | 3142801-3.patch | 538 bytes | matija5 |
| drulma_addanother_no_input_class.PNG | 5.84 KB | ptmkenny |
Comments
Comment #2
himanshu_sindhwani commentedComment #3
matija5 commentedHi, this is because 'themes/contrib/drulma/templates/fontawesome5/form/input--submit--addanotheritem.html.twig' extends 'input.html.twig' instead of 'input--submit.html.twig'.
I created a patch with extends 'input--submit.html.twig'.
Comment #4
rodrigoaguileraI think I have to test this locally.
@vebrovski Doesn't your change remove the icon from the button?
Comment #5
matija5 commented@rodrigoaguilera you are right, it does remove icon from button.
As @ptmkenny said, the problem is in
inputclass of<input>element.You could wrap
<input>element inside 'input.html.twig' with another block and then in 'input--submit--addanotheritem.html.twig' remove that class with<input{{ attributes.removeClass('input') }} />{{ children }}.Or refactor code for submit template by adding icon to it?
Comment #6
himanshu_sindhwani commentedI am not getting any icon on the button and the patch mentioned in #3 solves the problem for me. Can you please let me know if I am missing anything?
Here is what i am having before the patch:
and this after the patch:
Comment #7
matija5 commentedThere is an element
<span class="icon is-left">missing if patch is applied.Comment #8
matija5 commentedAnother take with solution from #5 with keeping
{% extends 'input.html.twig' %}in templates/fontawesome5/form/input--submit--addanotheritem.html.twig and removing input class from button.Comment #9
rodrigoaguileraI finally had the chance to look at it locally in my computer this weekend.
First, the file had the wrong filename so it was picked even when no fontawesome was enabled.
To fix this what I did is just imitate what is done in input--submit--remove--fa5.html.twig with the proper icon.
Thank you for your input.