Components > jDownloads > Layouts > CSS Files - Editor removes backslash on Save & Close

[Tom68]

Joomla 5.3.1
jDownloads 4.0.47

Colin & Arno,

It seems the jDownloads editor that is called up in the backend under "Components > jDownloads > Layouts > CSS Files" removes backslashes from the css code. The following css code is part of my "jdownloads_custom.css":

Code Select Expand

/* replace bullet */

.com-content-article__body ul{
    list-style-type: none;
}

.com-content-article__body li:before {   
    font-family: "Font Awesome 6 Free";
    content: '\f15c';
    margin:0 0.65em 0 -1.4em;
}

By means of this code I replace the default bullet by the files-lines character of font awesome 6 free. However, when the editor is left by clicking "Save & Close" the backslash before "f15c" gets removed. As a result "F15C" is displayed on the corresponding webpage rather than the files-lines character.

Regards
Tom

[ColinM]

Tom
My understanding of the backslash character is that the characters following the backslash, up to a space character, are to be shown explicitly and not interpreted. So in your case you wanted to see F15C in the text shown on the screen
Please let me know
 
Colin

[Tom68]

Colin,

Actually, here it is just the other way round. With the backslash the character is intepreted and the files-lines symbol is displayed. Without the backslash only the code f15c is displayed. You can easily verify this, with a website with corresponding css code and a browser.

Regards
Tom

[ColinM]

Tom
I did mean that the backslash should not be removed so the image is shown
Colin

[Tom68]

Some more background information on using Font Awesome 6 Free in "jdownloads_custom.css".

• Font Awesome 6 Free is included per default with Joomla!5 (in Joomla!4 Font Awesome 5 Free was included per default). It offers a large number of icons that can be used on webpages to enrich the text with meaningful icons.
• On my website, I use the layout "Files link only 3.9" to list the proceedings of conferences and make them available (downloadable) to registered users. It is obvious to use an unordered (bullet) list for such a purpose.
• To spice up the look of these lists, I have replaced the bullets with a Font Awesome icon per css code in "jdownloads_custom.css".
• The code is given in my initial post.
• In order to insert a Font Awesome icon, it is necessary to specify the unicode of the corresponding icon with a leading backslash "\". See e.g. Escaping, CSS Entities, Pseudo Elements.
• Therefore, it is mandatory that the backslash is not removed from the "jdownloads_custom.css" file by the editor used to edit the custom css code. Unfortunately, this happens in jD 4.0.47, which is the reason for this bug report.

I hope this helps to understand the problem.

Regards
Tom

[Arno]

Hi,
thanks for the info.

Please try the attached file and copy it to: administrator/components/com_jdownloads/src/Controller

[Tom68]

Thanks Arno,

the updated code fixes the problem. The backslash is now preserved and the Font Awesome icon is correctly displayed after saving the css files. 

Regards
Tom