3.3.1 Problem with the global icon code

For support and discussion related to templates and themes in phpBB 3.3.
User avatar
Tastenplayer
Registered User
Posts: 719
Joined: Thu Jul 03, 2014 9:20 pm
Location: Switzerland
Name: Jutta Koliofotis
Contact:

Re: 3.3.1 Problem with the global icon code

Post by Tastenplayer »

Mannix_ wrote:
Fri Jun 26, 2020 12:08 pm
The code for fa-reply is f3e5 in FontAwesome 5 https://kapeli.com/cheat_sheets/Font_Aw ... ents/index
You can go 2 different ways change the code to f3e5 or add font-family: FontAwesome to .icon.fa-external-link-square::before
There is probably a conflict somewhere because there are 2 different FontAwesome versions being used 4 and 5
True Mannix
In the html files it would have to be like this somehow, so that fas or far can be selected.

Only as I have the code now, the correct icon will be displayed but not in the size md I specified, but in the size specified for lastsubject. Also not in the selected color gray.

Code: Select all

<a href="{forumrow.U_LAST_POST}" title="{L_VIEW_LATEST_POST}">
										<i class="fas fa-stroopwafel fa-md icon-gray"></i><span class="sr-only">{L_VIEW_LATEST_POST}</span>
									</a>
iconlastsubject.jpg
https://kapeli.com/cheat_sheets/Font_Aw ... ents/index
---------
To included it in the css: I still think that this solution would have to be integrated into the style somehow, so that the new icons in the css could be inserted and edited correctly. (But it never worked out so far).
https://stackoverflow.com/questions/496 ... ot-showing (First answer)

All forum icons in the Old-BBS no longer work - cannot be inserted. You definitely can't insert all free icons from version 5.0.13 in style and have less choice than before with the 4.7 icons. That's pretty strange. But they are all icons in the css not inserted in html. Therefore somehow this solution for css must be included in such a style with font awesome forum and topic icons, is my opinion.

Why some icons inserted in the css are displayed, but many are not, is still completely illogical to me. :? But the displayed ones are probably those, which are inserted somewhere in prosilver in the html files.
More of my styles you can find in my phpBB Style Board & More My styles -3.2.10-RC2
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
User avatar
Tastenplayer
Registered User
Posts: 719
Joined: Thu Jul 03, 2014 9:20 pm
Location: Switzerland
Name: Jutta Koliofotis
Contact:

Re: 3.3.1 Problem with the global icon code

Post by Tastenplayer »

This is also the code for the forums & topic icons (icons inserted in css not html)
folder-o.png
folder-o.png (853 Bytes) Viewed 469 times

Code: Select all

