Full-Width Layout

The uploader stretches to fill its container width. Suitable for full-width page layouts and dashboard panels.

What you should see: the control stretching to its container's full width, for dashboards and page-width forms. Accepts up to 50 MB.

Drag & drop files here, or paste from clipboard

<div style="--cu-layout: full-width;
 --cu-btn-width: 100%;">
 <core-upload asp-upload-url="/api/upload/upload"
 asp-multiple="true"
 asp-progress="true"
 asp-drop-zone="true"
 asp-max-size="50MB">
 </core-upload>
</div>

Filling its container

The uploader takes the width of whatever it is placed in, so a full-width layout is a matter of the surrounding markup rather than an option. That suits an import screen or an empty state where uploading is the page's purpose.

Wide has a limit

Past a certain width the queue's columns drift apart and a file name ends up far from its progress bar, which is harder to read rather than easier. Capping the maximum width keeps the related information together on a large monitor.