Skip to main content ↑ ↓
Folder Icons Started by scripple · · Read 11791 times 0 Members and 1 Guest are viewing this topic. previous topic - next topic

Folder Icons

I personally preferred the folder icons used in 1.0 over the flat ones used in 1.1.  Was the change out of preference or just out of moving to svg?  I've tossed together a quick svg version of the old design.  Attached are two pngs showing it at the old board icon size and a larger size.  Would this be something you are interested in having?  It's just a quick conversion of the left most board icon using inkscape using a solid back and a gradient front.  Two colors define it.  Actually I think I left the stroke on and solid but that can be removed.

This is for light theme.  I've not looked at besocial in a long time.

Re: Folder Icons

Reply #1 –

I think the reason for change was just because the icons were automatically generated from FontAwesome, I guess revert back to the previous design wouldn't be an issue at all.
Bugs creator.
Features destroyer.
Template killer.

Re: Folder Icons

Reply #2 –

I figured as much but wanted to make sure it wasn't an explicit design decision.  If I'm the only one with the preference for the older style there's no reason for you guys to put it the effort though as I'll just change them locally on my forum.

Anyone else out their have a preference for the older style?  (Or against?)

Re: Folder Icons

Reply #3 –

Quote from: scripple – Anyone else out their have a preference for the older style?

Yes, me.  ;) I don't like font awesome very much.

I would prefer the "old fashioned style" and I would like to use my own icons.

Re: Folder Icons

Reply #4 –

Thanks @scripple those look awesome ... Yup the current choice was simple expediency of using what was in FA.

Re: Folder Icons

Reply #5 –

Quote from: Ruth – I would prefer the "old fashioned style" and I would like to use my own icons.
You can use your icons the same way you were using them before: changing the CSS pointing to your icon... okay, now there is a little trick to add:
Code: [Select]
content: "";
to remove the current one, and then use:
Code: [Select]
background: url("http://url.to.your/site/and/image.png");
or alike, I don't remember the exact syntax, but I'm pretty sure TE does. :P
Bugs creator.
Features destroyer.
Template killer.
 

Re: Folder Icons

Reply #6 –

I've no problem with the new icons. However I feel that if someone is coming to ElkArte and has no other skills than knowing how to install the forum will have trouble with it. Folders are the icons that most users change to customise their forum :D and they simply like to replace an image.

PS. I'm not sure if it's tracked anywhere, but guests see broken avatar images.
Last Edit: April 22, 2016, 04:51:48 am by CrimeS
http://studiocrimes.com - Premium & Free SMF/ElkArte Themes

Re: Folder Icons

Reply #7 –

Thank you , Emanuele, I will try this. (Will it work for the calendar-icons as well?)

FontAwesome is not really my taste, but it might look quite nice to a very modern and clear theme... and our theme is "childish and oldfashioned".  ;)

I was looking for "diamonds" in Font Awesome , wich I wanted to try as boardicons. But I did not see any. Simple dots or circles could be another possibility to create boardicons with FontAwesome, maybe they would look nice in different stylings.

Re: Folder Icons

Reply #8 –

Quote from: CrimeS – I've no problem with the new icons. However I feel that if someone is coming to ElkArte and has no other skills than knowing how to install the forum will have trouble with it. Folders are the icons that most users change to customise their forum :D and they simply like to replace an image.
Actually, it has been like that since "forever":
http://www.elkarte.net/community/index.php?topic=966.0
Change the CSS is the endorsed way to change icons, not replace images.
I know replace an image is "easy", but it's even easier upload the image in a way that an upgrade will not disrupt the theme. ;)

Quote from: CrimeS – PS. I'm not sure if it's tracked anywhere, but guests see broken avatar images.
Better always open a new topic, I know it's bothersome, but it's better for tracking. Anyway I had fixed that during the upgrade, but apparently it was reverted by mistake, so I re-added it and should work now.
Bugs creator.
Features destroyer.
Template killer.

Re: Folder Icons

Reply #10 –

One other thing to note is that the class names changed for the on/off/on2/redirect board icons ... so the current .png way will still work but any custom css will need to have the css class names tweaked just a bit.

Likewise for all of the other icons, there are now class names so you can target each of them with various CSS techniques (just like the board icons)  vs the old replace the image in the images directory.

Re: Folder Icons

Reply #11 –

Quote from: emanuele – Actually, it has been like that since >">forever>">:

Hmmm, in the Be Social! variant it was only neccessary to either change css with background-image, or edit the image accordingly. If I don't mention specifically, then I'm always talking about Be Social!. I cannot stand the Light! variant :D

Quote from: emanuele – Better always open a new topic, I know it's bothersome, but it's better for tracking. Anyway I had fixed that during the upgrade, but apparently it was reverted by mistake, so I re-added it and should work now.

I didn't want to duplicate any issues :)

Re: Folder Icons

Reply #12 –

Quote from: CrimeS – Hmmm, in the Be Social! variant it was only neccessary to either change css with background-image, or edit the image accordingly. If I don't mention specifically, then I'm always talking about Be Social!. I cannot stand the Light! variant :D
The only difference between besocial and light is the name and few colors/borders/positions, things are done the exact same way.
And in this case too, the things are again (mostly) the same: there is no "physical" image to change, just change the css.
You add your background(-image) and the only additional thing to remember is add the content: ""; (or display:none; if you prefer) to nullify the default image.

http://www.ElkArte.it/elk1.1/index.php
Code: [Select]
.i-board-on:before {
	content: "";
}
.i-board-on {
	background: url("http://www.ElkArte.net/community/index.php?action=dlattach;topic=3549.0;attach=3590;image") no-repeat;
}

.i-board-off:before {
	content: "";
}
.i-board-off {
	background: url("http://www.ElkArte.net/community/index.php?action=dlattach;topic=3549.0;attach=3590;image") no-repeat;
}

Quote from: CrimeS – I didn't want to duplicate any issues :)
Better have issues duplicated than lost in the middle of discussions that nobody is going to find once off the radar. ;)
Bugs creator.
Features destroyer.
Template killer.

Re: Folder Icons

Reply #13 –

Here's the svg file (gzipped to meet the upload permissions).  Feel free to use / modify it as you wish.

Re: Folder Icons

Reply #14 –

Quote from: TE – Here's another example how you could replace the board icons (embedded images or the good old images..)
http://www.ElkArte.net/community/index.php?topic=1124.msg7719#msg7719
Converting images to base64 is quite simple:
https://www.base64-image.de/

What are base64 images ?