.forum_read:before				    { content: '\f07b'; color:#333333; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands';  position: absolute; top: 22%; font-size: 25px; left: 15px; }
folder.png
folder.png (1.05 KiB) Viewed 469 times

Code: Select all

.forum_read:before				    { content: '\f07b'; color:#333333; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; font-weight: 900; position: absolute; top: 22%; font-size: 25px; left: 15px; }
Therefore, if an icon is not displayed, a font-weight: 900; would have to be inserted for the global exchange? We will see.
Some icons looked much better in 4.7. Some are now much too fat. :(
http://style-creations.bplaced.net/phpBB3 user: tester_1 / password as in Quickinstall
Edit: Some icons appear larger than the others. E.g the fa-signal inserted in statistic and the fa-link, fa-external-link, I scaled it down.
More of my styles you can find in my phpBB Style Board & More My styles -3.2.10-RC2
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
User avatar
Tastenplayer
Registered User
Posts: 719
Joined: Thu Jul 03, 2014 9:20 pm
Location: Switzerland
Name: Jutta Koliofotis
Contact:

Re: 3.3.1 Problem with the global icon code

Post by Tastenplayer »

Well according to Hanakin no font awesome icons in css as forums & topic icons.
So take the Iconify. Are quickly inserted in the overall and simple header. <script src="https://code.iconify.design/1/1.0.7/iconify.min.js"></script>
You will not get a difference in size, as with the font awesome 5 and 4.7 mix. when inserted in css (only the forum link icon is a bit out of size). Is already reduced without any problems.
The only problem - I find it legally difficult to mix the sets. There are different licenses.
Furthermore the icons are displayed in every ext, which was not the case with the font awesome forums & topic icons.
It took forever to figure out how to insert the color (i.e. how the color code must be correct). These are all svg icons.
The legend ext I also have to adapt somehow. The icons in it are oversized :-). Or I have to specify a size for the icons in my css. I haven't tried the size specification in the code.

See: http://style-creations.bplaced.net/phpBB3/ - style simple - Link: Icon-Legend under Copyright and more. (Material Design Icon Set)

Icon sets: https://iconify.design/icon-sets/
colors for the icons: https://tympanus.net/codrops/2019/09/0 ... e-and-svg/ this must inserted before every color: %23

css code example

Code: Select all

.forum_link							{ background: url('https://api.iconify.design/mdi:link-variant.svg?color=%23ba3329') no-repeat center center / contain; }
.forum_read			                { background: url('https://api.iconify.design/mdi:folder-edit-outline.svg?color=%2336302C') no-repeat center center / contain; } 
.forum_read_locked					{ background: url('https://api.iconify.design/mdi:folder-key-outline.svg?color=%2336302C') no-repeat center center / contain; }
.forum_read_subforum			 	{ background: url('https://api.iconify.design/mdi:folder-open.svg?color=%2336302C') no-repeat center center / contain; }
.forum_unread						{ background: url('https://api.iconify.design/mdi:folder-edit.svg?color=%23ba3329') no-repeat center center / contain; }
.forum_unread_locked				{ background: url('https://api.iconify.design/mdi:folder-lock.svg?color=%23ba3329') no-repeat center center / contain; }
.forum_unread_subforum				{ background: url('https://api.iconify.design/mdi:folder-open.svg?color=%23ba3329') no-repeat center center / contain; }
Last edited by Tastenplayer on Tue Jun 30, 2020 7:43 pm, edited 1 time in total.
More of my styles you can find in my phpBB Style Board & More My styles -3.2.10-RC2
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
User avatar
Talk19Zehn
Registered User
Posts: 530
Joined: Tue Aug 09, 2011 1:10 pm
Contact:

Re: 3.3.1 Problem with the global icon code

Post by Talk19Zehn »

:cry: //OT on:
Well, whoever is responsible for introducing FA5 at this point in time without creating a way to keep FA 4.7.0 (phpBB-3.3.0) at the origin escapes my information. In my opinion, the fact is that FA5 makes compatibility at least difficult. Users of the phpBB software, including designers and extension developers, are exposed to one measure, although one should know that FA5 involves considerable problems.

In my first attempts, I found a solution that is applicable to style designers. However, I do not want to interfere in this unimaginable development, which in my view reveal at the time when known compatibilities exist.
My conclusion: For me personally, the concept on the part of phpBB is not well thought out (phpBB-3.3.1-RC1).
\\ OT off
:cry:

Excuse me, there is no topic to benevolently mention improvements, changes ...

Best regards
User avatar
Tastenplayer
Registered User
Posts: 719
Joined: Thu Jul 03, 2014 9:20 pm
Location: Switzerland
Name: Jutta Koliofotis
Contact:

Re: 3.3.1 Problem with the global icon code

Post by Tastenplayer »

At least I learned something new today because of this disaster.
But updating the styles is quite time consuming this time.

https://area51.phpbb.com/phpBB/viewtopi ... e3#p339166

Edit:
For better performance you should probably do that. https://iconify.design/docs/icon-bundles/ I could try, but I think it's pretty delicate. As mentioned with the sets, there are different licenses. How can you put this in a phpBB forum so that it is still phpBB compliant? Especially if in an icon set states that the license must be inserted in the work.
Icons from 4 different sets - 4 different licenses inserted in the style - or what :?:
License

Iconify SVG framework is dual licensed under Apache 2.0 license and GPL 2.0 license. You may select, at your option, one of the above-listed licenses.

Apache 2.0 license allows pretty much anything, including commercial use.

GPL 2.0 license allows use with more restrictive popular open source projects.

This license does not apply to icons. Icons are released under different licenses, see each collection for details. Icon collections available by default are all licensed under some kind of open source or free license, making it possible to use them in Iconify project.
More of my styles you can find in my phpBB Style Board & More My styles -3.2.10-RC2
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
User avatar
spaceace
Registered User
Posts: 1981
Joined: Wed Jan 30, 2008 8:50 pm
Contact:

Re: 3.3.1 Problem with the global icon code

Post by spaceace »

why didn't styles just stick with using images instead of an icon library? those always seemed to work :roll:
User avatar
Tastenplayer
Registered User
Posts: 719
Joined: Thu Jul 03, 2014 9:20 pm
Location: Switzerland
Name: Jutta Koliofotis
Contact:

Re: 3.3.1 Problem with the global icon code

Post by Tastenplayer »

spaceace wrote:
Wed Jul 01, 2020 10:21 am
why didn't styles just stick with using images instead of an icon library? those always seemed to work :roll:
It has also worked well with the font icons so far. Only in 3.3.1 there are differences in size, because 4.7 and 5.0.13 Awesome Icons are implemented.
With these Iconify svg icons there are no problems at all. At most with the insertion of the license :-) Is much better than before with the font awesome icons. Because they are displayed in every ext.
Why do styles with font icons. Because it is advanced and looks good, especially it looks the same in every display. They require less performance than the images. Besides: Once you have the knack of how to insert them into the css, you have much less work 8-)

