Skeleton

import '@rhds/elements/rh-skeleton/rh-skeleton.js';

<rh-skeleton></rh-skeleton>

<link rel="stylesheet" href="../rh-skeleton-lightdom.css">

import '@rhds/elements/rh-skeleton/rh-skeleton.js';

<rh-skeleton type="circle"></rh-skeleton>

<link rel="stylesheet" href="../rh-skeleton-lightdom.css">

import '@rhds/elements/rh-skeleton/rh-skeleton.js';
import '@rhds/elements/lib/elements/rh-context-demo/rh-context-demo.js';

<rh-context-demo>
  <rh-skeleton></rh-skeleton>
</rh-context-demo>

<link rel="stylesheet" href="../rh-skeleton-lightdom.css">

import '@rhds/elements/rh-skeleton/rh-skeleton.js';

<rh-skeleton type="rectangle"></rh-skeleton>

<link rel="stylesheet" href="../rh-skeleton-lightdom.css">

import '@rhds/elements/rh-skeleton/rh-skeleton.js';

<rh-skeleton type="square"></rh-skeleton>

<link rel="stylesheet" href="../rh-skeleton-lightdom.css">

import '@rhds/elements/rh-skeleton/rh-skeleton.js';

<h2>Body Copy Skeletons</h2>
<rh-skeleton type="body-copy" size="xs"></rh-skeleton>
<rh-skeleton type="body-copy" size="sm"></rh-skeleton>
<rh-skeleton type="body-copy" size="md"></rh-skeleton>
<rh-skeleton type="body-copy" size="lg"></rh-skeleton>
<rh-skeleton type="body-copy" size="xl"></rh-skeleton>
<rh-skeleton type="body-copy" size="2xl"></rh-skeleton>

<h2>Heading Skeletons</h2>
<rh-skeleton type="heading" size="xs"></rh-skeleton>
<rh-skeleton type="heading" size="sm"></rh-skeleton>
<rh-skeleton type="heading" size="md"></rh-skeleton>
<rh-skeleton type="heading" size="lg"></rh-skeleton>
<rh-skeleton type="heading" size="xl"></rh-skeleton>
<rh-skeleton type="heading" size="2xl"></rh-skeleton>

<link rel="stylesheet" href="../rh-skeleton-lightdom.css">