Minor tweaks.

Author: kwokcb

javascript/JsPolyHaven/index.html

@@ -56,8 +56,8 @@
         }
 
         #materialPreview {
-            max-height: 400px;
-            object-fit: contain;
+            max-height: 480px;
+            object-fit: cover;
         }
 
         .map-badge {
@@ -190,11 +190,13 @@ <h5 class="modal-title" id="materialModalLabel">Material Details</h5>
                                 <div class="row-sm p-0 m-0 g-0">
                                     <!-- Viewer -->
                                     <div class="col-sm p-0 m-0 g-0">
+                                    <div class="container-fluid p-0 m-0 g-0" id="viewerContainer">
                                         <iframe id="viewer" src="" class="p-0"
                                             style="width: 100%; height: 480px; overflow: auto; border: none; display:none;"
                                             frameborder="0" allowfullscreen>
                                         </iframe>
                                     </div>
+                                    </div>
                                 </div>                            
                             </div>
                         </div>
@@ -203,7 +205,7 @@ <h5 class="modal-title" id="materialModalLabel">Material Details</h5>
                                 <i class="bi bi-eye me-2"></i>Show Content
                             </button>
                         </div>
-                        <div id="contentPreview" class="mt-1" style="display:none;">
+                        <div id="contentPreview" class="container mt-1" style="display:none;">
                             <div class="mt-2 mb-2">
                                 <b>Textures</b>
                                 <div id="textureGallery" class="row g-2"></div>

javascript/JsPolyHaven/main.js

@@ -388,7 +388,7 @@ async function loadMaterialContent(materialId) {
         const createTextureCard = (textureName, textureUrl) => 
         {
             const card = document.createElement('div');
-            card.className = 'col-6 col-md-4 col-lg-3 mb-3';
+            card.className = 'col-sm-3 col-md-3 col-lg-3 mb-2';
 
             // If textureURL ends with exr replace with png for preview
             if (textureUrl.toLowerCase().endsWith('.exr')) {