@planningcenter/typeface

Planning Center Typefaces

Usage no npm install needed!

<script type="module">
  import planningcenterTypeface from 'https://cdn.skypack.dev/@planningcenter/typeface';
</script>

README

@planningcenter/typeface

Usage

yarn add @planningcenter/typeface

Usage

Setup for Rails Planning Center Rails apps using Sprockets.

/* application.css */
/*= @planningcenter/typeface/sans-serif.css */
/*= @planningcenter/typeface/monospace.css */

Extensions

Additional libraries for specific use cases.

sans-serif--print

This resolves an issue reported by @shanebonham that impacts printing in Chrome on Catalina.

Referenc

This extension overrides our font-family: syste-ui ... with font-family: Sans-Serif with a @media print gate.

/* application.css */
/* ORDER MATTERS */
/*= @planningcenter/typeface/sans-serif.css */
/*= @planningcenter/typeface/extension/sans-serif--print.css */

Examples

<body class="sans-serif">
  ...
</body>

<pre class="monospace">
  <code>
    ...
  </code>
</pre>