I have 2 visual bugs/issue with the comment/description of the "Icon Font Set" of the j51_icons module when editing the module on frontend.
Issue #1:
- First the description is kinda limited to a fixed width from the left margin.
- Second, the description seem to be suppose to have a "alert alert-grey" styled background, but this is just showing as two small blocks just above and below the description field.
This makes the description look kinda messy and not properly styled. See 1st attached image.
Unsure if this is only for the Amelia template or if its general.
Issue #2:
I've been made aware that the comment/description fields in the j51_icons module lacks a unique name attribute which apparently is mandatory according to Joomla docs. Reference: Spacer form field type
This can cause issues with the comment field getting duplicated as is the case if using the Advanced Module Manager to handle the Frontend Module Edit page instead of the default joomla one. See 2nd attached image.
I was made aware of this after making a topic about this duplicate issue on RegularLabs Forum and Peter from there gave me following answer:
The issue regarding the duplicate fields IS down to the modules themselves.Reference to topic raised at RegularLabs: Issue with ReReplacer/Advanced Module Manager and frontend module edit page
The comment fields defined in the xml don't have a unique name attribute. This causes issues with the Joomla core form field render.
For instance, in the mod_j51icons.xml, there is:
This should be changed to something like:<field label="MOD_J51_ICONS_COLOR_INFO" type="spacer" class="alert alert-grey"/>
<field name="@j51_icons_color_info label="MOD_J51_ICONS_COLOR_INFO" type="spacer" class="alert alert-grey"/>
Is it possible to have this fixed with a new version of the module so that it could work properly out of the box without overrides and custom CSS?
EDIT:
For issue #1, following CSS applied to the template's Custom CSS seems to fix and style the description block properly.
.control-label .alert.alert-grey {
display: block;
text-align: left;
width: max-content; /* This should maybe be set otherwise as max-content might not be responsive */
}
For issue #2, I fixed this duplicate issue by simply adding a name attribute to the two description fields, i.e. to the iconsetinfo and icons_color_info with the following changes applied to the file .../mod_j51icons/mod_j51icons.xml:
(line 127) <field label="MOD_J51_ICONSETINFO" type="spacer" class="alert alert-grey"/>
(line 151) <field label="MOD_J51_ICONS_COLOR_INFO" type="spacer" class="alert alert-grey"/>
changed to:(line 127) <field name="j51_icons_set_info" label="MOD_J51_ICONSETINFO" type="spacer" class="alert alert-grey"/>
(line 151) <field name="j51_icons_color_info" label="MOD_J51_ICONS_COLOR_INFO" type="spacer" class="alert alert-grey"/>
Kind Regards
Marius