Camel2.0 — Dokumentacja komponentów UI

2.6 #Components.Cards Cards

Toggle example guides Toggle HTML markup

Bazowa karta z obrazem, tytułem i opisem. Border-radius, hover shadow + translateY.

Example

Card Title

Opis karty z przykładowym tekstem.

Card Title 2

Kolejna karta w gridzie.

Markup: cards.html
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; max-width: 900px;">
  <div class="card">
    <div class="card-body">
      <h4 class="card-title">Card Title</h4>
      <p class="card-text">Opis karty z przykładowym tekstem.</p>
    </div>
  </div>
  <div class="card">
    <div class="card-body">
      <h4 class="card-title">Card Title 2</h4>
      <p class="card-text">Kolejna karta w gridzie.</p>
    </div>
  </div>
</div>
Source: src/scss/components/_cards.scss, line 1