Split: Wrong color in menu and links

  • Author
    Posts
  • #152692

    lefoududroit
    Member

    Thank you for the quick answer. I tried both CSS, but the first one for changing links color doesn’t work for me.
    The second one works very well, thank you !

    The newsletter button works as well.

    #152699

    razvanonofrei
    Theme Author

    I split the topic so I could deal with each of you on a separate thread. But the reason for CSS not working was the same for both of you. Please try this snippet:

    /* Change links background color */
    .single .entry-content a:not([class*=wp-block]):not(.img-link), 
    .page .entry-content a:not([class*=wp-block]):not(.img-link) {
        background-color: transparent;
        background-image: linear-gradient(180deg,transparent 0%,#f92e2e 0%,#f92e2e 100%,transparent 100%);
    }

    You can also change the background color of buttons with this snippet:

    /* Change buttons background color */
    input[type=submit], 
    button {
        background-color: transparent;
        background-image: linear-gradient(180deg,transparent 0%,#f92e2e 0%,#f92e2e 100%,transparent 100%);
    }

    Hope this helps. Cheers!

    #152700

    lefoududroit
    Member

    /* Change links background color */
    .single .entry-content a:not([class*=wp-block]):not(.img-link),
    .page .entry-content a:not([class*=wp-block]):not(.img-link) {
    background-color: transparent;
    background-image: linear-gradient(180deg,transparent 0%,#ff6c00 0%,#ff6c00 100%,transparent 100%);
    }

    this does not work for me, it just adds orange background and the link is still written in yellow :/

    #152701

    lefoududroit
    Member

    Thank you but it still doesn’t work. The text is yellow

    #152704

    razvanonofrei
    Theme Author

    Hey lefoududroit,

    While debugging your website though the developer tools of my browser things seem to work just fine.

    Could you please add the CSS above, and make a screenshot or let me know somehow which text turns yellow because I can’t really understand what you’re talking about. Then I can check out your website and give you a solution to the problem.

    #152706

    lefoududroit
    Member

    Thank you, now it works !

    I just have a last question. The picture on this page https://lefoududroit.com/juridique/game-of-thrones-realisme-ou-pure-fiction/

    is aligned too far on the left, how can I change this ?

    And the legends under pictures are aligned left, before the update it was centered

    #152707

    razvanonofrei
    Theme Author

    Changes related to aligning the cover block should be live soon.

    Regarding the legends, I cannot trace the moment when they were changed to be left-aligned. I will add this to our issue tracker to go through all captions’ alignment and fix any issue we find. This is why I wouldn’t advise you using any custom CSS to alter it back to being centred.

    #152708

    lefoududroit
    Member

    okay thanks alot !!

    #152709

    darnaoudova
    Member

    Hi,
    Great advice, almost all my changing links/buttons colour questions were answered except for – my menu buttons seems to be split in two colours – the default one and the custom one. Could you advise?
    Thank you in advance!

    #152710

    darnaoudova
    Member

    Screenshot here, thank you https://imgur.com/a/BE7Bruo

    #152711

    razvanonofrei
    Theme Author

    darnaoudova, your menu items have a background-color when they shouldn’t. It’s probably the 2nd line in your Additional CSS where you should have

    background-color: transparent;
    background-image: linear-gradient(180deg,transparent 0%,#ed4547 0%,#ed4547 100%,transparent 100%);

    Also the two HEX values in the background-image property should match. It should be #ed4547 instead of #f7e1e1

    Cheers

    #152713

    darnaoudova
    Member

    Hi again razvanonofrei! Thank you for the quick answer. I got your point and changed it accordingly but unfortunately it does not change colour, screenshot here: https://imgur.com/a/BE7Bruo

    #152811

    razvanonofrei
    Theme Author

    Hey darnaoudova,

    I’ll tell you things I can see in this screenshot https://i.imgur.com/yBnYBog.png

    Your CSS selectors are duplicated. Lines 1 to 4 should be deleted, and the background-image at line 9 should be fixed as described above. However, these selectors are related to links inside the content.

    For changing background color for links inside the main menu you should use something like this:

    .jetpack_subscription_widget input[type="submit"], .widget_blog_subscription input[type="submit"], .sidebar .widget a:hover, .grid__item .entry-content a, .page-links a, .smart-link, .single .entry-content a, .page .entry-content a, .edit-link a, .author-info__link, .comments_add-comment, .comment .comment-reply-title a, :first-child:not(input)~.form-submit #submit, div#infinite-handle span, .sidebar a:hover, .nav--main li[class*="current-menu"]>a, .nav--main li:hover>a {
    background-color: transparent;
    background-image: linear-gradient(180deg,transparent 0%,#ff6c00 0%,#ff6c00 100%,transparent 100%);
    }

    Best regards

The topic ‘Split: Wrong color in menu and links’ is closed to new replies.