jquery ui styles override theme

This topic contains 2 replies, has 2 voices, and was last updated by  Stiofan O’Connor 8 years, 9 months ago.

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket
  • Author
    Posts
  • #143132

    clloh
    Free User
    Post count: 1

    Hi there. First off, great plugin! Love the work you’re doing.

    There’s a slight issue that’s been troubling me. The jquery ui styles are overriding my theme’s defaults. Using console to inspect the <h5> element of the accordion at my page here, and filtering the styles to display only “color”, you can see that jquery-ui.scss is affecting the color with its .ui-stat-active class, which has a higher css specificity than the theme’s setting on the h5 element. For info, the original page look and styles are available at web archive.

    I read up a previous post where the GD team asked about the GD design setting of disabling core scss files. I tried both enabling and disabling but both displayed the same issue – I can see the jquery-ui.scss style override through Chrome console. (wondering whether its immaterial here because Chrome might have displayed the css mapping?)

    Wonder if you can help limit the effect of the jquery-ui styles to GD specific portions?

    Alternatively, appreciate your advice on how to solve this in other ways, except using !important which could mess up styling in the future.

    #143142

    clloh
    Free User
    Post count: 1

    By the way, I just used custom css to change the style back to original. The issue still persists as can be observed via the code in console. Would be great if there’s a way to limit the effect of GD and its assets’ styles to GD content. Would like to know how. Thanks!

    #143631

    Stiofan O’Connor
    Site Admin
    Post count: 22956

    Hi clloh,

    The jQuery UI styles are usually specific, i’m guessing it’s clashed with your setup here and it would be the same if you added any plugin that had jQuery UI styles. As you seem to have found the styles can be fixed just by making it more specific rather than using important, even just copy a style and add “body” infront of it will usually do it.

    If we had to we could go down the route of trying to disable that script on certain pages but the above solution is much easier.

    Thanks,

    Stiofan

Viewing 3 posts - 1 through 3 (of 3 total)

We have moved to a support ticketing system and our forums are now closed.

Open Support Ticket
20% Discount Offer
Hurry! Get your 20% discount before it expires. Get 20% Discount