Change masonry and spinner colors

  • Author
    Posts
  • #65115

    miamicopywriter

    How do I change the masonry hovers and the spinner from your green to my blue? My basic blue is #99cccc but I have darker and lighter versions of it too… Can you provide easy code for me to follow? I love this theme… I have it running on two sites and will probably put it on a third… there is just so much you can do with it!

    The blog I need help with is miamiwriter.com.

    #65243

    angelatcrist
    Member

    Hi there,

    Great question! Do you have the Custom Design Upgrade? This should allow you to choose the colors you want to change to.

    I believe the spinner is all CSS so it should change to whatever you choose as the primary color.

    Let me know and I will be happy to look into this further.
    Thanks,
    Angela

    #65245

    miamicopywriter

    Yes…. need both the masonry hovers and the spinner… I have most of the rest figured out

    #65246

    miamicopywriter

    Yes…. need both the masonry hovers and the spinner… I have most of the rest figured out

    #65278

    angelatcrist
    Member

    Hi there!

    Did you purchase the Custom Design Upgrade?

    When you choose the primary color it should change these items for you.

    Let me know if you have any other questions!
    Have a great weekend!
    Angela

    #65285

    miamicopywriter

    Yes, I have custom upgrade… that is how I have done all the css so far. I figured out how to change the masonry hover. I have changed everything except the spinner. I do not want to call an entire css sheet just to change the spinner to black… it should be black to begin with… please give me the code I need to do this…

    #65367

    angelatcrist
    Member

    Hi!

    Thanks so much for your patience!

    Here is the custom CSS required to change the spinner color. Replace COLOR_1 with the darker color that will be rotating around and replace COLOR_2 with the color to be used as the “background”.

    @include keyframes(loading) {
      0% {
        border-color: COLOR_2;
        border-top-color: COLOR_1;
      }
      25% {
        border-color: COLOR_2;
        border-right-color: COLOR_1;
      }
      50% {
        border-color: COLOR_2;
        border-bottom-color: COLOR_1;
      }
      75% {
        border-color: COLOR_2;
        border-left-color: COLOR_1;
      }
      100% {
        border-color: COLOR_2;
        border-top-color: COLOR_1;
      }
    }
    
    .spinner {
      border-color: COLOR_1;
    }

    Please let me know if you have any other questions!!
    Thanks,
    Angela

    #65439

    angelatcrist
    Member

    Hi,

    Just wanted to check in to make sure that worked for you.
    Let me know if you have any other questions!

    Happy last day of 2014!
    Angela

The topic ‘Change masonry and spinner colors’ is closed to new replies.