@pnx-mixtape/content-card

content-card component

Usage no npm install needed!

<script type="module">
  import pnxMixtapeContentCard from 'https://cdn.skypack.dev/@pnx-mixtape/content-card';
</script>

README

@pnx-mixtape/content-card

Documentation and examples: Content cards

Installation

npm install @pnx-mixtape/content-card --save

How to use

CSS

  • PostCSS workflow: @import '@pnx-mixtape/content-card';
  • Sass/Eyeglass: @import 'mixtape-content-card';
  • Native CSS: @import url('dist/content-card.css');
  • Link tag: <link href="dist/content-card.css" rel="stylesheet" type="text/css">

HTML

<div class="content-card">
  <figure class="content-card__media">
    <img src="https://via.placeholder.com/788x556" alt="Descriptive text">
  </figure>
  <div class="content-card__content">
    <h3>Title</h3>
    <p>Body content</p>
  </div>
</div>