Card (.card)

Cards are useful for separating different content sections on one page. Card can be used with a element to create a clickable card with hover effect.

Syntax

<!-- Normal card -->
<div class="card">...</div>

<!-- Clickable card -->
<a href="#" class="card">...</a>

Modifiers

Configuration

$card-background: $white;
$card-padding: $baseline $gutter*2;
$card-border-radius: $borderRadius;
$card-border-color: $color-border;
$card-border-width: 1px;