×
Blue Eagle 1.5.2 Released (11 Dec 2018)

The Kunena team has announce the arrival of Kunena Blue Eagle 1.5.2 which is now available for download as a native Joomla extension for Kunena 5.1. This version addresses most of the issues that were discovered in K 1.5.1 and issues discovered during the development stages of K 1.5.2.

× Please note: The Kunena project team takes NO responsibility for maintaining nor supporting anything in this category.

Question Can't Get Kunena to display Font-Awsome Glyphs

More
2 years 5 months ago #1 by webdevtim
Have added the Font-Awsome 'Fonts' folder to my template root. Added font-awesome.min.css to the templae/css folder. Added
@import url("font-awesome.min.css");
.fa:before {
  font-family: fontawesome;
}
.fa {
  font-family: Verdana, Arial, sans-serif;
}
to the template.css file.

added:
.icon-group:before {
	content: "\f0c0";
}
to the template.css file and alternatively added
.fa-user:before {
	color: #002a67;
}
to the template.css and in the one case added icon-group to the Category Icon: field and in the other case .fa-user to the Category Icon field. In both cases Kunena only display a place holder square for the icon, but in the Joomla Home menu a house is displayed next to the words home using the same procedure. Is there something else I need to do?

Please Log in or Create an account to join the conversation.

More
2 years 5 months ago #2 by 810
try
.fa {
font: normal normal normal 14px/1 FontAwesome;
}

Please Log in or Create an account to join the conversation.

More
2 years 5 months ago #3 by webdevtim
That worked after I made some other changes.

I added the following classes:
[class^="fa-icon-"],
[class*=" fa-icon-"] {
	position: relative;
}
[class^="fa-icon-"]:before,
[class*=" fa-icon-"]:before {
	color: #00264d;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	left: 0;
	text-decoration: inherit;
	position: absolute;
}
[class^="fa-icon-"].disabled,
[class*=" fa-icon-"].disabled {
	font-weight: normal;
}
 
 
.fa-icon-group:before {
	content: "\f0c0";
}

And this did it.

Thank you for your help.

Please Log in or Create an account to join the conversation.

  • Not Allowed: to create new topic.
  • Not Allowed: to reply.
  • Not Allowed: to add attachements.
  • Not Allowed: to edit your message.
Time to create page: 0.080 seconds