Price list
A menu-style list of items with dotted leaders to the price, for restaurants, salons, studios and services.
Menu
Beef lamian
€16Hand-pulled noodles, 18-hour beef broth, radish, chilli oil.
Dan dan mian
€14Sesame, Sichuan pepper, pickled mustard greens. Spicy
Cold sesame soba
€13Buckwheat noodles, cucumber, toasted sesame. Vegan
<ul class="mn-pricelist" style="max-width:34rem">
<li class="mn-pricelist-item"><h3 class="mn-pricelist-name">Beef lamian</h3><span class="mn-pricelist-price">€16</span><p class="mn-pricelist-desc">Hand-pulled noodles, 18-hour beef broth, radish, chilli oil.</p></li>
<li class="mn-pricelist-item"><h3 class="mn-pricelist-name">Dan dan mian</h3><span class="mn-pricelist-price">€14</span><p class="mn-pricelist-desc">Sesame, Sichuan pepper, pickled mustard greens. <span class="mn-badge mn-badge-soft mn-danger mn-badge-sm">Spicy</span></p></li>
<li class="mn-pricelist-item"><h3 class="mn-pricelist-name">Cold sesame soba</h3><span class="mn-pricelist-price">€13</span><p class="mn-pricelist-desc">Buckwheat noodles, cucumber, toasted sesame. <span class="mn-badge mn-badge-soft mn-success mn-badge-sm">Vegan</span></p></li>
</ul>Installation
Everything ships in one stylesheet. There is nothing to import per component.
<link rel="stylesheet" href="https://mian.ro/dist/mian.css">Prefer to own the files? /r/price-list.json is a registry item with this component's CSS and example markup, ready to copy into your project with any tool that reads the open registry-item format.
Class reference
| Class / attribute | Description |
|---|---|
| mn-pricelist | The list (a <ul>). |
| mn-pricelist-item | One item: name, price and description. |
| mn-pricelist-name | The name (<h3>), followed by a dotted leader. |
| mn-pricelist-price | The price, in tabular figures. |
| mn-pricelist-desc | A description under the name; badges for diet or spice. |
Accessibility
- Leaders are CSS only, so screen readers hear “Dan dan mian, €14”, not rows of dots.
- Write allergens and diets as words (e.g. “Vegan”), not just symbols.