X-Cart forums

[Ridgeway1]

I would like to change the font color in the "Categories" box. Can someone tell me how to do this?

I also need to do the same thing for the prices throughout the site. We don't want Red, we want a Brown/tan Thanks.

[totaltec]

Ridgeway,
With CSS changes like this, it is easier to make suggestions based on your actual site. We don;t know exactly what your setup is, what template you are using, etc. Even if we did, the time it would take to replicate all of that so that we could see your exact end result would be ridiculous.

If you can provide a link to the page in question it would help immensely.

[razortw]

Hello.
Please let us know what template you use for your store, only knowing that I will be able to help you with this.
Or provide us with the link to your site.
Thanks.

[Ridgeway1]

Hi,

Thanks for your reply. Here is the link to the site I'm creating: http://www.ridgewaycompany.com/xcart/ ,

I want the "Red" prices to be a tan color. I also want the top of the "Sale" box to be a gradient like the "New Arrivals" box.

The "Template" used is "Noblesse".

Any help would be appreciated.

Current CSS:

/**
* Top menu main block styling
*/
.navbar-inverse {
background-color: #58443a;
border-color: #58443a;
}

.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
color: #efe9e2;
background-color: #58443a;
}

.navbar-inverse .navbar-nav > .active > a,
.navbar-inverse .navbar-nav > .active > a:hover,
.navbar-inverse .navbar-nav > .active > a:focus {
color: #efe9e2;
background-color: #58443a;
}
}

/**
* Main blocks of the sidebar (Top categories, Sale, New arrivals Recently viewed and so on)
*/
.sidebar div.block {
padding: 0px;
border-color: #9c8167;
border-width: 2px;
}

/**
* Header of the main blocks in the sidebar
*/
.sidebar .block .head-h2 {
padding: 14px 20px 14px 20px;
margin: 0px;
border-color: #9c8167;
border-radius: 5px;
color: #000000;

}

/**
* Content of the main blocks in the sidebar
*/
.sidebar div.block div.content {
padding: 0px 20px 20px 20px;
border-radius: 5px;
}

/**
* Styles for the links inside the main blocks of the sidebar
*/
.sidebar ul.menu a {
border-top: 1px solid #efe9e2;
}

/**
* Specific styles for the Top categories block in the side bar
*/
.sidebar div.block.block-product-filter div.content {
padding: 0px 10px 20px 10px;

}

/**
* Specific styles for the Top categories block in the side bar
*/
.sidebar .block.block-top-categories .head-h2 {
background: #efe9e2;
}

.sidebar div.block.block-top-categories div.content {
background: #efe9e2;
}

.sidebar div.block.block-top-categories div.content a {
color: #4c5c80;
}

/**
* Header for specific side-bar box ("New arrivals" products)
*/
.sidebar .block.block-new-arrivals .head-h2 {
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
background: #efe9e2;
background: -moz-linear-gradient(top, #efe9e2 0%, #d0c2b1 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efe9e2), color-stop(100%,#d0c2b1));
background: -webkit-linear-gradient(top, #efe9e2 0%,#d0c2b1 100%);
background: -o-linear-gradient(top, #efe9e2 0%,#d0c2b1 100%);
background: -ms-linear-gradient(top, #efe9e2 0%,#ed0c2b1 100%);
background: linear-gradient(to bottom, #efe9e2 0%,#d0c2b1 100%);
filter: progidXImageTransform.Microsoft.gradient( startColorstr='#efe9e2', endColorstr='#d0c2b1',GradientType=0 );
}

/**
* Price info block in the "New arrivals" product list in the side-bar box
*/
.sidebar .block.block-new-arrivals div.product-price {
margin-top: 10px;
}

/**
* Price info text in the "New arrivals" product list in the side-bar box
*/
.sidebar .block.block-new-arrivals .products-sidebar-small-thumbnails span.product-price {
font-size: 26px;
}

/**
* The last product element block in the New arrivals list
*/
.sidebar .block.block-new-arrivals ul.products-sidebar li.last {
padding-bottom: 10px;
}

/**
* The last element block in the New arrivals list (There is a link "All new products")
*/
.sidebar .block.block-new-arrivals ul.products-sidebar li:last-child {
padding-bottom: 10px;
}

body, div, td, tr, th, tbody, h1, h2, h3, h4, h5 ul, li, a, p, span {
font-family: Times New Roman !important;
}

[totaltec]

Looks like you need to modify

.products span.product-price {
    color: #d0061e;
}

Just try adding that to the bottom of your custom CSS, and editing the hex code for the color.

[Ridgeway1]

I still need help with this:

I also want the top of the "Sale" & "Recently Viewed" boxes to be a gradient like the "New Arrivals" box.

Info:

http://www.ridgewaycompany.com/xcart/

The "Template" used is "Noblesse".

Please help.

Thanks

[totaltec]

Try adding this below the definition above:

.sidebar .block.block-recently-viewed .head-h2,
.sidebar .block.block-sale-products .head-h2 {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    background: #efe9e2;
    background: -moz-linear-gradient(top, #efe9e2 0%, #d0c2b1 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efe9e2), color-stop(100%,#d0c2b1));
    background: -webkit-linear-gradient(top, #efe9e2 0%,#d0c2b1 100%);
    background: -o-linear-gradient(top, #efe9e2 0%,#d0c2b1 100%);
    background: -ms-linear-gradient(top, #efe9e2 0%,#ed0c2b1 100%);
    background: linear-gradient(to bottom, #efe9e2 0%,#d0c2b1 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efe9e2', endColorstr='#d0c2b1',GradientType=0 );
}

[Ridgeway1]

Thank you so much! I think I am good to go now. Have a great rest of the week!