pabsttheater / pabstetix

Issue Tracking for pabsttheater.org
0 stars 0 forks source link

Strange Carousel Behavior when switching Slide Dimensions on Production #36

Closed sarandi closed 5 years ago

sarandi commented 6 years ago

This is related directly to #27 which has been closed, but wanted this all in its own issue as this is a bit detailed.

Usecase:

  1. I followed Daniel's directions (from the 20180814 email) to change the slide dimensions
  2. Jason removed all active slides and created new slides, using files 1920x1080px (same proportions as 800x450)
  3. The slideshow then borked - as best as I can figure, it rendering the images at full height first, then scaling to 100% of the container: screen shot 2018-09-14 at 14 40 16
  4. I checked in incognito and flushed the cache to see if that would fix - it did not.
  5. To fix this, I edited style.css in two places via the WP Theme Editor, though your team may want to review/solve this differently as staging/dev style.css has +~50 lines of diff from production. Here's what I changed:

Lines (Prod) 509-512:

body .meteor-slides .mslide img {
-width: auto!important;
+width: 100%!important;
-height: 100%!important;
+height: auto!important;
}

Lines (Prod) 2947-2949:

meteor-slides .mslide {
-height: 100%!important; 
+width: 100%!important;
}

full diff, including some other changes

My thinking here is that by setting the image to scale to the width of the container (width: 100%) THEN setting the height to auto, the feature will automatically scale images correctly, albeit at extra bandwidth to server/users

  1. style.css did not clear immediately despite flushing that cache - still took about 10 minutes. Not sure if this is typical behavior but made a separate issue to document.
etix-aaron commented 5 years ago

@sarandi's change has been noted by the dev team and will be respected in future code updates. Recommend closing ticket,