UNPKG

2.84 kBHTMLView Raw
1<!doctype html>
2<html lang="en">
3<head>
4 <!-- Google Tag Manager -->
5 <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
6 new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
7 j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
8 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
9 })(window,document,'script','dataLayer','GTM-PF34DLP');</script>
10 <script>
11 const dataLayer = [{
12 'hi':'there'
13 }]
14 </script>
15 <!-- End Google Tag Manager -->
16 <title>Demo Drawer</title>
17 <meta charset="UTF-8">
18 <meta name="viewport" content="width=device-width, initial-scale=1">
19 <link href="https://unpkg.com/@pearson-components/elements-sdk@1.9.0/build/css/elements.css" type="text/css" rel="stylesheet"/>
20</head>
21<body>
22 <!-- Google Tag Manager (noscript) -->
23 <noscript>
24 <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PF34DLP" height="0" width="0" style="display:none;visibility:hidden"></iframe>
25 </noscript>
26 <!-- End Google Tag Manager (noscript) -->
27
28 <div id="drawer"></div>
29
30 <!-- Icons -->
31 <script>
32 if (document.body.children[0].nodeName !== 'svg') {
33 var pe_ajax = new XMLHttpRequest();
34 pe_ajax.open("GET", "https://unpkg.com/@pearson-components/elements-sdk/build/icons/p-icons-sprite-1.1.svg", true);
35 pe_ajax.responseType = "document";
36 pe_ajax.onload = function(e) {
37 document.body.insertBefore(
38 pe_ajax.responseXML.documentElement,
39 document.body.childNodes[0]
40 );
41 }
42 pe_ajax.send();
43 }
44 </script>
45
46 <!-- Provide React and ReactDOM as a depedency external to the component -->
47 <script crossorigin src="https://unpkg.com/react@latest/umd/react.development.js"></script>
48 <script crossorigin src="https://unpkg.com/react-dom@latest/umd/react-dom.development.js"></script>
49 <script crossorigin src="https://unpkg.com/prop-types@latest/prop-types.js"></script>
50 <!-- CustomEvent, Array.from, Object.assign and Promise polyfills are for IE, Intl.js polyfill is for Safari -->
51 <script src="https://cdn.polyfill.io/v2/polyfill.js?features=CustomEvent,Array.from,Object.assign,Promise,Intl.~locale.en,Intl.~locale.fr"></script>
52 <!-- Demo build of component Injected on build -->
53 <!-- Build Component to View Demo: npm run build && npm start -->
54 <!-- View at: http://localhost:8081/drawer/ -->
55<script type="text/javascript" src="/drawer/demo.drawer.js"></script><script type="text/javascript" src="/drawer/eventInterface.drawer.js"></script><script type="text/javascript" src="/drawer/dist.drawer.js"></script><script type="text/javascript" src="/drawer/fonts.drawer.js"></script><script type="text/javascript" src="/drawer/dev.drawer.js"></script></body>
56</html>