Now I just have to try to shrink them a bit in size, so that they are not displayed so huge in the Icon Ext. http://style-creations.bplaced.net/phpB ... cf8105642e Should go smoothly according to the instructions.
Of course I have chosen the simplest solution. There's room for improvement. But I am not an IT specialist, not a programmer. For the moment I'm so satisfied. Only one sticky icon with padlock or x was missing in the selected set. But because of the different licenses I think it's risky to mix sets. (data privacy) Although you could mix them all, according to the instructions. All sets are free.

Besides:
In 3.3.1-RC1 there are not only problems with the font awesome forums & topic icons. There are also some differences in the size of the icons inserted in the html files. E.g. the icon fa-paperclip is hardly visible, does not look nice.

This topic was mainly about the fact that the global icon exchange in css no longer worked.
So you replace an icon inserted in the html files with the content code of another icon.

In Blackfog I had to replace some icons because they didn't look good anymore.
Updating a style within the same row sometimes takes forever this time.

It was not for nothing that I was soon ready to just update the simple styles and say goodbye to the others. I already had the crisis.
More of my styles you can find in my phpBB Style Board & More My styles -3.2.10-RC2
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
User avatar
Tastenplayer
Registered User
Posts: 719
Joined: Thu Jul 03, 2014 9:20 pm
Location: Switzerland
Name: Jutta Koliofotis
Contact:

Re: 3.3.1 Problem with the global icon code

Post by Tastenplayer »

https://icons8.com/line-awesome Just looks like roaring :lol:
Last edited by Tastenplayer on Thu Jul 02, 2020 5:14 am, edited 1 time in total.
More of my styles you can find in my phpBB Style Board & More My styles -3.2.10-RC2
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
User avatar
3Di
Former Team Member
Posts: 15704
Joined: Mon Apr 04, 2005 11:09 pm
Location: Milan (IT) Frankfurt (DE)
Name: Marco
Contact:

Re: 3.3.1 Problem with the global icon code

Post by 3Di »

Tastenplayer wrote:
Thu Jul 02, 2020 4:43 am
https://icons8.com/line-awesome
Switching to another icon provider is the best choice in your case, make sure they also have both off & on-line versions. ;)
Please PM me only to request paid works. Thx.
Want to compensate me for my interest? Donate
My development's activity º PhpStorm's proud user
Extensions, Scripts, MOD porting, Update/Upgrades
:studio_microphone: Looking for a specific feature or alternative option?
User avatar
Tastenplayer
Registered User
Posts: 719
Joined: Thu Jul 03, 2014 9:20 pm
Location: Switzerland
Name: Jutta Koliofotis
Contact:

Re: 3.3.1 Problem with the global icon code

Post by Tastenplayer »

3Di wrote:
Thu Jul 02, 2020 4:58 am
Switching to another icon provider is the best choice in your case, make sure they also have both off & on-line versions. ;)
I've already done that. :) http://style-creations.bplaced.net/phpB ... viewlegend
I was just kidding about the line awesome icons. It looked hilarious. :lol:
More of my styles you can find in my phpBB Style Board & More My styles -3.2.10-RC2
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
User avatar
3Di
Former Team Member
Posts: 15704
Joined: Mon Apr 04, 2005 11:09 pm
Location: Milan (IT) Frankfurt (DE)
Name: Marco
Contact:

Re: 3.3.1 Problem with the global icon code

Post by 3Di »

Tastenplayer wrote:
Thu Jul 02, 2020 5:15 am
I was just kidding about the line awesome icons. It looked hilarious.
If I were you I would consider it a valid alternative instead, very nice one I can say.
Just I am not sure if they offer both the local and CDN served versions which are required by phpBB.

Iconify just provides the web version of their icons, I have already posted in the right places that issue.

So there is nothing about to be happy IMHO. :P
Please PM me only to request paid works. Thx.
Want to compensate me for my interest? Donate
My development's activity º PhpStorm's proud user
Extensions, Scripts, MOD porting, Update/Upgrades
:studio_microphone: Looking for a specific feature or alternative option?
User avatar
Tastenplayer
Registered User
Posts: 719
Joined: Thu Jul 03, 2014 9:20 pm
Location: Switzerland
Name: Jutta Koliofotis
Contact:

Re: 3.3.1 Problem with the global icon code

Post by Tastenplayer »

At worst, you could also download them and insert them in style somehow.
Unfortunately a Sticky locked is missing in this set :-).
More of my styles you can find in my phpBB Style Board & More My styles -3.2.10-RC2
Be the best version of yourself rather than a bad copy of someone else!
Excuse me for my English, but I learned the language by speaking to people and not at school.
Post Reply

Return to “[3.3.x] Styles Support & Discussion”