[Koha-bugs] [Bug 7669] New: Search Results Multiple Cover Image HTML & CSS

[bugzilla-daemon at bugs.koha-community.org]

http://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=7669

          Priority: P5 - low
 Change sponsored?: ---
            Bug ID: 7669
          Assignee: oleonard at myacpl.org
           Summary: Search Results Multiple Cover Image HTML & CSS
        QA Contact: koha.sekjal at gmail.com
          Severity: enhancement
    Classification: Unclassified
                OS: All
          Reporter: ssammons at npelem.com
          Hardware: All
            Status: NEW
           Version: rel_3_6
         Component: OPAC
           Product: Koha

Created attachment 8065
  -->
http://bugs.koha-community.org/bugzilla3/attachment.cgi?id=8065&action=edit
Patch of my changes to opac_results.tt and opac.css

Looks at the code for the images in the template I notices some were raw
images, some were encased in <div> tags, and no-images were in <spans>

As per my comments in bug 7594 I added classes to the elements to make then
more easily modified by the end user through the OPAC CSS options.

Also, all images and no-images now have float:left (this was in the .thumbnail
class). I combines the thumbnail elements into the .no-image{} class. It does
not have div.no-image like the still active span.no-image, because that is an
element specific class and thus any setting in it over-ride user settings. So,
it has to stay a simply .no-image.

Images "<img>" now have a class thumbnail_image. This was in keeping with
consistent and unique element classes. Thumbnail is used by all the <div>
elements.

Here are the new classes I have added, that are vendor/company specific:
/* New Classes for Thumbnail Images */
.thumbnail_image { /* specific class for the actual <img> tag */

}
/* specific classes for thumbnails */
.opac_thumb, .amazon_thumb, .google_thumb, .syndetics_thumb,
.openlibrary_thumb, .bakertaylor_thumb{

}
/* specific classes for no-image */
.amazon_no, .google_no, .openlibrary_no, .bakertaylor_no{

}

Example Code to see why:

/*examples how a specific class works*/
div.amazon_no{ /*Amazon no image [seem broken in code]*/
border: 1px solid #FFA500; /*amazon is ornage*/
}
.google_thumb, .google_no{/*Google no image*/
border-top: 2px solid #F00;
border-right: 2px solid #080;
border-bottom: 2px solid #FF0;
border-left: 2px solid #00F;
padding: 2px;
}
.openlibrary_no{
background: url(http://openlibrary.org/images/logo_IA-sm.png) right center
no-repeat;
color: #00F;
text-align: left;
}

You can also view an image here...http://ww.screencast.com/t/vPwtSYmZa4v

I am attaching my patch

-- 
You are receiving this mail because:
You are watching all bug changes.