Need a small bit of help here...

[SpringDay.com]

In the top search bar of the default Prestashop theme there is a color behind the "search" button. The corner pixels are transparent on the button and the hex color #E0DFE3 shows through from the field behind. The hex color #E0DFE3 is not referenced in the global.css file anywhere. Furthermore, I cannot find where it is hard coded in Prestashop. Of course, this is not a problem if you are simply using the default Prestashop theme in grays. However, if the button image is changed to something with more transparencies or a different color scheme this light gray color stands out like a sore thumb.

Can somebody please tell me where #E0DFE3 is coded in Prestashop?

Here is an image to clarify:

[p1r4t0s]

try change color directly in the button search image using photoshop or other.

[SpringDay.com]

That same button graphic is used in other places. Some with light and some with dark backgrounds. My graphic needs to be transparent.

[prestabase]

The global css is showing the search box button style as input.button. Checkout this tool for firefox to help locate where the styles are located in css - http://chrispederick.com/work/web-developer/

[prestabase]

Indeed, it is an image - see below

-------------------------
input.button, input.button_disabled, input.exclusive, input.exclusive_disabled, a.button, a.exclusive, span.button, span.exclusive {
width: 120px;
background-image: url('../img/button-medium.gif');
-------------------------

Edit that in photoshop and you'll be good to go.

[prestabase]

See - http://www.prestabase.com/store/prestashop/ . All I did was adjust the hue/saturation in photoshop.

[SpringDay.com]

Yeah, that's all well and good, but you didn't address the real problem. You changed the button color, but the background of #E0DFE3 is STILL THERE and it does not show up on any .CSS formatting. See first image.

Now, I want to change the image ENTIRELY. Using a .png with varying transparencies. See the second image.

Yes, I understand that I could edit the graphic to match the background for the top search. However, this would also change the occurrences of this same image when used on a different background. The whole point of transparencies in a graphic is versatility and saving page load with reusable images.

WHERE IS THIS #E0DFE3?

[prestabase]

I don't believe #E0DFE3 is anywhere, it's just an image for that button, or else it would show in the css. See - http://www.prestabase.com/store/prestashop/ , I simply made the image transparent. If you were right, even with a transparent image, the #E0DFE3 would still show as a border.

If I'm off, I guess I don't know what you're talking about.

[SpringDay.com]

I appreciate your help here. Your completely transparent image displays the problem perfectly. If it were just a transparent image over the background you would not see the box where the transparent image is.

You see that exact same button is used in your featured items as the "View" button and in your Specials module box as the "All specials" button. In those two places there has been no hard coding done to the background. That is because the CSS coding for this image when it appears here is:

   background-image: url('../img/button-medium.png');

The search button has the added property of background color somewhere. If it were css it would look like this:

   background-image: #e0dfe3 url('../img/button-medium.png');

Somewhere in the code, NOT IN THE CSS, the field for the placement of the top search button is hard coded with a background of #E0DFE3. Use your Photoshop color selector and see for yourself. I am just trying to find out where exactly, that this has been done so it can be fixed.

For some reason the forum won't let me post another image here but you can see it in your link: http://www.prestabase.com/store/prestashop/

[SpringDay.com]

Okay,

I got around this problem by creating a whole new class in global.css just for the top search button. Which also means I will have to include a modified blocksearch-header.tpl file for the modules>blocksearch module with the template package.

The problem with this is that switching themes via the backend will be more than just a simple "click and save" unless the new css variable is added to every theme. This guarantees that some folks will have problems with my new theme.

Better solution is to find where this background color is hard coded and remove it from all future releases. Or, even better yet, have ALL template and css formatting originate in the theme directory.

I am still interested if anyone can tell me where the #E0DFE3 background is coded.

Thanks,

[Red23]

Hi,

I found a solution to your problem. There is an image behind the Search box, it is called block_search_bg.jpg, and it is in the themes-->prestashop--img folder. If you change the name of the image to anything...lets say block_search_bg2.jpg...then the browser will not be able to locate the image, and then display nothing behind the search box,

REd

[San Diego]

hi

you can´t create a bug to fix your outfit
if you point on a file which does not exist that is a bug or wrong codeing
simply set background to transparent
no borders

sd

[qasrani]

Every box has three images and one color on the background. Header image, background image and footer image along with a color on background. All these images are given a bit of rounded corners so they give better appearance. When you see a header, background or footer image in global.css file, there will be a background color also available in the same section. Try editing that or make your image with square corners. Remember, when you enlarge a very small area, color picking tool of Photoshop does not necessarily captures the right color. It can confuse with surrounding colors as enlarging of a very small part of image results in confusion