Jump to content

Edit Color of "NEW" Tag on New Arrivals - Where?


Recommended Posts

I thought I found where to change the light blue color of the NEW tag/banner that is placed on new arrivals, but when I changed it to red it didn't change on the site.

 

I had made this change in themes>my_theme>css>modules>blocknewproducts>blocknewproducts.css.  I looked around in the sheet and found a code for a light blue color that matches that tag but I couldn't see any changes after I changed it to red.  I refreshed a few times but that didn't help.  I put that color back the way it was and then I looked in the .tpl but there's nothing there to change. Where do I go to edit the color?

 

And I did do a search for this topic but came up blank.

Edited by Copernican Theory (see edit history)
Link to comment
Share on other sites

It's the .new-label class in themes/default-bootstrap/css/global.css:

 

.new-label {
  font: 700 14px/12px Arial, Helvetica, sans-serif;
  color: #fff;
  background: #6ad4ff;
  text-transform: uppercase;
  padding: 9px 0 7px;
  text-shadow: 1px 1px rgba(0, 0, 0, 0.24);
  width: 130px;
  text-align: center;
  display: block;
  position: absolute;
  left: -33px;
  top: 16px;
  z-index: 1;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg); }
  .new-label:before {
    position: absolute;
    bottom: -3px;
    right: 5px;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 4px 4px 0px 4px;
    border-color: #21a3d8 transparent transparent transparent;
    content: ".";
    text-indent: -5000px;
    -webkit-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg); }
  .new-label:after {
    position: absolute;
    bottom: -3px;
    left: 3px;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 4px 4px 0px 4px;
    border-color: #21a3d8 transparent transparent transparent;
    content: ".";
    text-indent: -5000px;
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg); }
 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...