title/captions in lightbox

phaserbeamphaserbeam Registered Users Posts: 452 Major grins
edited September 18, 2013 in Bug Reporting
The box for title/captions has a different size in lightbox when logged in/out. When logged in it overlaps with the toolbox.

This happens when you open lightbox from inside a MultiplePhotos content block only. Works well from inside of a gallery.
Here is a page with a MultiplePhotos/RecentPhotos content block for testing.

Comments

  • bobbyherobobbyhero Registered Users Posts: 207 Major grins
    edited September 14, 2013
    As the owner you have more options when logged-in (share, etc), which is why there is a slight discrepancy. The width is adjusted to account for those buttons.
  • phaserbeamphaserbeam Registered Users Posts: 452 Major grins
    edited September 14, 2013
    bobbyhero wrote: »
    As the owner you have more options when logged-in (share, etc), which is why there is a slight discrepancy. The width is adjusted to account for those buttons.

    Yes... i know that, but as you can see the area for captions overlapps with the toolbox. When logged in there are three more tool-icons and the owner-buy icon but the overlapping area is only half of that.

    I was trying to check if large captions would overlap with the toolbox but they do not use the complete space. As you can see the width of the captions box changed after i used TOOLS > EDIT > PHOTODETAILS.

    This is only for logged in users... when logged off or when viewing others sites you may not notice that. Not a high priority issue but some odd ui thing...
  • phaserbeamphaserbeam Registered Users Posts: 452 Major grins
    edited September 15, 2013
    Here is another screenshot that shows the problem if logged in. Even the scrollbar overlaps with the toolbox when logged in. If not logged in everything is fine. Sample can be found here.

    Note: You cannot use the scroll bar of the captions box when logged in. If you move the mouse towards the scroll bar the captions box will disappear as soon as the mouse reaches the x-koordinate of the toolbox-icons. So the displayed width of the captions-box seem to be calculated wrong.

    Since a video says more then 1000 words... click here. Have a look to the lower right corner of the video. When the mouse reaches the tool icons the captions box disappears before you can use the scroll bar.
  • leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited September 18, 2013
    I found that there were 2 issues with the way captions were displayed in the lightbox. They're seen both in your image above.

    1) First, notice how the caption is squished into the left side of the sliding box. That seems weird to me. I wanted it wider
    2) The scroll bar is really far to the right and it looks awful (and as you mentioned, makes it so you can't get to the scroll bar).

    I did some CSS to fix both issues:
    /* Make the width of the lightbox caption wider (fixes issue #1) */
    .sm-user-ui .sm-lightbox-caption {
      max-width: 1000px !important;
    }
    
    /* SmugMug had the lightbox caption area really wide but the text in it much
       skinner. The scroll bar was very far away. Bring it in to match 
       the width of the lightbox caption (fixes issue #2) */
    .sm-user-ui .sm-lightbox-panel {
      max-width: 1010px !important;
    }
    

    Ends up looking like this:
    SM_ss.jpg
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • phaserbeamphaserbeam Registered Users Posts: 452 Major grins
    edited September 18, 2013
    leftquark wrote: »
    I did some CSS to fix both issues:

    Thx... i'll give it a try... on a first test it did not fix issue #1.

    I think i figured out why it overlaps with the panel icons. Currently site is loading very slow and i noticed that the captions box fits perfect between the panel icons until the OWNERBUY button appears on the screen. I copied two screenshots into one, see image below.

    From the HTML-code before the OWNERBUY button is there:
    <div class="sm-lightbox-ft-center sm-lightbox-panel sm-lightbox-panel-scrollable" style="right: 576px; height: 93px;" id="yui_3_8_0_1_1379526438749_1297">
    

    style="right: 576px; height: 93px;"

    If the OWNERBUY button is there and when i got to full-screen with F11 and back to window-mode with F11 again the code looks like this:
    <div class="sm-lightbox-ft-center sm-lightbox-panel sm-lightbox-panel-scrollable" style="height: 93px; right: 669px;" id="yui_3_8_0_1_1379526438749_1297">
    

    style="height: 93px; right: 669px;"

    The right-value in the style-code has changed... looks like the "hard-coded" right-value is first calculated with the wrong width of the panel (without the OWNERBUY button) and if the OWNERBUY button is there the panel overlaps with the captions box/scroll bar.

    I do not need to go fullscreen... resizing the browser window for only 1px updates the style code also and the captionsbox is displayed with the correct width.

    This does only happen from MULTIPLE PHOTOS content block, not from inside of a gallery... and only when logged in.
Sign In or Register to comment.