Feature grid
Features as a ruled editorial grid or with icons, plus a check list for plans and specs.
Ruled features
Rules that learn
Approve a match once and Ledger writes the rule. Most teams stop touching 80% of transactions within a month.
Every currency, one ledger
Rates are locked at the transaction date and revaluations post automatically at month-end.
An audit trail that reads
Each entry links to the bank line, the invoice and the person who approved it.
<section class="mn-section mn-section-sm">
<div class="mn-container">
<ul class="mn-features mn-features-3 mn-features-ruled">
<li class="mn-feature"><h3 class="mn-feature-title">Rules that learn</h3><p>Approve a match once and Ledger writes the rule. Most teams stop touching 80% of transactions within a month.</p></li>
<li class="mn-feature"><h3 class="mn-feature-title">Every currency, one ledger</h3><p>Rates are locked at the transaction date and revaluations post automatically at month-end.</p></li>
<li class="mn-feature"><h3 class="mn-feature-title">An audit trail that reads</h3><p>Each entry links to the bank line, the invoice and the person who approved it.</p></li>
</ul>
</div>
</section>With icons and a check list
Overnight matching
Feeds arrive at 02:00 and are matched before 06:00.
Read-only bank access
Ledger can see balances; it can never move money.
- Unlimited bank and card connections
- Multi-entity consolidation
- Exports to Xero, NetSuite and DATEV
- Not included: On-premise hosting
<section class="mn-section mn-section-sm">
<div class="mn-container mn-split mn-split-top">
<ul class="mn-features">
<li class="mn-feature"><span class="mn-feature-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M13 2 4 14h7l-1 8 9-12h-7Z"/></svg></span><h3 class="mn-feature-title">Overnight matching</h3><p>Feeds arrive at 02:00 and are matched before 06:00.</p></li>
<li class="mn-feature"><span class="mn-feature-icon"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="4" y="11" width="16" height="10" rx="2"/><path d="M8 11V7a4 4 0 0 1 8 0v4"/></svg></span><h3 class="mn-feature-title">Read-only bank access</h3><p>Ledger can see balances; it can never move money.</p></li>
</ul>
<ul class="mn-checklist">
<li>Unlimited bank and card connections</li>
<li>Multi-entity consolidation</li>
<li>Exports to Xero, NetSuite and DATEV</li>
<li class="mn-off"><span class="mn-sr-only">Not included: </span>On-premise hosting</li>
</ul>
</div>
</section>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/feature-grid.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-features | The grid (a <ul>): 1, 2, then mn-features-3 or mn-features-4 columns as the section widens. |
| mn-features-ruled | A hairline above each feature instead of boxes: calmer than a wall of cards. |
| mn-feature | One feature: optional mn-feature-icon, mn-feature-title (<h3>) and a paragraph. |
| mn-checklist | A list with check marks. <li class="mn-off"> marks something not included. |
Accessibility
- Feature titles are headings (<h3> under the section’s <h2>).
- Icons are decorative (aria-hidden): the title carries the meaning.
- mn-checklist marks are CSS: for “not included” items add visually hidden text such as “Not included:”.
- Layout answers to the section’s own width (container queries), so it works the same in a page, a sidebar or a preview.