Bad CSS breaks icon fonts

  • Resolved swinggraphics

    (@swinggraphics)


    7 years, 1 month ago

    Your CSS includes this:

    i {
    font-family: 'Connections-Brandicons' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    This is so inconsiderate, I can hardly believe it. Naturally, this breaks other, properly coded, font icon libraries; mostly due to the !important, but your plugin should absolutely not be declaring any rules for elements without more specificity. It is presumptuous that your plugin would be the only thing to make use of <i> elements. If your plugin uses icon fonts, add class names to the elements.

    Normally, I would just uninstall and delete a plugin like this, but this on a client site that has been using the plugin with a paid extension for a couple years.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Steven

    (@shazahm1hotmailcom)

    7 years, 1 month ago

    @swinggraphics

    Apologies for the oversight! The CSS selectors are auto-generated by a popular icon font packager. I had changed the CSS selector in the initial update which first introduced the icon font use in Connections to prevent such conflicts. I overlooked doing this time after I had to recreate the font package to change the font-family name because I learned that a very popular theme did not change the default font-family name (either) when using the same icon font packager.

    For a quick fix change i to i[class^='cn-brandicon'] in the CSS file.

    I’ve already pushed this change to the current release so all others who update will not run into this potential conflict. I’ll push a proper update out asap.

    Thank you for taking the time for reporting the issue. I apologize for the trouble!

    Thread Starter swinggraphics

    (@swinggraphics)

    7 years, 1 month ago

    That’s great, many thanks!!

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Bad CSS breaks icon fonts’ is closed to new replies.