Rename dims class

[jkphl]

Rename dims class

[jkphl]

Hi @dugokontov,

your suggestion only works as long as all icons have the same dimensions — which doesn't need to be true (and in reality often is not). So there's no way to define a common dimension class.

In case all your icons have the same dimensions, feel free to suppress the generation of dimension classes and add the single dim class in your own / custom stylesheet.

Cheers,
Joschi

[dugokontov]

I think you didn't understand me. There will not be one .dims class for all icons. There will be separate one for every icon in sprite. Let me expand example from above:

.icon-arrow,.icon-arrow\:regular{background-image:url('svg/icons.svg');background-position:0 0;background-repeat:no-repeat}
.icon-arrow.dims{width:22px;height:15px}

.icon-search,.icon-searc\:regular{background-image:url('svg/icons.svg');background-position:0 23px;background-repeat:no-repeat}
.icon-search.dims{width:12px;height:50px}

As you can see adding just .dim class to any element will not do anything. So this will not apply any stile:

<div class="dims"></div>

For this div element to convert to any icon you have to add "icon" class, like this:

<div class="icon-arrow dims"></div>

and it will set width/height to 22px/15px. To display search icon create this html:

<div class="icon-search dims"></div>

and it will set width/height to 12px/50px.

I find this to be much cleaner than how it works now:

<div class="icon-search icon-search-dims"></div>

Not to say that it can easily produce errors on copy paste, where you apply dimensions from wrong icon, like this:

<div class="icon-search icon-arrow-dims"></div>

[jkphl]

Hi @dugokontov,

thanks for the explanation. I do understand your point now (and partly like the idea), although I don't fully agree with your statement that this is much cleaner. In fact, I see several possible implications:

• IMO, using the same class name for specifying the (individual) sizes of all icons somehow suggests that they all have the same size. I don't mind using more verbose — and more meaningful — class names.
• The support for chained CSS class names is pretty good but not identical to separate classes. Also, I don't have any insights about the support on the various mobile platforms.
• I'm not sure about the specificity implications of the chained classes. What happens when you define additional properties for the dims class? This might be a feature, but also a problem ...

Anyway, I see your point and I understand that this might come in handy in certain situations. Having said this, I recommend you to have an eye on the Node respectively Grunt based version of iconizr, which feature Mustache template based output rendering. Possibly you can achieve your proposal by modifying the output templates appropriately. Additionally, I might consider adding a switch to control the dimension class names in one of the next releases. Given that you posted this to the original PHP based version of iconizr, I must draw your attention to the fact that this is the most outdated version. I plan to improve it and move it to the same level as the Node / Grunt based versions someday, but please don't expect this to be in the nearest future.

Cheers,
Joschi

[dugokontov]

Ok, thanks for the info.

I used this repo since this is the link you provided in footer of http://iconizr.com/ webpage: "You may report any issue there as well"

[jkphl]

@dugokontov thanks! Yes, unfortunately the iconizr.com website along with the PHP version of iconizr (which the website is based on) is rather outdated and I just can't find the time to work on either of them :(