Dynamically set height/width of gallery thumbnails

I’m trying to set the height and width of the gallery thumbnails based on whether or not a CSS class is present on the body.

My current implementation looks like this:

require(['jquery', 'mage/gallery/gallery'], function($, gallery)
{
    if ($("body").hasClass("puma")) 
    {
        $('[data-gallery-role=gallery-placeholder]').on('gallery:loaded', function () 
        {
            jQuery('[data-gallery-role=gallery-placeholder').data('gallery').fotorama.setOptions({thumbheight: 88, thumbwidth: 110});
        });
    }
});

Running just the line jQuery('[data-gallery-role=gallery-placeholder').data('gallery').fotorama.setOptions({thumbheight: 88, thumbwidth: 110}); after the page has loaded does size the thumbnails correctly, but as soon as the fullscreen is opened or any other action happens with the gallery, it is reset to the size specified in view.xml.

Is there a way to override the magento sizes as well?