Almost working please help

  • Resolved Audiomonk

    (@audiomonk)


    5 years, 10 months ago

    Almost working, I have the custom css in the styling area, and although the hover gradients are working great on the flyout menus. I want to have the custom gradient over the ones that are solid purple. I’ve added the custom css, but they still remain purple, they change when hovered which is great, but I’d like them to have a gradient background.

    Also added the custom css to the customiser of the theme, and they still stay purple.

    Also, I noticed some strange behaviour after the menu disappears, it seems to leave the down pointing chevrons on the screen afterwards.

    Any ideas?

    • This topic was modified 5 years, 10 months ago by Audiomonk.

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter Audiomonk

    (@audiomonk)

    5 years, 10 months ago

    If I add the following CSS to a browser CSS editor

    '#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link {
    background: #3a6186;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #89253e, #3a6186);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #89253e, #3a6186); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}<code></code>

The menu is just how I want it, but if I add this same CSS to the custom styling area, I'm still left with the plain single colour on the mega menu items. If I add it to the themes customiser extra CSS, it still doesn't work. I thought it may be cache, but this CSS will work for hover as it does now. 

I tried replacing the CSS with

    #{wrap} #{menu} li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link {
    background: #3a6186; /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #89253e, #3a6186); /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #89253e, #3a6186); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    } `

    Still wouldn’t work.. am not sure why the hover settings are available in the MMM theme menu but the items aren’t?

    Last ditch attempt, I tried adding the code to remove any residual styling from Generatepress. Same result, and cleared cache as well. Although can’t be cache as changing hover CSS works fine without clearing cache.

    • This reply was modified 5 years, 10 months ago by Audiomonk.
    Thread Starter Audiomonk

    (@audiomonk)

    5 years, 10 months ago

    I seem to have worked out how to fix it, there’s a setting for whether the CSS gets written to the <head> or as a file. I selected file and it now has the styling I need. It is still leaving those down arrows from the menu behind after using the menu though.

    You use the menu, and when it clears or you move down the screen the down arrows that are normally part of the menu get left behind when the menu “sticks to top” . Sticking to top is what I want, but would like to get rid of those arrows.

    Plugin Author megamenu

    (@megamenu)

    5 years, 10 months ago

    Hi audiomonk,

    I’ve checked the site for the arrows but I’m not seeing them. Please could you post a screenshot (or ideally a screencast) showing where I need to look?

    Regards,
    Tom

    Thread Starter Audiomonk

    (@audiomonk)

    5 years, 10 months ago

    Hi.. I’ve been experimenting a bit more today, they seem to have gone now. I think it might have been a caching issue. Still not sure why the gradients work when the CSS is a file, but not when the CSS is in the head.

    Plugin Author megamenu

    (@megamenu)

    5 years, 10 months ago

    Hi audiomonk,

    Still not sure why the gradients work when the CSS is a file, but not when the CSS is in the head.

    I’m not sure why that would be either. If you switch it back to Output in Head I could take a look (although output to file is the better option, as your browser can cache that file).

    Regards,
    Tom

    Thread Starter Audiomonk

    (@audiomonk)

    5 years, 10 months ago

    You’re right Tom, it is the better option. Probably has something to do with the optimisations I have going in various places (litespeed) etc.

    I’ll close this one off, but if you can, can you please take a look at my new post about why some of the top menu items aren’t showing on the menu. Only seems to apply to FF quantum so far, but it might be others. Desperate for a solution.

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

The topic ‘Almost working please help’ is closed to new replies.