Toolkit

<h1>Toolkit Validation</h1>

<h2>Loading of Source Sans Font</h2>

<p>This sentence and all text on this page should be rendered in the Source Sans font. Custom font variants for <strong>bold</strong>, <em>italic</em> and <strong><em>bolded italic</em></strong> should also be present.</p>

<h2>Faker Library</h2>

<p>The following paragraph is random text generated by the Faker module and inlined into this page by a Handlebars expression:</p>

<blockquote>
    Vulgaris tracto decipio aureus sustineo accendo. Speciosus aufero cado aer provident. Vesco acquiro crastinus uberrime teneo vulariter decet vehemens.
    Agnitio sufficio volup vir appositus alii valetudo succurro sollicito. Amoveo adeo cupio vetus. Tot ancilla adflicto deputo.
    At textilis clamo tantum totus aperio compono venia. Subseco tribuo cilicium vestrum decipio cattus spero somniculosus enim tricesimus. Ustulo talus taedium aduro possimus amoveo spiculum articulus molestiae vallum.
</blockquote>

<h2>Font Awesome Icons</h2>

<p class="test-checkmark">This sentence should contain a green checkmark at the end.</p>
<p>This verifies that a Font Awesome icon is getting rendered from the fontawesome-pro module using a <a href="https://parceljs.org/features/dependency-resolution/#file-aliases">Parcel file alias</a> (defined in package.json) and inlining the image into the stylesheet as a <a href="https://parceljs.org/features/bundle-inlining/#inlining-as-a-data-url">data URL</a>.</p>

<h2>JavaScript</h2>

<p class="test-js">Is JavaScript getting compiled and loading on this page [yes/no]? <strong>no</strong></p>

<h2>Images</h2>

<p>This SVG's <code>src</code> attribute has a path to the toolkit's compiled images at <strong>/dist/images/</strong> and contains a Handlebars expression and Fractal <code>path</code> variable:</p>

<img src="../../dist/images/icon-cdl.svg" alt="California Digital Library icon">

<h2>Visually Verify</h2>

<ol>
    <li>This page's elements are rendering the same in the current versions of Chrome, Firefox and Safari desktop browsers; verify older browser rendering per project requirements</li>
    <li>CSS is getting compiled to <strong>/dist/css/test.css</strong> with <a href="https://parceljs.org/languages/css/#vendor-prefixing">Parcel vendor prefixing</a> (such as adding <code>-webkit-mask</code>) and other <a href="https://parceljs.org/languages/css/#syntax-lowering">Parcel transpilations</a> (verify CSS logical properties)</li>
    <li>Images are rendering when served from this page hosted on <a href="https://cdlib.github.io/intracdl-ui">GitHub Pages</a> (verifying that file paths aren't broken)</li>
    <li>Source maps (when using the toolkit in development mode) are correctly referencing this page's element styles to the <strong>test.css</strong> and <strong>main.css</strong> stylesheets and line numbers (verify with browser inspector tool)</li>
    </ul>