@ulu/frontend
Version:
A framework-agnostic frontend toolkit providing a modular, tree-shakable library of accessible components and utilities. Designed for seamless integration, it features a highly configurable SCSS system for any environment and vanilla JavaScript modules op
16 lines (14 loc) • 613 B
HTML
<!-- @ulu-demo
title: Default Ratio (4/3)
description: A standard 4/3 aspect ratio box, useful for traditional photography or balanced content.
-->
<div class="ratio-box" style="max-width: 400px;">
<img src="https://picsum.photos/id/1011/400/300" class="ratio-box__content" alt="4/3 Image">
</div>
<!-- @ulu-demo
title: Widescreen Ratio (16/9)
description: Using the `ratio-box--16x9` modifier for video content or wide banners.
-->
<div class="ratio-box ratio-box--16x9" style="max-width: 600px;">
<img src="https://picsum.photos/id/1015/600/337" class="ratio-box__content" alt="16/9 Image">
</div>