Opened 8 years ago

Closed 8 years ago

#6981 closed bug (fixed)

http://www.haiku-os.org/gallery is cutting off pictures

Reported by: jscipione Owned by: haiku-web
Priority: normal Milestone: R1
Component: Website/CMS Version: R1/Development
Keywords: website gallery Cc:
Blocked By: Blocking:
Has a Patch: no Platform: All

Description

The Haiku image gallery page found here

http://www.haiku-os.org/gallery

is cutting off the right side of the thumbnails and the pictures themselves. Either the size of the webpage needs to be increased or the size of the pictures (and the number of columns of thumbnails) needs to be decreased

Attachments (2)

Screen shot 2010-12-14 at 6.12.50 PM.png (344.7 KB) - added by jscipione 8 years ago.
Screenshot demonstrating the problem
Screen shot 2010-12-15 at 12.04.03 PM.png (277.1 KB) - added by jscipione 8 years ago.
Screenshow showing the enlarged picture overlapping the side sorry so small but ran into upload file size limit

Download all attachments as: .zip

Change History (11)

Changed 8 years ago by jscipione

Screenshot demonstrating the problem

comment:1 Changed 8 years ago by kallisti5

I went ahead and added " width: 100% " to the picasaweb div. The gallery images are now within the allocated space. To be honest this is due to a bug in Jorge's template (the content div doesn't prevent things from overflowing)

Check it out and let me know...

Thanks!

Changed 8 years ago by jscipione

Screenshow showing the enlarged picture overlapping the side sorry so small but ran into upload file size limit

comment:2 Changed 8 years ago by jscipione

Almost fixed, I attached a screenshot showing that the right hand side of the enlarged pictures overlap out of their container frame. If you can set a maximum width for the images that should fix the problem. Interestingly it seems that all of the photos in the gallery are cropped to the same size consequently they all overflow by the same amount.

Last edited 8 years ago by jscipione (previous) (diff)

comment:3 Changed 8 years ago by jstressman

On the main gallery page, remove the "width: 190px;" "#picasaweb #picasa_album a span.title" and "#picasaweb #picasa_album span.date"

Change "#picasaweb #picasa_album a img" to "margin: 15px auto 5px;" and remove "float: left;" from it.

Change "#picasaweb #picasa_album" to "width: 220px;"

This extends the gallery to fit the width of the page, and centers all the images and their tags.

On the sub gallery pages, change "#picasaweb #picasa_photo" to "width: 200px;" and remove the "width: 170px;" from "#picasaweb #picasa_photo a p"

On the individual image page, change "#picasaweb #picasa_picture img" to "width: 100%;" along the lines of what kallisti5 did for the main picasaweb div, and the image snugly fits inside the space it's supposed to.

(There may be a more programmatical way to do this so that the gallery could adjust to fit different widths better, but this fixes it for our current theme.)

comment:4 Changed 8 years ago by kallisti5

Resolution: fixed
Status: newclosed

i fixed this a while back, only 3 columns of gallery items now.

comment:5 Changed 8 years ago by jscipione

While the columns are fixed, the enlarged picture is still overlapping its frame so there is still a bug here.

comment:6 Changed 8 years ago by jstressman

jscipione: I included the fix for that in the fixes I gave, as well as a more thorough fix for the other problem etc.

If kallisti5 will just take into account what you and I are actually saying and the fixes I gave (that include the fix for the secondary problem we both mentioned), then this could be fixed for real.

comment:7 Changed 8 years ago by kallisti5

Resolution: fixed
Status: closedreopened

working on it now.

jstressman's solution not a valid solution leaving the web browser to resize an image is bad form and will make it look very poor. (scale is lost,etc) The trac has been re-opened and I am working on fixing it through the picasa web api

In the mean time, feel free to look at the images in Picasa: https://picasaweb.google.com/haiku.inc/

Last edited 8 years ago by kallisti5 (previous) (diff)

comment:8 Changed 8 years ago by kallisti5

resolved. even added a lightbox. get off my bum :)

comment:9 Changed 8 years ago by kallisti5

Resolution: fixed
Status: reopenedclosed
Note: See TracTickets for help on using tickets.