changing background color when

benjikan

1/ I would like to change the background color when the images are displayed individually. I would like a white background instead of white. can you suggest a css code customization for that?

2/ Some of the images get cropped when individually displayed.

Example: http://benjaminkanarek.com/archives/album/i-do.

Here below on my 27" screen it looks almost ok, but still chopped off the top of the head.


but not on my 13" laptop.


Thanks

Air

Hello:-)
1) Use this custom CSS:

#lightGallery-outer {
    background-color: #fff;
}

2) http://support.apollo13.eu/discussion/3429/top-of-images-cut-off-when-album-images-are-clicked-on#latest

With kind regards.

benjikan

Thanks fo the CSS. What I would like now, is to remove the grey band that goes across the page at the very top?

Air

Then read my answer again, cause I answered you this already.

With kind regards.

benjikan

Do you mean that I have to do so in each individual album??? Can't I do that in the general customization setting with a Css? I have 83 albums... Thanks.

Air

I don't know how many albums you have, I just tell you how to do it with theme options.

Try this custom CSS then:

.customHtml {
    display: none;
}

With kind regards.

benjikan

Thank you ! That is all I needed !! All the best.

benjikan

Hello,

Did you change the Gallery layout in the last version of the template? I really do not understand why, but suddenly,
- the background is black again in the gallery
- the back overlay band at the top is back on with a top menu (I do not want to allow the download),
- at the bottom, the thumbnails are distorted

I still have the the CSS code you gave me and it worked fine until recently.
.customHtml {
display: none;
}

#lightGallery-outer {
background-color: #fff;
}

Can you help me to fix that and come back to the version I had earlier. The image on white background and homothetic thumbnails, no download option?

http://benjaminkanarek.com/archives/album/wildest-dreams

Thanks

Air

Hello :-)

Yes, as can be seen in change log http://www.apollo13.eu/themes_update/photon/index.html We have updated whole script for lightbox, and added options for it. Update was required cause there where some issues with touch devices.

benjikan said: the background is black again in the gallery

Use this custom CSS:

.lg-backdrop {
    background-color: #fff;
}

benjikan said: the back overlay band at the top is back on with a top menu (I do not want to allow the download),

You have options for that Photon Advanced -> Miscellaneous settings -> lightGallery
Btw. I talked with other user about people screaming that they don't want download option :-P Here http://support.apollo13.eu/discussion/comment/14397/#Comment_14397

benjikan said: at the bottom, the thumbnails are distorted

Ooo I didn't notice that. This should help, and I will also add it to theme:

.lg-outer .lg-thumb-item img {
   height: auto;
    width: 100px;
}

I believe you can remove previous custom CSS for lightbox, but better test it.

With kind regards.

benjikan

Ahhh !! Now we are talking !! ;-) What would be even better is to be able to choose the color of the background of the thumbnail bar. + the contouring of each thumbnail. White contouring against black is a bit too overwhelming.

Thanks !!

Ben

benjikan

I don't understand why I have this grey bar coming on some lightbox albums and not on the one showed above ???

Air

benjikan said: What would be even better is to be able to choose the color of the background of the thumbnail bar. + the contouring of each thumbnail

That is good idea. I will add it with option to choose main lightbox background. For now please use:

/* background of the thumbnail bar */
.lg-outer .lg-thumb-outer {
    background-color: #fff;
}
/* border of thumbnails */
.lg-outer .lg-thumb-item {
    border-color: #000;
}

benjikan said: I don't understand why I have this grey bar coming on some lightbox

It looks that adding this custom CSS again will help(that why I said to test before removing old CSS):

.customHtml {
    display: none;
}

With kind regards.

benjikan

Thanks but I still have a grey bar at the bottom of the page showing with or without the thumbnail bar.

Air

OK I see now. Try this instead:

.lg-sub-html{
    display: none;
}

With kind regards.

benjikan

Perfect !! thanks