@pnx-mixtape/layout

layout component

Usage no npm install needed!

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

README

@pnx-mixtape/layout

Documentation and examples: Accordion

Installation

npm install @pnx-mixtape/layout --save-dev

How to use

CSS

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

HTML

<div class="grid">
  <div class="grid__col grid--6-col"></div>
  <div class="grid__col grid--6-col"></div>
</div>

<div class="grid">
  <div class="grid__col grid--4-col"></div>
  <div class="grid__col grid--4-col"></div>
  <div class="grid__col grid--4-col"></div>
</div>

<section class="section section--top-l section--bottom-l">
  <article class="section__content">
    <p>Section content.</p>
  </article>
</section>