0

I'm trying to customize the Xcillion Home template. I just want a white background. I've added background: #fff to the body class, and that works fine, but there is a vertical gradient on both sides of the container div that go from #ffffff to #fefefe to #fdfdfd, all the way to #fafafa and it ends at the header div. When I change the background to any color but white, it looks fine. It's only when I change it to white that I see this gradient.

I've tried searching the template's skin.css and the bootstrap.css for these color values and for gradients using these values, but I can't figure it out. It's not very noticeable, but now that I saw it, I can't unsee it. It looks less dramatic in the image below but you can still see it.

Does anybody have any insight on where this gradient is being applied from?

enter image description here

UPDATE: I realized that the gradient is still there no matter the background color, it's just harder to see. I created a small square image and used it as a background image in the body class and repeated it. The gradient isn't on top of the color, it's applied to it. Still haven't been able to figure out from where. I also looked into the possibility of it being a thick border with a gradient, but no cigar. The part that really trips me out is that it is in the container's margin and padding (at least, that's how the Chrome tools highlight it).

quiqs
  • 108
  • 8

3 Answers3

1

Its because #TopHeader element have a box-shadow, try remove the box-shadow

enter image description here

erw13n
  • 474
  • 5
  • 12
0

Can't see your image, but it should be pretty easy to track down if you can find what element it's being applied to with the Chrome inspector. There is likely also additional skin-related CSS is /Portals/Default/Skins/Xcillion.

Chris B.
  • 5,477
  • 1
  • 12
  • 30
  • It's being applied in the margin of the container div that contains the header and content panes . I've gone through all the css files listed in the Sources tab of Chrome's DevTools. Couldn't find anything. – quiqs Sep 17 '19 at 20:37
  • It should list the source file right in the styles tab of the devtools next to the CSS selector. – Chris B. Sep 17 '19 at 20:37
  • I've looked at every css file listed in the Styles tab as well. Still nothing. – quiqs Sep 17 '19 at 20:40
0

This is in skin.css

body { background: #f0f0f0; color: #333; font-size: 13px }

Remove the background color.

There are also some borders you might want to remove, too.

Joe Craig
  • 1,244
  • 1
  • 7
  • 7
  • Removing background didn't work. Which borders might you be talking about? I've already looked for borders with gradients in all linked resource files. – quiqs Sep 19 '19 at 00:32