phpBB 3.3.1-RC1 released

[P_I]

There's no need to remove FA 4 as there's FA-provided backward compatibility layer which allows Prosilver to render FA 4 icons via FA 5.

Thanks.

I've been awaiting 3.3.1 as it fixes a number of annoying bugs that my members have reported and I want the ensure the update goes smoothly. I've been testing out the RC1 and so far so good. Thanks team.

[Tastenplayer]

Problem deleted - now it suddenly works with the spacing of the Navbar Icons in the customized style. - strange.

I have not found any mistakes so far. Seems to work fine with 3.3.1 (except that problem with the often perpetual loading when changing styles in the stylechanger)
The thing with the changed codes for the font awesome icons, however, can give you quite a headache.

[rxu]

they no longer have a padding-right of 2px in the navbar

.icon does have the padding, see https://github.com/phpbb/phpbb/blob/650 ... ns.css#L25

[Tastenplayer]

I was too slow. I deleted the post. Cause now it's suddenly happening. The problem was that with this code, where all icons in the style get the same color, the icons in the navbar were without space. But now it's suddenly true - for whatever reason.
Before it looked like this - why do the gods know

code in navbar.jpg (3.74 KiB) Viewed 39098 times

The main thing is that the distance is right now.

colorcodenav.jpg (4.77 KiB) Viewed 39094 times

[rxu]

But now it's suddenly true - for whatever reason.

That's a browser cache

[Tastenplayer]

You are allways too fast for me with my english
I installed the style only after the adjustments - so it can hardly have been a browser cache problem.
Maybe Firefox and Chrome were overstrained because there is a gradient font awesome icon color code in this style.

But the question icon now definitely looks much bigger than the other icons.

Edit: But what definitely does not work anymore is the code for the global exchange of an icon. Now the wrong icon is displayed in the style.
There should now be a fa-reply displayed everywhere instead.

Code: Select all

.fa-external-link-square::before {
	content: "\f112";
	color: #B5B5B5;
	font-size: 14px;
}

[janus]

janus
Any details in PHP error log? Any chance that was caused by some extension?

That is possible but there is nothing in the php error log.

[Tastenplayer]

The problem is that some icons from 4.7 no longer look the same and you have to replace them. But for the font awesome 5 icons you can't choose between fas or far. For example, the clipboard always shows far fa-clipboard. You can no longer choose between filled out or border only? Maybe: Unless you change the code completely for the respective icon in the html file (provided you figure out how to change it).

I finally found the code to correctly insert the font awesome icons in the css.
But there should definitely be a solution for adjusting fas and far in css. Unfortunately I can try what I want, nothing works.
Now every icon from the 3.3.0 style is displayed as icon-o. So e.g the fa-belle as fa-belle-o.

Some icons are not displayed at all, e.g fa-cube, fa-cubes, fa-dice-d6 . There is simply a completely different icon displayed for the fa-cubes.

fa-cube.jpg (6.08 KiB) Viewed 39062 times

Adapted font_awesome_for_topics_and_forums.css (orig. Lehrling)

Code: Select all

