Simple Machines Community Forum

Customizing SMF => Modifications and Packages => Topic started by: SychO on April 20, 2019, 05:30:45 AM

Title: FA Board Icons
Post by: SychO on April 20, 2019, 05:30:45 AM
Link to Mod (https://custom.simplemachines.org/mods/index.php?mod=4224)

FA Board Icons
FontAwesome icons for boards

Settings
Each board has an icon & color fields
A default icon and color can be specified under Admin > Configuration > Modification Settings > Miscellaneous

(https://2.bp.blogspot.com/-n7KjI2pzwCE/XMF6sxZnoRI/AAAAAAAAE_4/oSl8DGm7ch0UncbqUMihLt-amSkZUlq-ACK4BGAYYCw/s1600/fabi.png)

Changelog

License
FA Board Icons is released under the MIT License. A full copy of this license is included in the package file.

Copyrights
FontAwesome Icons (https://fontawesome.com/license/free) © 2019
Title: Re: FA Board Icons
Post by: GigaWatt on April 21, 2019, 12:39:23 AM
Nice 8). Now I can do this :P :D.

(https://i.postimg.cc/LH0Gkm21/SHOT7032.png)
Title: Re: FA Board Icons
Post by: SychO on April 21, 2019, 05:12:13 AM
Interesting choice of color for the icons
Title: Re: FA Board Icons
Post by: lurkalot on April 21, 2019, 05:39:50 AM
Interesting choice of color for the icons

GigaWatt does like blue.  ;)

Nice mod by the way.  I might give this one a go at some point.  8)
Title: Re: FA Board Icons
Post by: pocttopus on April 21, 2019, 11:33:07 AM
Amazing job SychO.  ;)

Title: Re: FA Board Icons
Post by: Rock Lee on April 21, 2019, 04:23:48 PM
Without a doubt, a great job @SychO. I comment on github but it does not cost me anything to leave the translation attached to the Latin Spanish here.


Regards!
Title: Re: FA Board Icons
Post by: SychO on April 21, 2019, 04:32:07 PM
Thank you Rock Lee, I will update the package as soon as I can.
Title: Re: FA Board Icons
Post by: GigaWatt on April 21, 2019, 05:31:41 PM
Interesting choice of color for the icons

GigaWatt does like blue.  ;)

Actually, the icon and the color was pretty random :P :D... but yeah, I do like blue ;).

Just wanted to test it out... see how the icons would look :).
Title: Re: FA Board Icons
Post by: addlife on April 23, 2019, 03:58:48 PM
Thanks for the mod! Changing board icons really sets the tone of a site.

I've used bigguys cbi v.05 to do that on my site. Although I'm assuming this makes it easier.
Title: Re: FA Board Icons
Post by: SychO on April 23, 2019, 04:07:02 PM
Well this is a 2.1 mod and it's not for image icons, you can set FontAwesome Icons (https://fontawesome.com/icons) with it :)
Title: Re: FA Board Icons
Post by: GigaWatt on April 23, 2019, 10:11:03 PM
I've used bigguys cbi v.05 to do that on my site. Although I'm assuming this makes it easier.

I didn't see an option to make it board specific, so this pretty much means that whatever you set, it changes the icons of all boards.
Title: Re: FA Board Icons
Post by: SychO on April 24, 2019, 04:18:46 AM
Which mod are you talking about Gigawatt ?
Title: Re: FA Board Icons
Post by: Bigguy on April 24, 2019, 06:48:13 AM
https://custom.simplemachines.org/mods/index.php?mod=511
Title: Re: FA Board Icons
Post by: SychO on April 24, 2019, 07:09:05 AM
https://custom.simplemachines.org/mods/index.php?mod=511

no I meant which mod is he talking about when he says that you can't choose icons per board, because yes you can with FA Board Icons as that's the whole point of it.
Title: Re: FA Board Icons
Post by: Bigguy on April 24, 2019, 07:27:28 AM
I thought he meant your mod does not work on a per board basis like mine does. If yours does, than not sure what he means. Just skip by this post, lol. I just woke up, so might be a bit slow still. :)
Title: Re: FA Board Icons
Post by: SychO on April 24, 2019, 07:33:38 AM
I thought he meant your mod does not work on a per board basis like mine does. If yours does, than not sure what he means. Just skip by this post, lol. I just woke up, so might be a bit slow still. :)

You're not slow, that's what he said, oh and good morning to you :P
Title: Re: FA Board Icons
Post by: Bigguy on April 24, 2019, 07:35:59 AM
Good morning back to you sir. :)
Title: Re: FA Board Icons
Post by: GigaWatt on April 24, 2019, 05:52:02 PM
Yeah, that is what I was actually saying, the icon change is global, not applicable per board.

So, I went back to my test site and looked at the mod and settings once more.

