""" CSS styling and sample image utilities for Gradio interface. """ import os import glob from utils.image_utils import image_to_base64 def get_sample_images(): """Get list of sample images.""" sample_dir = "sample_images" if os.path.exists(sample_dir): image_files = glob.glob(os.path.join(sample_dir, "*.png")) + glob.glob(os.path.join(sample_dir, "*.jpg")) return sorted(image_files) return [] def generate_css(): """Generate CSS with base64 images for sample buttons.""" base_css = """ /* Target only the image display area, not the whole component */ .image-container [data-testid="image"] { height: 500px !important; min-height: 500px !important; } /* Make images fill their containers */ .image-container img { width: 500px !important; height: 500px !important; object-fit: contain !important; object-position: center !important; } /* Sample image buttons with background images */ .sample-image-btn { height: 120px !important; width: 120px !important; background-size: cover !important; background-position: center !important; border: 2px solid #ddd !important; border-radius: 8px !important; cursor: pointer !important; transition: border-color 0.2s !important; margin: 5px !important; } .sample-image-btn:hover { border-color: #007acc !important; } """ # Add background images for each sample (only if samples exist) sample_images = get_sample_images() if sample_images: for i, img_path in enumerate(sample_images): try: base64_img = image_to_base64(img_path) base_css += f"#sample_btn_{i} {{ background-image: url('{base64_img}'); }}\n" except Exception: # Skip invalid images continue return base_css