| Summary: | Responsiveness not working for some screen sizes on OPAC search results | ||
|---|---|---|---|
| Product: | Koha | Reporter: | David Cook <dcook> | 
| Component: | Templates | Assignee: | Owen Leonard <oleonard> | 
| Status: | RESOLVED DUPLICATE | QA Contact: | Testopia <testopia> | 
| Severity: | major | ||
| Priority: | P5 - low | CC: | fridolin.somers | 
| Version: | 21.11 | ||
| Hardware: | All | ||
| OS: | All | ||
| GIT URL: | Initiative type: | --- | |
| Sponsorship status: | --- | Crowdfunding goal: | 0 | 
| Patch complexity: | --- | Documentation contact: | |
| Documentation submission: | Text to go in the release notes: | ||
| Version(s) released in: | Circulation function: | ||
| Attachments: | Screenshot of styling issue | ||
| 
        
          Description
        
        
          David Cook
        
        
        
        
          2022-05-25 04:26:22 UTC
        
       As a workaround, I'm using the following in OPACUserCSS:
@media screen and (min-width: 768px) and (max-width: 991px) {
  
  body#results .col-lg-2 {
    max-width: 16.667%;
  }
  body#results .col-lg-10.order-md-first {
    max-width: 83.333%;
  }
}
body#results .col-lg-10.order-md-first {
  order: inherit; 
}A screen shot would be helpful :) Created attachment 135332 [details]
Screenshot of styling issue
As per Frido's suggestion, I've attached a screenshot. I'm not sure if it's quite clear what I mean here, but I could try to add more tomorrow if more clarification is needed. (Just on my way out the door.)Basically, either emulate or use a small screen, do a test search, and then scroll down to the bottom. You'll see that the facets are at the bottom of the screen inside of the left side or in a collapsed menu at the top. |