(https://i.postimg.cc/2SFc936k/SHOT7034.png)

If there are per board settings, where are they ???.
Title: Re: FA Board Icons
Post by: SychO on April 24, 2019, 05:55:39 PM
in the specific board editing page :3
Title: Re: FA Board Icons
Post by: GigaWatt on April 24, 2019, 06:04:47 PM
Ah, yes, you're right ;).

(https://i.postimg.cc/XJFyxBjx/SHOT7035.png)

This mod is even cooler than I thought :)... oh I'm definitely implementing this on my forum when 2.1 becomes final 8).

PS: Did I miss something in the mod's description ???.

EDIT: My mistake, once again, you're correct ;).

Each board has an icon & color fields
Title: Re: FA Board Icons
Post by: gecitli on April 25, 2019, 03:19:28 AM
nice mod

Make the style of Cbi v.05
Code: [Select]
#board_1 .fabi_icon .fa-comments:before { content:"\f1d8";}
#board_2 .fabi_icon .fa-comments:before { content:"\f436";}

(https://i.postimg.cc/2SSJQWPh/icon.jpg) (https://postimg.cc/YhTbkv2C)



Title: Re: FA Board Icons
Post by: SychO on April 25, 2019, 04:16:00 AM
You can already choose specific board icons from the board settings...
Title: Re: FA Board Icons
Post by: ForumMustang.com on May 15, 2019, 03:34:46 PM
This is an interesting mod but we are loosing the "no new posts", new posts" icons with this mod.
In a future version, would it be possible to have different color fields for each boards? One for the "no new posts", one for the "new posts" and ideally, one for the "new posts in a subboard"?
Title: Re: FA Board Icons
Post by: SychO on May 15, 2019, 04:28:20 PM
This is an interesting mod but we are loosing the "no new posts", new posts" icons with this mod.
In a future version, would it be possible to have different color fields for each boards? One for the "no new posts", one for the "new posts" and ideally, one for the "new posts in a subboard"?

If I were to make a change for that, I'd use an opacity effect, i.e slightly translucent icons for no new posts and normal for new posts, more colors would only make things more complex because of the "Force default" options, and I like to keep things simple.
Title: Re: FA Board Icons
Post by: ForumMustang.com on May 15, 2019, 05:04:45 PM
That's a good idea, I hope you will make a change for that.
Title: Re: FA Board Icons
Post by: maximus23 on May 16, 2019, 10:37:22 PM
Hello,

A variation easy to test :

File FA-BoardIcons.template.php

Search :

Code: [Select]
echo '
<a href="', ($context['user']['is_guest'] ? $board['href'] : $scripturl . '?action=unread;board=' . $board['id'] . '.0;children'), '" class="board_', $board['board_class'], ' fabi_icon"', !empty($board['board_tooltip']) ? ' title="' . $board['board_tooltip'] . '"' : '', '>
<i class="', $icon, '"', !empty($color) ? ' style="color:'.$color.'"' : '', '></i>
</a>';

Replace by :
Code: [Select]
if ($board['new'] == 1) {

echo '
<a href="', ($context['user']['is_guest'] ? $board['href'] : $scripturl . '?action=unread;board=' . $board['id'] . '.0;children'), '" class="board_', $board['board_class'], ' fabi_icon_new"', !empty($board['board_tooltip']) ? ' title="' . $board['board_tooltip'] . '"' : '', '>
<i class="', $icon, '"', !empty($color) ? ' style="color:'.$color.'"' : '', '></i>
</a>';
}

else

echo '
<a href="', ($context['user']['is_guest'] ? $board['href'] : $scripturl . '?action=unread;board=' . $board['id'] . '.0;children'), '" class="board_', $board['board_class'], ' fabi_icon"', !empty($board['board_tooltip']) ? ' title="' . $board['board_tooltip'] . '"' : '', '>
<i class="', $icon, '"', !empty($color) ? ' style="color:'.$color.'"' : '', '></i>
</a>';

}

Save.

File fabi.css

Search :
Code: [Select]
.board_icon .fabi_icon {
text-align: center;
display: flex;
align-items: center;
margin: 0 auto;
background: none;
font-size: 2.5em;
text-decoration: none;
color: #6e91ae;
}

Replace by :
Code: [Select]
.board_icon .fabi_icon {
text-align: center;
display: flex;
align-items: center;
margin: 0 auto;
background: none;
font-size: 2.5em;
text-decoration: none;
color: #6e91ae;
overflow: hidden;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
width: 60px;
    height: 60px;
padding: 13px;

}

.board_icon .fabi_icon_new {
text-align: center;
display: flex;
align-items: center;
margin: 0 auto;
background: none;
font-size: 2.5em;
text-decoration: none;
color: #6e91ae;
background: #d7daf3;
overflow: hidden;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
width: 60px;
    height: 60px;
padding: 13px;
}

:)
Title: Re: FA Board Icons
Post by: Diego Andrés on July 14, 2019, 12:33:53 AM
I prefer the opacity option, but that is really good alternative.