[Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

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
Pony99CA
Registered User
Posts: 986
Joined: Sun Feb 08, 2009 2:35 am
Location: Hollister, CA
Contact:

Re: [Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

Post by Pony99CA »

callumacrae wrote: Fri Oct 02, 2015 11:34 am Pony, are you using an adblocker? Some of the more overzealous ones block icon fonts (have I mentioned yet that they suck?)
Not on this PC. I used to have problems with graphics showing up on phpBB.com (like avatars), but that problem went away a while ago. The proxy here does block some domains, though, so if you tell me the URL of the server, I can check that.

Steve
Silicon Valley Pocket PC (http://www.svpocketpc.com)
Creator of manage_bots and spoof_user (ask me)
Need hosting for a small forum with full cPanel & MySQL access? Contact me or PM me.

User avatar
Kailey
Community Team Leader
Community Team Leader
Posts: 36
Joined: Mon Sep 01, 2014 10:54 pm

Re: [Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

Post by Kailey »

Is it really necessary to have the "home" icon appear twice in the breadcrumbs? It just looks cheap.

Looking at the code, we could easily change

Code: Select all

<span class="crumb" {$MICRODATA}><a href="{U_INDEX}" accesskey="h" data-navbar-reference="index"><i class="icon fa-home fa-fw"></i><span>{L_INDEX}</span></a></span>
to

Code: Select all

<span class="crumb" {$MICRODATA}><a href="{U_INDEX}" accesskey="h" data-navbar-reference="index"><!-- IF not U_SITE_HOME --><i class="icon fa-home fa-fw"></i><!-- ENDIF --><span>{L_INDEX}</span></a></span>
Screenshot of the effect:

breadcrumbs.png
breadcrumbs.png (2.55 KiB) Viewed 190596 times

EDIT: Adding attachments is somewhat broken. If you add an attachment, you have to refresh the page for the box to appear where you can "place inline" or "delete file". Not sure if this needs to be a bug report or not as I know Area51 has some quirks.

User avatar
hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 968
Joined: Sat Dec 25, 2010 9:02 pm
Contact:

Re: [Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

Post by hanakin »

Pony99CA wrote: Thu Oct 01, 2015 2:01 am I'm still seeing this problem on my work system using IE 10. Are the icons being delivered through a CDN or something?

Steve
CDN with fallback do an inspection of the source and see which its attempting to load
Donations welcome via Paypal Image

User avatar
hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 968
Joined: Sat Dec 25, 2010 9:02 pm
Contact:

Re: [Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

Post by hanakin »

kinerity wrote: Sat Oct 03, 2015 5:03 am Is it really necessary to have the "home" icon appear twice in the breadcrumbs? It just looks cheap.

Looking at the code, we could easily change

Code: Select all

<span class="crumb" {$MICRODATA}><a href="{U_INDEX}" accesskey="h" data-navbar-reference="index"><i class="icon fa-home fa-fw"></i><span>{L_INDEX}</span></a></span>
to

Code: Select all

<span class="crumb" {$MICRODATA}><a href="{U_INDEX}" accesskey="h" data-navbar-reference="index"><!-- IF not U_SITE_HOME --><i class="icon fa-home fa-fw"></i><!-- ENDIF --><span>{L_INDEX}</span></a></span>
Screenshot of the effect:

breadcrumbs.png

EDIT: Adding attachments is somewhat broken. If you add an attachment, you have to refresh the page for the box to appear where you can "place inline" or "delete file". Not sure if this needs to be a bug report or not as I know Area51 has some quirks.
already patched the attachments needs pushed to area51, as for the home thing ill look into it, but it might be area51 specific
Donations welcome via Paypal Image

User avatar
DavidIQ
Customisations Team Leader
Customisations Team Leader
Posts: 1903
Joined: Thu Mar 02, 2006 4:29 pm
Location: Earth
Contact:

Re: [Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

Post by DavidIQ »

Viewing the topic list on my iPad in portrait mode and with unread replies causes the new replies icon to be on one line and the topic title to be on another. Not sure if that's a result of this ticket or another or if it's already been fixed but looks pretty bad.
Image

User avatar
hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 968
Joined: Sat Dec 25, 2010 9:02 pm
Contact:

Re: [Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

Post by hanakin »

David provided screenshot and I'll look into it when I get back
Donations welcome via Paypal Image

User avatar
DavidIQ
Customisations Team Leader
Customisations Team Leader
Posts: 1903
Joined: Thu Mar 02, 2006 4:29 pm
Location: Earth
Contact:

Re: [Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

Post by DavidIQ »

Here you go.
Attachments
Landscape (looks ok)
Landscape (looks ok)
Portrait (doesn't look ok)
Portrait (doesn't look ok)
Image

User avatar
Arty
Former Team Member
Posts: 985
Joined: Wed Mar 06, 2002 2:36 pm
Location: Mars
Contact:

Re: [Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

Post by Arty »

It is caused by addition of this line: https://github.com/phpbb/phpbb/blob/mas ... ks.css#L11

Browsers wrap inline and inline-block elements differently. When there are 2 inline elements in a row and whole text doesn't fit available width, browsers display split text like both elements were part of same element. When element its trying to wrap has display:inline-block, it is moved to its own line like block element.

User avatar
Pony99CA
Registered User
Posts: 986
Joined: Sun Feb 08, 2009 2:35 am
Location: Hollister, CA
Contact:

Re: [Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

Post by Pony99CA »

DavidIQ wrote: Sun Oct 04, 2015 12:20 pm Viewing the topic list on my iPad in portrait mode and with unread replies causes the new replies icon to be on one line and the topic title to be on another. Not sure if that's a result of this ticket or another or if it's already been fixed but looks pretty bad.
I get that same behavior on my desktop PC in IE 10. And, as I don't see the icon, I have to mouse around a bit to find the hot spot. :evil:

Steve
Silicon Valley Pocket PC (http://www.svpocketpc.com)
Creator of manage_bots and spoof_user (ask me)
Need hosting for a small forum with full cPanel & MySQL access? Contact me or PM me.

User avatar
DavidIQ
Customisations Team Leader
Customisations Team Leader
Posts: 1903
Joined: Thu Mar 02, 2006 4:29 pm
Location: Earth
Contact:

Re: [Define New Theme] 8. Utilize Font Awesome icons where icons are needed to simplify server requests.

Post by DavidIQ »

I'm actually seeing the same missing icons problem on my work machine (IE11) but I think it's some policy they've implemented here on the browser. The site looks fine on Chrome on the same machine and looks fine in IE11 on other non-work machines, although it looks fine in Edge on my work laptop. Fiddler doesn't show anything out of the ordinary that can help to identify the issue and the DOM explorer (F12 tools) doesn't show anything out of the ordinary.
Image

Post Reply