With a lot of smileys, especially animated, in the popup window the differentiation of smileys can be difficult. Where do one smiley end and another start? Not easy sometimes... I think it would be easier if the spacing would be greater or there would be small lines between them (as I made with the first line)... What do you think? Can you differentiate all smileys in my attached window? ;)
I can, but only because I know where to look. More padding will work even with less smileys. I wonder if the smiley strip needs more padding, if only for mobile.
Yep, agree.
With the current markup I don't think we can do much, one idea could be to add some padding and add an alternate background:
.sceditor-smileyPopup img:nth-child(odd) {
padding: 5px;
background-color: lightgrey;
}
Hm, don't know, but is there a grid which sets the images into the window? If so, we could show the grid lines?
That's the reason I said "With the current markup I don't think we can do much". ;)
Not exactly what you are asking, have you seen this addon Jorin? Could be useful if you have lot of smilies
http://addons.elkarte.net/enhancement/Tabbed-Smileys.html
Okay, maybe in the future?
Thanks, radu, I know this addon, but we don't have too much smileys. Or do you think we have? :D
Last I checked (in SMF years ago,probably changed) the (lack of) markup just puked naked images every which way.
Same here.
I sent a commit just few minutes ago to improve this:
https://github.com/elkarte/Elkarte/pull/2732/commits/fe37c485093c6a8eff58031b86f3ca71d599ab3f
Not really, and thats the problem. You could get a vertical line giving the image a border like:
.sceditor-smileyPopup img {
border-right: 2px solid #ccc;
vertical-align: middle;
padding-right: 10px;
} but you will see the height of the vertical bar vary a bit with the image height, but it will at least give a bit of a grid look.
Past that you need to use the code fix that emanuele just posted :D , then you can do more with the CSS
I think I'll go with the lines, thanks
@Spuds. If I remember correctly I can change the size of the pop-up window in a theme file and not the css file, right? It seems not to be in index.template.php nor in post.template.php. Any hints?
I can't think of a good reason for that.
Looking at it, the only constrain on the width applied is a max-width: 50% applied to .sceditor-smileyPopup. So, if you want to have it larger you can add to your custom.css:
.sceditor-smileyPopup {
max-width: 90%;
}for example.
That should work, provided the smiley are enough to make it wide.