"Lightbox Exit Button - No X"

brandofamily

I added the "Lightbox Exit Button - No X" code to my site... example below. I also tweaked it to change the full screen icon to text. My question is how do I make those "buttons" smaller... less padding? I cannot figure out where in the code the padding is set.

http://www.brandolinoimaging.com/Image-Galleries/European-Tours/European-Tour-2008/Oberammergau-Germany-Wood/i-4dzn4Zw/A

I figured out how to adjust the height of the button, but the text is off center (top to bottom) if I lessen the height....

leftquark

brandofamily wrote: »

I added the "Lightbox Exit Button - No X" code to my site... example below. I also tweaked it to change the full screen icon to text. My question is how do I make those "buttons" smaller... less padding? I cannot figure out where in the code the padding is set.

http://www.brandolinoimaging.com/Image-Galleries/European-Tours/European-Tour-2008/Oberammergau-Germany-Wood/i-4dzn4Zw/A

I figured out how to adjust the height of the button, but the text is off center (top to bottom) if I lessen the height....

The height of the button is controlled here:

.sm-button-size-large.sm-button-nochrome {
  line-height: 80px;
}

I couldn't figure out the padding either but I did shrink the height to 20 and it stayed centered. It may appear not centered because the "y" in "Gallery" hangs down, but that's how the font works. Everything else is centered. If you moved the text up a couple pixels it would look off-center. Looks centered to me when I use the above code and change 80px to 20px.

brandofamily

leftquark wrote: »

The height of the button is controlled here:

.sm-button-size-large.sm-button-nochrome {
  line-height: 80px;
}

I couldn't figure out the padding either but I did shrink the height to 20 and it stayed centered. It may appear not centered because the "y" in "Gallery" hangs down, but that's how the font works. Everything else is centered. If you moved the text up a couple pixels it would look off-center. Looks centered to me when I use the above code and change 80px to 20px.

any idea if that code effects other buttons also? Sometimes I break one thing by fixing another.

leftquark

brandofamily wrote: »

any idea if that code effects other buttons also? Sometimes I break one thing by fixing another.

You could make it more specific just to be sure:

.sm-user-ui .sm-user-overlay-container .sm-lightbox-tools .sm-button-size-large.sm-button-nochrome {
  line-height: 80px;
}

brandofamily

leftquark wrote: »

You could make it more specific just to be sure:

.sm-user-ui .sm-user-overlay-container .sm-lightbox-tools .sm-button-size-large.sm-button-nochrome {
  line-height: 80px;
}

Thank you. With this new class system on NEW SM I still have not figured out how to be specific w/ the code the way I could in old SM.