funkwhale/front/ui-docs/using-width.md

Using widths

Add width via prop

<Card min-content title='min-content' />
<Card tiny title='tiny' />
<Card buttonWidth title='buttonWidth' />
<Card small title='small' />
<Card medium title='medium' />
<Card auto title='auto' />
<Card width="170.5px" title='width=170.5px' />
<Card full title='full' />

Small height and square aspect ratio

<Button outline icon="bi-star"/>
<Button outline icon="bi-star large"/>
<Button outline square-small icon="bi-star" />
<Button outline square-small icon="bi-star large" />
<Button primary square >b</Button>
<Button primary >c</Button>
<Button primary square-small >a</Button>
<Button primary low-height >e</Button>

b c a e

<Link icon="bi-star" to="."/>
<Link square-small icon="bi-star"  to="."/>
<Link square-small  to=".">g</Link>
<Link square  to=".">h</Link>
<Link  to=".">i</Link>
<Link square-small  to=".">j</Link>
<Link low-height  to=".">k</Link>
<Link square low-height  to=".">l</Link>

g h i j k l

Widths in the grid

::: details Default widths

:::

Designing Pages — The grid