• Resolved semaystudio

    (@semaystudio)


    How can I change the “send” background color from orange to black in CSS?

Viewing 15 replies - 1 through 15 (of 19 total)
  • elchavodel8

    (@elchavodel8)

    Search your theme css. Open with editor and search: background: linear-gradient(to left, rgba(0,0,0,.3), rgba(0,0,0,.0) 50%, rgba(0,0,0,.3)), linear-gradient(#d77d31, #fe8417, #d77d31);

    Thread Starter semaystudio

    (@semaystudio)

    I don’t see any “to left” to apply this to. Here is what my editor reads. Can you guide me here? Thanks!

    /* Form fields, general styles first. */
    button,
    input,
    textarea {
    border: 2px solid #d4d0ba;
    font-family: inherit;
    padding: 5px;
    }
    
    input,
    textarea {
    color: #141412;
    }
    
    input:focus,
    textarea:focus {
    border: 2px solid #c3c0ab;
    outline: 0;
    }
    
    /* Buttons */
    button,
    input[type=”submit”],
    input[type=”button”],
    input[type=”reset”] {
    background: #e05d22; /* Old browsers */
    background: -webkit-linear-gradient(top, #e05d22 0%, #d94412 100%); /* Chrome 10+, Safari 5.1+ */
    background: linear-gradient(to bottom, #e05d22 0%, #d94412 100%); /* W3C */
    border: none;
    border-bottom: 3px solid #b93207;
    border-radius: 2px;
    color: #fff;
    display: inline-block;
    padding: 11px 24px 10px;
    text-decoration: none;
    }
    
    button:hover,
    button:focus,
    input[type=”submit”]:hover,
    input[type=”button”]:hover,
    input[type=”reset”]:hover,
    input[type=”submit”]:focus,
    input[type=”button”]:focus,
    input[type=”reset”]:focus {
    background: #ed6a31; /* Old browsers */
    background: -webkit-linear-gradient(top, #ed6a31 0%, #e55627 100%); /* Chrome 10+, Safari 5.1+ */
    background: linear-gradient(to bottom, #ed6a31 0%, #e55627 100%); /* W3C */
    outline: none;
    }
    
    button:active,
    input[type=”submit”]:active,
    input[type=”button”]:active,
    input[type=”reset”]:active {
    background: #d94412; /* Old browsers */
    background: -webkit-linear-gradient(top, #d94412 0%, #e05d22 100%); /* Chrome 10+, Safari 5.1+ */
    background: linear-gradient(to bottom, #d94412 0%, #e05d22 100%); /* W3C */
    border: none;
    border-top: 3px solid #b93207;
    padding: 10px 24px 11px;

    [Moderator note: code fixed. Please wrap code in the backtick character or use the code button.]

    • This reply was modified 8 years ago by bdbrown.
    elchavodel8

    (@elchavodel8)

    Do you want to change the color or do you want to add a background image?
    Is that code the button?
    You know the color is? example: #xxxxxx

    Thread Starter semaystudio

    (@semaystudio)

    I’d like to change the background color of the button. The button should be black and the text should be white.

    Maybe I’m looking in the wrong place?

    elchavodel8

    (@elchavodel8)

    Tell me what your theme is called and where to download, I’ll install and search.

    Thread Starter semaystudio

    (@semaystudio)

    I’m using a Twenty Thirteen Child Theme. Thank you.

    Thread Starter semaystudio

    (@semaystudio)

    Any luck?

    elchavodel8

    (@elchavodel8)

    Child Theme?

    elchavodel8

    (@elchavodel8)

    Look for this

    you site\wp-content\themes\twentythirteen\style.css

    Is the same code that you uploaded, the one up.
    Change the following color: #e05d22,#d94412 for: #000

    Resultado:

    /* Buttons */
    button,
    input[type=”submit”],
    input[type=”button”],
    input[type=”reset”] {
    background: #000; /* Old browsers */
    background: -webkit-linear-gradient(top, #000 0%, #000 100%); /* Chrome 10+, Safari 5.1+ */
    background: linear-gradient(to bottom, #000 0%, #000 100%); /* W3C */
    border: none;
    border-bottom: 3px solid #b93207;
    border-radius: 2px;
    color: #fff;
    display: inline-block;
    padding: 11px 24px 10px;
    text-decoration: none;
    }

    [Moderator note: code fixed. Please wrap code in the backtick character or use the code button.]

    • This reply was modified 8 years ago by bdbrown.
    elchavodel8

    (@elchavodel8)

    You can also change the color border:
    border-bottom: 3px solid #b93207; ??

    Thread Starter semaystudio

    (@semaystudio)

    Awesome thank you! This worked!

    Would you by chance be able to answer another formatting question? It’s CSS or php specific. I can’t figure out how to increase my catalog images in size in my shop, while keeping 4 images per row on my desktop and 2 images per row on my mobile. If you’re able to answer this I’ll disable my maintenance page after a reply.

    Thank you!

    elchavodel8

    (@elchavodel8)

    I need to know which catalog plugin you are using.
    you site? semaystudio.com

    Thread Starter semaystudio

    (@semaystudio)

    WooCommerce! For https://www.semaystudio.com

    Thread Starter semaystudio

    (@semaystudio)

    Also, my MailChimp embedded signup form on my FOOTER has green text saying “thank you for signing up” once somebody does. Do you know how I can turn this to white text instead of green?
    I’ve reached out to MailChimp, but they said its coding specific with WordPress.

    elchavodel8

    (@elchavodel8)

    I’ll make you a video tutorial to learn.

Viewing 15 replies - 1 through 15 (of 19 total)
  • The topic ‘Change Button Color’ is closed to new replies.