Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • July 31, 2019 at 1:31 pm #1123546
    designbasis

    Hi Folks,

    small new prob – I took this code-snippet from your documentation-page
    ————————————————————————————
    /* Background on hover */
    .my-custom-button a.avia-button:hover {
    background: rgba(112, 112, 112, 1) !important;
    }
    ————————————————————————————
    but he doesn’t work on my button. What do I wrong? :-/ I want to change
    the colour of the button-background by hover, of course. ;-)

    Thx for your help!

    Best regards
    Carsten

    August 1, 2019 at 6:20 am #1123753
    Rikard

    Hey Carsten,

    You don’t have this class on the page: my-custom-button, that’s why it’s not working. Please try this instead:

    .page-id-900 .avia-button-right a.avia-button:hover {
   background: rgba(112, 112, 112, 1) !important;
}

    Best regards,
    Rikard

    August 1, 2019 at 2:57 pm #1123917
    designbasis

    Hi Rikard,

    thank you for your help…your snippet works very well! :-)

    I always thought that the code-snippets in the documentation
    are universal, but now it seems to me that they’re not. What
    does “class” means…I think classifying, right? What will I have
    to look out for in the future when I read the documentary?

    I have further buttons on the startpage in a “fullscreen-slider”
    but on these ones the code-snippet have no effect…why?
    I think, it has to do with the slider-container, right? But the set-
    tings of the advanced stylings have effect on it…why is that so?

    Thank you for your further help!

    Best regards
    Carsten

    August 2, 2019 at 5:52 am #1124050
    Rikard

    Hi Carsten,

    Classes in CSS are what always starts with a dot:

    .my-class {
  CSS goes here
}

    To add your own class to an element then you can activate that option under Enfold->Layout Builder->Show element options for developers. Then add your own class to the element. The documentation is using dummy (made up, example) classes, so you would have to replace my-custom-button in the example with your own class:

    .my-custom-button a.avia-button:hover {
background: rgba(112, 112, 112, 1) !important;
}

    Best regards,
    Rikard

    August 2, 2019 at 3:07 pm #1124191
    designbasis

    Hi Rikard,

    thx again for your promptly reply!

    Ok…understand! I activated that option as you written.
    And how I’m do it to add my own class to the element now?
    For exmple, what I have to write instead of “.my-custom-button”?

    And could you please so kind an help me still also with my the second question:
    ———————————————————————————
    I have further buttons on the startpage in a “fullscreen-slider”
    but on these ones the code-snippet have no effect…why?
    I think, it has to do with the slider-container, right? But the set-
    tings of the advanced stylings have effect on it…why is that so?
    ———————————————————————————
    Have a nice weekend and I’m happy to hear from you again.

    Best regards
    Carsten

    August 3, 2019 at 5:30 am #1124308
    Rikard

    Hi Carsten,

    You don’t need to include the dot in the CSS class field, so in your example it would only be this:

    my-custom-button

    Which buttons exactly are you referring to on the home page, and which snippets are you using?

    Best regards,
    Rikard

    August 4, 2019 at 7:46 pm #1124576
    designbasis

    Hi again Rikard,

    I mean the two orange buttons which are intergrated in the slide-show on the top of the site.
    They react on the “advanced stylings” but not on your code-snippet.

    The back-button on the other page react on your code-snippet and on the “advanced stylings”.
    So I thought that concerns to all buttons of the site. ;-)

    And now what is here the solution?

    Best regards
    Carsten

    August 6, 2019 at 8:51 am #1125008
    Ismael

    Hi,

    Thank you for the update.

    We don’t see any slider on that page. Did you remove it? The css code above is only applicable to the actual button element. If you want to change the style of the slideshow buttons manually, use this css code.

    #top .main_color .avia-slideshow-button.avia-color-theme-color {
    color:#ffffff;
    border-color:#d05a00;
    background-color:#f07c00;
}

    Best regards,
    Ismael

    August 7, 2019 at 1:46 pm #1125524
    designbasis

    Hi Ismael,

    thx for your new reply!

    Yes, it is a slider-container but with only one image. That’s the reason why you
    don’t see any image-rotation. ;-)

    My customer had recently another wish so I solved the problem on another way.
    And thus the problem is gone for the moment. But the next is definitely waiting
    around the corner. So…see you soon… ;-)

    Best regards
    Carsten

    August 8, 2019 at 6:24 am #1125765
    Rikard

    Hi Carsten,

    Thanks for the update, just let us know if you should need any further help from us.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.