| Issue 25: | SAMPLE Customized look to center images inside submodal and rounded boxes. | |
| 1 person starred this issue and may be notified of changes. | Back to list |
This is modification of how images a placed inside the submodal or their own rounded box in the list to stay centered. It was made inside /app and /public and the admin interface was not touched. The size of small pictures was changed, to fit the rounded boxes of list view, and if smaller they are centered (so, they don't appear cropped any more). The submodal layout that shows the images was changed too to center them. The CSS is based on http://brunildo.org/test/img_center.html Tested on Firefox 2.0.0.11 (Linux), IE 6.0 (Inside Wine) and Opera 9.25 (Linux) Regards
Mar 13, 2008
Make sure that all previous patches have being incorporated, if you have already incorporated newer patches (as I did), ie the 'For Sale' and 'New' icons patch, you may overwrite by accident.
Mar 13, 2008
Hmm yes. This sample I made in /app as its a modification of the view that I don't have sure if anyone will want it, it could be done in substruct directly if people want, the patches I have done /vendor/plugins/substruct/app. Using this it breaks again the icons. I fixed other things in /vendor/... that are not here, maybe I upload it again updated.
Apr 9, 2008
Edmundo can I get an updated one to check it out? I haven't seen it yet, but with the "centering inside submodal" i'd ultimately like to add code to submodal that resizes based on the picture within. Sort of like lightbox does...
Apr 10, 2008
Its supposed to make better two things, centering images inside submodal windows (if you can make it autosize and center in the screen I think its a better approach, and you can preserve only part of the changes in these patch to be able to apply styles inside the submodal). And centering images inside its own area, this can be applied anywhere an image is being shown, images must have its size compatible with the area it will be placed (if bigger its cropped) or if smaller its centered in turn of laying in the corner. Some browsers (mozilla) make it very easy to do it, but this patch includes CSS hacks to work with IE (always IE :P) I will update it. In the mean time, you can check this out, the CSS code is not mine anyway, it was got from here. http://brunildo.org/test/img_center.html (The index with other samples) http://brunildo.org/test/
Apr 10, 2008
Screenshots
Apr 10, 2008
Here comes the patch I added some more alignements that wasn't in the previous sample. WARNING: It changes the default sizes of the pictures, so probably in a deployed system it will reference non existant images and will continue to present a strange look of the images until these images are erased and re-added. In a new system its fine. I am accepting suggestions about how to deal with that.
Apr 13, 2008
Follows a migration to correct all the images. It erases and reupload all the images in their original order.
Apr 27, 2008
The center_images_v3.patch removes the link attribute of the image when listing the product. This patch will add that link back or you can just manually do it yourself by looking at the diff file.
Apr 27, 2008
Ah, ok. I forgot to put the link back. But put it around the "wraptocenter" div or with narrow images it will not get the whole space.
Aug 15, 2008
(No comment was entered for this change.)
Status:
Accepted
Labels: -Priority-Medium Priority-Low
Aug 23, 2008
I'm closing this out as I think it should be a SubModal-only enhancement. If you want to file a patch / issue for that, visit http://submodal.googlecode.com
Status:
WontFix
Aug 24, 2008
This is not just that, but the rest is a layout fix about the cropped images, have you looked the screenshots above?
Aug 24, 2008
Another thing, if you want that, I don't suggest to aplly it as is I have done something similar in my layout and theres one more problem that IE has when applying links to whole divs (the image don't stay clickable), is something about that hasLayout property crap that only IE has. It can be addressed using CSS, so take a look at the screenshots and if you wnat it, it needs to be redone. Regards. |
4.4 KB Download