phpBB 3.3.1-RC1 released

General discussion of development ideas and the approaches taken in the 3.x branch of phpBB. The current feature release of phpBB 3 is 3.3/Proteus.
Forum rules
Please do not post support questions regarding installing, updating, or upgrading phpBB 3.3.x. If you need support for phpBB 3.3.x please visit the 3.3.x Support Forum on phpbb.com.

If you have questions regarding writing extensions please post in Extension Writers Discussion to receive proper guidance from our staff and community.
Post Reply
User avatar
P_I
Community Team
Community Team
Posts: 137
Joined: Fri Oct 31, 2014 4:56 am

Re: phpBB 3.3.1-RC1 released

Post by P_I »

rxu wrote: ↑Wed Jun 24, 2020 2:47 pm 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.
Top
User avatar
Tastenplayer
Registered User
Posts: 40
Joined: Thu Dec 06, 2018 11:14 am
Contact:
Contact Tastenplayer

Re: phpBB 3.3.1-RC1 released

Post by 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.
Last edited by Tastenplayer on Wed Jun 24, 2020 5:34 pm, edited 1 time in total.
Be the best version of yourself rather than a bad copy of someone else!
Top
User avatar
rxu
Registered User
Posts: 166
Joined: Tue Apr 04, 2006 4:28 pm
Contact:
Contact rxu

Re: phpBB 3.3.1-RC1 released

Post by rxu »

Tastenplayer wrote: ↑Wed Jun 24, 2020 5:26 pm 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
Image
Top
User avatar
Tastenplayer
Registered User
Posts: 40
Joined: Thu Dec 06, 2018 11:14 am
Contact:
Contact Tastenplayer

Re: phpBB 3.3.1-RC1 released

Post by 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
code in navbar.jpg (3.74 KiB) Viewed 38989 times
The main thing is that the distance is right now.
colorcodenav.jpg
colorcodenav.jpg (4.77 KiB) Viewed 38985 times
Last edited by Tastenplayer on Wed Jun 24, 2020 5:41 pm, edited 1 time in total.
Be the best version of yourself rather than a bad copy of someone else!
Top
User avatar
rxu
Registered User
Posts: 166
Joined: Tue Apr 04, 2006 4:28 pm
Contact:
Contact rxu

Re: phpBB 3.3.1-RC1 released

Post by rxu »

Tastenplayer wrote: ↑Wed Jun 24, 2020 5:39 pm But now it's suddenly true - for whatever reason.
That's a browser cache ;)
Image
Top
User avatar
Tastenplayer
Registered User
Posts: 40
Joined: Thu Dec 06, 2018 11:14 am
Contact:
Contact Tastenplayer

Re: phpBB 3.3.1-RC1 released

Post by Tastenplayer »

You are allways too fast for me with my english :mrgreen:
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. :lol:

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;
}
Last edited by Tastenplayer on Sat Jun 27, 2020 9:02 am, edited 1 time in total.
Be the best version of yourself rather than a bad copy of someone else!
Top
janus
Registered User
Posts: 28
Joined: Thu Nov 26, 2015 1:06 pm

Re: phpBB 3.3.1-RC1 released

Post by janus »

rxu wrote: ↑Mon Jun 22, 2020 5:25 pm 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.
Top
User avatar
Tastenplayer
Registered User
Posts: 40
Joined: Thu Dec 06, 2018 11:14 am
Contact:
Contact Tastenplayer

Re: phpBB 3.3.1-RC1 released

Post by 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.
font icons in style.jpg
fa-cube.jpg
fa-cube.jpg (6.08 KiB) Viewed 38953 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
no icons.jpg (4.84 KiB) Viewed 38945 times
Be the best version of yourself rather than a bad copy of someone else!
Top
User avatar
rxu
Registered User
Posts: 166
Joined: Tue Apr 04, 2006 4:28 pm
Contact:
Contact rxu

Re: phpBB 3.3.1-RC1 released

Post by 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.
Image
Top
User avatar
Tastenplayer
Registered User
Posts: 40
Joined: Thu Dec 06, 2018 11:14 am
Contact:
Contact Tastenplayer

Re: phpBB 3.3.1-RC1 released

Post by 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
social Icons.jpg (3.68 KiB) Viewed 38920 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.
Last edited by Tastenplayer on Sat Jun 27, 2020 9:07 am, edited 1 time in total.
Be the best version of yourself rather than a bad copy of someone else!
Top
Post Reply

Return to “[3.x] Discussion”