Custom css classnames get prepended to selector

  • Resolved gpbc

    (@gpbc)


    1 year, 5 months ago

    Really good plugin , but finding when we use the built-in block field for ‘additional css classes’ , these class names get prepended to the ‘selector’ string in the custom css textarea

    So say we add an additional css class to a block called ‘hide-on-desktop’ , in the custom css textarea we end up with all our custom styling getting brocken as the css classnames become –

    .hide-on-desktopselector{
    margin-bottom: 3rem;
    }

    It is really hard to fix as well via different css class positioning , etc

    Is this a common issue and anything we can do to fix?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Hardeep Asrani

    (@hardeepasrani)

    1 year, 5 months ago

    Hey @gpbc,

    By default the selector is a unique class that we apply to a block. so for example, if you’re applying margin to a block, you can just make it:

    selector {
    margin-bottom: 3rem;
}

    And in frontend, it will be applied to that block. Let me know if it works for you.

    Thread Starter gpbc

    (@gpbc)

    1 year, 5 months ago

    Hey @hardeepasrani , I know to just use ‘selector’ thanks.

    The problem is your plugin takes any classes in the ‘additional css class’ field and prepends them to the word ‘selector’.

    We are not doing this – “.hide-on-desktopselector{“

    The ‘hide-on-desktop’ class was added to the block setting ADVANCED -> ADDITIONAL CSS CLASS(ES), and for some reason it gets prepended to the word selector.

    If we delete it, it simply gets re-added.

    We really struggle to remove this as well without having to remove the additional css classes, which we don’t want to do in every instance since we want to be able to use the site stylings as well as the custom css editor.

    Hope this makes sense

    luciamarinescu

    (@luciamarinescu)

    1 year, 5 months ago

    Hi @gpbc!

    Unfortunately, I’m not able to replicate this behaviour on my test instance. Please provide us a screencast where the issue can be seen so we can take a closer look at it.

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Custom css classnames get prepended to selector’ is closed to new replies.