Need help? Check out our Support site, then


Sunspot Theme won't change font color

  1. On http://wordpress.juneind.com (Sunspot Theme), I cannot change the color of the text on my search widget, inside the boxes of my contact forms (or anything on the submit button), or the color of the links on my Twitter widget.

    I have the Custom Design Upgrade & have looked through the CSS on Safari with little luck. I'm pretty new to it, though. Also, my customize CSS tab doesn't have a link to the original CSS.

    Any help would be greatly appreciated!!

    The blog I need help with is juneind.com.

  2. Howdy,

    you can change your input area with following css:

    input[type="text"], input[type="email"], input[type="password"], textarea {
      background: none repeat scroll 0 0 rgb(24, 21, 20);
      border: 1px solid rgb(57, 55, 54);
      box-shadow: 2px 2px rgba(0, 0, 0, 0.2);
      color: rgb(161, 141, 117);
    }

    the font color is simply "color: rgb()" in the above snippet
    while the rest of the code are the background properties
    of the input box. for you twitter widget please refer to this article

    Kind rgrds

  3. AWESOME. Thanks! The submit button & input text on my contact form at http://juneind.com/booking/ are still not conforming to this. When the text area is filled, it does.

    Did I do something wrong?

  4. I also just noticed that the text color on the left-side menu (when you're on a particular page) doesn't conform to my black/white/gray palette either.

  5. My bad, when your text box is active -it gets a tiny class mod.
    Add this snippet below previous code, I changed the color value
    to white already:

    input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, textarea:focus {
      color: #FFFFFF;
    }

    As for the submit button, this is what you probably want to change:

    button, html input[type="button"], input[type="reset"], input[type="submit"] {
      background: -moz-linear-gradient(center top , #B94F25 0%, #B73A09 100%, #7DB9E8 100%) repeat scroll 0 0 transparent;
      color: #222222;
    }
    
    button:hover, html input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {
      background: -moz-linear-gradient(center top , #B7471B 0%, #B53000 100%) repeat scroll 0 0 transparent;
    }

    cheers~

  6. AWESOME AGAIN! Double thanks!! I owe you at least two rounds now if you're ever around Lafayette, Indiana. And over 21, of course... :-)

    The only issue I have now is with the menu text on the left side. On the home page, the text is white like it should be. When you go to any of the test pages, those particular links change back to being that pesky tan color.

  7. It's a little reminder of where your visitors
    are on your site. I don't mind the color, to be honest.
    But if you are that bothered then I think this bit is what you want:

    .main-navigation .current-menu-item > a {
      color: #BFAA91;
    }

    Taking your words on the rounds if ever ;)

    greetz-

Topic Closed

This topic has been closed to new replies.

About this Topic