problem with images

littlecakemx · Member · Dec 7, 2016 at 3:25 pm
Copy link

Add topic to favorites
Hi, I hope somebody helps me. When I change the images, I upload my own images that work in Photoshop, the size is correct but when I put in the site, my images lose quality , the colors changes and the white is not white. I don´t how create solution for that.

The blog I need help with is: (visible only to logged in users)
littlecakemx · Member · Dec 7, 2016 at 3:27 pm
Copy link
The white has a little darkness
staff-loquaciousloon · Staff · Dec 8, 2016 at 10:13 pm
Copy link
Hi @littlecakemx!

Your site’s theme (Affinity) puts a filter over the images so that when text is displayed on top it doesn’t get washed out (if there were any white in the image).

You can remove that filter with some Custom CSS if you add a Premium Plan or Business Plan to your site.

Once you have access to your site’s CSS, this snippet should do the trick:
```
.custom-header-image,
.in-panel .custom-header-image {
   opacity: 1;
}
```
You would add that under My Site > Customize in the CSS section :)
kmp5268 · Member · Dec 9, 2016 at 12:59 am
Copy link
Hi staff-loquaciousloon,

I am having the same difficulty with my page (http://www.naturallifehr.com).

I have access to CSS and my base theme is Pique. I have a one-page site with multiple panels with featured images. My problem is that there is a “film” or “layer” as you previously mentioned that is being placed over the original image.

The problem here is that it doesn’t allow designers who are critical about how the final image looks the absolute control over their final published work.

I am looking to remove this layer. I tried using the above CSS code but it did not work for me. Could you possibly personalize it for my needs?

Thank you.
staff-loquaciousloon · Staff · Dec 9, 2016 at 1:46 pm
Copy link
Hey @naturallifehr!

Pique does use a similar filter, yes – and it will have it’s own CSS.

Try these two styles (one for the first panel, and another for the remaining panels:
```
.pique-panel-background {
  opacity: 1;
}

.pique-panel-background:before {
  display: none;
}
```
Let me know how that turns out :)
kmp5268 · Member · Dec 9, 2016 at 3:26 pm
Copy link
Hi staff-loquaciousloon,

That CSS code worked exactly as described. Thank you.
staff-loquaciousloon · Staff · Dec 12, 2016 at 4:47 pm
Copy link
You’re welcome!

No items found.