/* Forum icons & Topic icons */
.global_read:before 				{ content: '\f0f3'; color:#222222; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_read_mine:before			{ content: '\f0f3'; color:#4981CE; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_read_locked:before			{ content: '\f1f6'; color:#222222; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_read_locked_mine:before		{ content: '\f1f6'; color:#4981ce; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_unread:before				{ content: '\f0f3'; color:#FF0F0F; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_unread_mine:before			{ content: '\f0f3'; color:#FF7F50; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_unread_locked:before		{ content: '\f1f6'; color:#FF0F0F; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_unread_locked_mine:before	{ content: "\f1f6"; color:#FF7F50; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }

.announce_read:before				{ content: '\f0f3'; color:#222222; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_read_mine:before			{ content: '\f0f3'; color:#4981CE; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_read_locked:before		{ content: '\f1f6'; color:#222222; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_read_locked_mine:before	{ content: '\f1f6'; color:#4981ce; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_unread:before				{ content: '\f0f3'; color:#FF0F0F; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_unread_mine:before		{ content: '\f0f3'; color:#FF7F50; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_unread_locked:before		{ content: '\f1f6'; color:#FF0F0F; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_unread_locked_mine:before	{ content: '\f1f6'; color:#FF7F50; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }

.forum_link:before					{ content: '\f1d9'; color:#2E4D76; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_read:before				    { content: '\f1b2'; color:#333333; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_read_locked:before			{ content: '\f084'; color:#333333; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_read_subforum:before		 	{ content: '\f1b3'; color:#333333; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_unread:before				{ content: '\f35a'; color:#bf0000; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_unread_locked:before			{ content: '\f084'; color:#bf0000; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_unread_subforum:before		{ content: '\f1b3'; color:#bf0000; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 22%; font-size: 25px; left: 15px; }

.sticky_read:before					{ content: '\f249'; color:#444444; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_read_mine:before			{ content: '\f249'; color:#395F93; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_read_locked:before			{ content: '\f28e'; color:#444444; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_read_locked_mine:before		{ content: '\f28e'; color:#395F93; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_unread:before				{ content: '\f249'; color:#bf0000; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_unread_mine:before			{ content: '\f249'; color:#F59B45; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_unread_locked:before		{ content: '\f28e'; color:#bf0000; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_unread_locked_mine:before	{ content: '\f28e'; color:#F59B45; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }

.topic_moved:before					{ content: '\f047'; color:#0D4F8B; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.pm_read:before						{ content: '\f2b6'; color:#444444; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_read:before					{ content: '\f07b'; color:#444444; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_read_mine:before				{ content: '\f07b'; color:#395F93; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_read_hot:before				{ content: '\f07c'; color:#444444; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_read_hot_mine:before			{ content: '\f07c'; color:#395F93; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
									  
.topic_read_locked:before			{ content: '\f114'; color:#444444; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_read_locked_mine:before		{ content: '\f114'; color:#395F93; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.pm_unread:before					{ content: '\f0e0'; color:#BF0000; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread:before				{ content: '\f07b'; color:#BF0000; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread_mine:before			{ content: '\f07b'; color:#F59B45; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread_hot:before			{ content: '\f07c'; color:#bf0000; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread_hot_mine:before		{ content: '\f07c'; color:#F59B45; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread_locked:before			{ content: '\f114'; color:#bf0000; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread_locked_mine:before	{ content: '\f114'; color:#F59B45; font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Brands'; position: absolute; top: 20%; font-size: 25px; left: 15px; }

/* Forum icons & Topic icons */
.global_read						{ background-image: none; }
.global_read_mine					{ background-image: none; }
.global_read_locked					{ background-image: none; }
.global_read_locked_mine			{ background-image: none; }
.global_unread						{ background-image: none; }
.global_unread_mine					{ background-image: none; }
.global_unread_locked				{ background-image: none; }
.global_unread_locked_mine			{ background-image: none; }

.announce_read						{ background-image: none; }
.announce_read_mine					{ background-image: none; }
.announce_read_locked				{ background-image: none; }
.announce_read_locked_mine			{ background-image: none; }
.announce_unread					{ background-image: none; }
.announce_unread_mine				{ background-image: none; }
.announce_unread_locked				{ background-image: none; }
.announce_unread_locked_mine		{ background-image: none; }

.forum_link							{ background-image: none; }
.forum_read							{ background-image: none; } 
.forum_read_locked					{ background-image: none; }
.forum_read_subforum			 	{ background-image: none; }
.forum_unread						{ background-image: none; }
.forum_unread_locked				{ background-image: none; }
.forum_unread_subforum				{ background-image: none; }

.sticky_read						{ background-image: none; }
.sticky_read_mine					{ background-image: none; }
.sticky_read_locked					{ background-image: none; }
.sticky_read_locked_mine			{ background-image: none; }
.sticky_unread						{ background-image: none; }
.sticky_unread_mine					{ background-image: none; }
.sticky_unread_locked				{ background-image: none; }
.sticky_unread_locked_mine			{ background-image: none; }

.topic_moved						{ background-image: none; }
.pm_read,
.topic_read							{ background-image: none; }
.topic_read_mine					{ background-image: none; }
.topic_read_hot						{ background-image: none; }
.topic_read_hot_mine				{ background-image: none; }
.topic_read_locked					{ background-image: none; }
.topic_read_locked_mine				{ background-image: none; }
.pm_unread,
.topic_unread						{ background-image: none; }
.topic_unread_mine					{ background-image: none; }
.topic_unread_hot					{ background-image: none; }
.topic_unread_hot_mine				{ background-image: none; }
.topic_unread_locked				{ background-image: none; }
.topic_unread_locked_mine			{ background-image: none; }

original code from 3.0.0

Code: Select all

/* Forum icons & Topic icons */
.global_read:before 				{ content: "\f0f3"; color:#222222; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_read_mine:before			{ content: "\f0f3"; color:#4981CE; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_read_locked:before			{ content: "\f1f6"; color:#222222; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_read_locked_mine:before		{ content: "\f1f6"; color:#4981ce; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_unread:before				{ content: "\f0f3"; color:#FF0F0F; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_unread_mine:before			{ content: "\f0f3"; color:#FF7F50; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_unread_locked:before		{ content: "\f1f6"; color:#FF0F0F; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.global_unread_locked_mine:before	{ content: "\f1f6"; color:#FF7F50; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }

.announce_read:before				{ content: "\f0f3"; color:#222222; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_read_mine:before			{ content: "\f0f3"; color:#4981CE; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_read_locked:before		{ content: "\f1f6"; color:#222222; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_read_locked_mine:before	{ content: "\f1f6"; color:#4981ce; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_unread:before				{ content: "\f0f3"; color:#FF0F0F; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_unread_mine:before		{ content: "\f0f3"; color:#FF7F50; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_unread_locked:before		{ content: "\f1f6"; color:#FF0F0F; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.announce_unread_locked_mine:before	{ content: "\f1f6"; color:#FF7F50; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }

.forum_link:before					{ content: "\f1d9"; color:#2E4D76; font-family: 'FontAwesome';  position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_read:before				    { content: "\f1b2"; color:#333333; font-family: 'FontAwesome';  position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_read_locked:before			{ content: "\f084"; color:#333333; font-family: 'FontAwesome';  position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_read_subforum:before		 	{ content: "\f1b3"; color:#333333; font-family: 'FontAwesome';  position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_unread:before				{ content: "\f1b2"; color:#bf0000; font-family: 'FontAwesome';  position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_unread_locked:before			{ content: "\f084"; color:#bf0000; font-family: 'FontAwesome';  position: absolute; top: 22%; font-size: 25px; left: 15px; }
.forum_unread_subforum:before		{ content: "\f1b3"; color:#bf0000; font-family: 'FontAwesome';  position: absolute; top: 22%; font-size: 25px; left: 15px; }

.sticky_read:before					{ content: "\f249"; color:#444444; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_read_mine:before			{ content: "\f249"; color:#395F93; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_read_locked:before			{ content: "\f28e"; color:#444444; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_read_locked_mine:before		{ content: "\f28e"; color:#395F93; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_unread:before				{ content: "\f249"; color:#bf0000; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_unread_mine:before			{ content: "\f249"; color:#F59B45; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_unread_locked:before		{ content: "\f28e"; color:#bf0000; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.sticky_unread_locked_mine:before	{ content: "\f28e"; color:#F59B45; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }

.topic_moved:before					{ content: "\f047"; color:#0D4F8B; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.pm_read:before						{ content: "\f2b6"; color:#444444; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_read:before					{ content: "\f07b"; color:#444444; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_read_mine:before				{ content: "\f07b"; color:#395F93; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_read_hot:before				{ content: "\f07c"; color:#444444; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_read_hot_mine:before			{ content: "\f07c"; color:#395F93; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
									  
.topic_read_locked:before			{ content: "\f114"; color:#444444; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_read_locked_mine:before		{ content: "\f114"; color:#395F93; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.pm_unread:before					{ content: "\f0e0"; color:#BF0000; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread:before				{ content: "\f07b"; color:#BF0000; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread_mine:before			{ content: "\f07b"; color:#F59B45; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread_hot:before			{ content: "\f07c"; color:#bf0000; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread_hot_mine:before		{ content: "\f07c"; color:#F59B45; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread_locked:before			{ content: "\f114"; color:#bf0000; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }
.topic_unread_locked_mine:before	{ content: "\f114"; color:#F59B45; font-family: 'FontAwesome';  position: absolute; top: 20%; font-size: 25px; left: 15px; }

/* Forum icons & Topic icons */
.global_read						{ background-image: none; }
.global_read_mine					{ background-image: none; }
.global_read_locked					{ background-image: none; }
.global_read_locked_mine			{ background-image: none; }
.global_unread						{ background-image: none; }
.global_unread_mine					{ background-image: none; }
.global_unread_locked				{ background-image: none; }
.global_unread_locked_mine			{ background-image: none; }

.announce_read						{ background-image: none; }
.announce_read_mine					{ background-image: none; }
.announce_read_locked				{ background-image: none; }
.announce_read_locked_mine			{ background-image: none; }
.announce_unread					{ background-image: none; }
.announce_unread_mine				{ background-image: none; }
.announce_unread_locked				{ background-image: none; }
.announce_unread_locked_mine		{ background-image: none; }

.forum_link							{ background-image: none; }
.forum_read			                { background-image: none; } 
.forum_read_locked					{ background-image: none; }
.forum_read_subforum			 	{ background-image: none; }
.forum_unread						{ background-image: none; }
.forum_unread_locked				{ background-image: none; }
.forum_unread_subforum				{ background-image: none; }

.sticky_read						{ background-image: none; }
.sticky_read_mine					{ background-image: none; }
.sticky_read_locked					{ background-image: none; }
.sticky_read_locked_mine			{ background-image: none; }
.sticky_unread						{ background-image: none; }
.sticky_unread_mine					{ background-image: none; }
.sticky_unread_locked				{ background-image: none; }
.sticky_unread_locked_mine			{ background-image: none; }

.topic_moved						{ background-image: none; }
.pm_read,
.topic_read							{ background-image: none; }
.topic_read_mine					{ background-image: none; }
.topic_read_hot						{ background-image: none; }
.topic_read_hot_mine				{ background-image: none; }
.topic_read_locked					{ background-image: none; }
.topic_read_locked_mine				{ background-image: none; }
.pm_unread,
.topic_unread						{ background-image: none; }
.topic_unread_mine					{ background-image: none; }
.topic_unread_hot					{ background-image: none; }
.topic_unread_hot_mine				{ background-image: none; }
.topic_unread_locked				{ background-image: none; }
.topic_unread_locked_mine			{ background-image: none; }

Several icons are not shown if they are inserted in the css.

no icons.jpg (4.84 KiB) Viewed 39054 times

[rxu]

https://fontawesome.com/how-to-use/on-t ... me-changes
Also, as mentioned above, not all icons are available in regular type indeed. But for some of them you can play with font-weight: 400 / font-weight: 900 to get them rendered. F.e. the latter for fa-cube and both for fa-bell.

[Tastenplayer]

Fa cube is no longer displayed at all (if inserted with iconcode in the css).
Yes you can adjust the font thickness. But you can't display them fully filled if they are inserted into the css. Of the font awesome 5 you can only insert a few with fontcode into the css. The choice is more limited than before with the 4.7 icons.
I can't find suitable working icons for the Old-BBS anymore. At the moment there is probably only the backward step with the insertion of the good old png icons.

Today I was already ready to update only the usual uncomplicated styles to 3.3.1. Had already got states Fortunately the 3.2.10-RC2 styles are all updated.

From my Copyright social icons e.g only the fa-coffe is displayed. You lose hours, then maybe finally figure out how to insert this correctly in the html and css file. Doubly strange, since the coffee cup is displayed. Also the fa-file-image-o is displayed.

social Icons.jpg (3.68 KiB) Viewed 39029 times

Code: Select all

<div class="socialbuttons">
	<!-- Facebook -->
	<a href="#" title="Visit us on Facebook" target="_blank" class="btn btn-facebook"><i class="fa fa-facebook-official"></i></a>
	<!-- Twitter -->
	<a href="#" title="Twitter us" target="_blank" data-placement="top" class="btn btn-twitter"><i class="fa fa-twitter"></i></a>
	<!-- Github -->
	<a href="#" title="Github" target="_blank" class="btn btn-github"><i class="fa fa-github"></i></a>
	<!-- IF S_ENABLE_FEEDS -->
	<a type="application/rss+xml" href="{U_FEED}" class="btn btn-feed">	<i class="fa fa-feed" title="{L_FEED} - {SITENAME}"></i></a>
	<!-- ENDIF -->
	<!-- Youtube -->
	<a href="#" title="Visit us on Youtube" target="_blank" data-placement="top" class="btn btn-youtube"><i class="fa fa-youtube"></i></a>
	<!-- Paypal -->
	<a href="#" title="Thank you so much for buying me a coffee!" target="_blank" class="btn btn-coffee"><i class="fa fa-coffee"></i></a>
</div>

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)
But heaven knows why the social icons in the footer are no longer displayed.