@curiousmedia/capline

Mixin for consistent spacing above and below paragraphs.

Usage no npm install needed!

<script type="module">
  import curiousmediaCapline from 'https://cdn.skypack.dev/@curiousmedia/capline';
</script>

README

Capline

Mixin for consistent spacing above and below paragraphs.

Configuration

The unwanted space above and below a paragraph must be configured per font. Unfortunately, configuration requires some trial and error. Configuration is best done at a large fonts size such as 144px.

$capline-fonts: (
  times: (
    unquote('"Times New Roman", sans-serif')
    -0.37em // Spacing to remove at top of paragraph
    -0.35em // Spacing to remove at bottom of paragraph
    1.4 // Default line height
  )
);

Usage

h1 {
  @include capline(
    'times', // Font preset
    5px, // Margin above
    5px, // Margin below
    1.8 // Line-height
  );
}