Skip to content

Commit d464a14

Browse files
committed
chore: adding fresh dist/ build from the latest PR changes
1 parent c6051e3 commit d464a14

18 files changed

+127
-4917
lines changed

packages/uikit-workshop/dist/index.html

Lines changed: 87 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,20 @@
44
<head>
55
<title id="title">Pattern Lab</title>
66
<meta charset="UTF-8">
7-
<meta name="viewport" content="width=device-width" />
8-
<link rel="stylesheet" href="styleguide/css/pattern-lab.css" media="all" />
7+
<meta name="viewport" content="width=device-width" />
8+
<meta name="theme-color" content="#ababab"/>
9+
10+
<style>.pl-c-body *{-webkit-box-sizing:border-box;box-sizing:border-box}.pl-c-body{margin:0;padding:0;background:#ddd;-webkit-text-size-adjust:100%}.pl-c-header{position:fixed;top:0;left:0;z-index:4;display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;background:#000;color:gray;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;font-size:.7rem}.pl-c-header__nav-toggle{background:#000;color:gray;text-decoration:none;line-height:1;padding:.7rem .5rem;text-align:left;border:0}@media all and (min-width:42em){.pl-c-header__nav-toggle{display:none}}@media all and (max-width:42em){.pl-c-nav{position:absolute;top:100%;width:100%;overflow:hidden;max-height:0;background:#000;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}@media all and (min-width:42em){.pl-c-nav{display:-webkit-box;display:-ms-flexbox;display:flex}}.pl-c-nav__list{z-index:1;margin:0;padding:0;list-style:none}@media all and (max-width:42em){.pl-c-nav__list{-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2}}@media all and (min-width:42em){.pl-c-nav__list{display:-webkit-box;display:-ms-flexbox;display:flex}}.pl-c-controls,.pl-c-viewport{display:-webkit-box;display:-ms-flexbox;display:flex}.pl-c-controls{margin-left:auto;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.pl-c-viewport{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;height:100vh;width:100%;position:relative;top:2rem;bottom:0;left:0;right:0;z-index:0;overflow:hidden}.pl-c-viewport__cover{width:100%;height:100%;display:none;position:absolute;z-index:20}.pl-c-viewport__iframe-wrapper{height:100%;position:relative;margin:0 auto;-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-overflow-scrolling:touch;overflow-y:auto;overflow-x:hidden;width:100%}.pl-c-viewport__iframe,.pl-c-viewport__resizer{position:absolute;right:0;top:0;bottom:0;margin:0;height:100%}.pl-c-viewport__iframe{border:0;padding:0;left:0;background-color:#fff;width:100%}.pl-c-viewport__resizer{width:14px}.pl-c-viewport__resizer-handle{margin:0;width:100%;height:100%;background:#ccc}.pl-c-modal{display:none;font-family:HelveticaNeue,Helvetica,Arial,sans-serif;background:#000;color:#ccc;position:relative;top:auto;bottom:0;left:0;z-index:5;width:100%;height:50%}.pl-c-modal__toolbar{display:-webkit-box;display:-ms-flexbox;display:flex}.pl-c-modal__close-btn{font-size:70%;background:#000;color:gray;border:0;border-radius:6px 6px 0 0;display:inline-block;padding:.5rem .5rem .3rem;margin:0;text-decoration:none;z-index:2}.pl-c-modal__cover{width:100%;height:100%;display:none;position:absolute;z-index:20}.pl-c-modal__resizer{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;left:0;height:14px;width:100%;background:#000;z-index:2}.pl-c-modal__resizer:after{content:"";height:3px;width:50px;border-top:1px solid gray;border-bottom:1px solid gray}.pl-c-modal__close-btn-icon{width:12px;height:12px;color:currentColor;fill:currentColor}.pl-c-header .pl-c-typeahead{border:0;background:#222!important;color:gray;width:100%;right:0;padding:.61rem .5rem;font-size:inherit}@media all and (min-width:48em){.pl-c-body--theme-sidebar .pl-c-viewport{top:0;margin-left:auto;width:calc(100% - 14rem)}}</style>
11+
12+
<link rel="preload" as="script" href="styleguide/js/patternlab-viewer.js">
13+
<link rel="preload" href="styleguide/css/pattern-lab.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
14+
15+
<noscript>
16+
<link rel="stylesheet" href="styleguide/css/pattern-lab.css" media="all" />
17+
</noscript>
18+
19+
<script async>!function(n){"use strict";n.loadCSS||(n.loadCSS=function(){});var o=loadCSS.relpreload={};if(o.support=function(){var e;try{e=n.document.createElement("link").relList.supports("preload")}catch(t){e=!1}return function(){return e}}(),o.bindMediaToggle=function(t){function e(){t.media=a}var a=t.media||"all";t.addEventListener?t.addEventListener("load",e):t.attachEvent&&t.attachEvent("onload",e),setTimeout(function(){t.rel="stylesheet",t.media="only x"}),setTimeout(e,3e3)},o.poly=function(){if(!o.support())for(var t=n.document.getElementsByTagName("link"),e=0;e<t.length;e++){var a=t[e];"preload"!==a.rel||"style"!==a.getAttribute("as")||a.getAttribute("data-loadcss")||(a.setAttribute("data-loadcss",!0),o.bindMediaToggle(a))}},!o.support()){o.poly();var t=n.setInterval(o.poly,500);n.addEventListener?n.addEventListener("load",function(){o.poly(),n.clearInterval(t)}):n.attachEvent&&n.attachEvent("onload",function(){o.poly(),n.clearInterval(t)})}"undefined"!=typeof exports?exports.loadCSS=loadCSS:n.loadCSS=loadCSS}("undefined"!=typeof global?global:this);</script>
20+
921
</head>
1022

1123
<body class="pl-c-body">
@@ -29,26 +41,38 @@
2941
</div><!--end pl-c-controls-->
3042

3143
</header><!--end pl-c-header-->
32-
33-
44+
3445
<div class="pl-c-viewport pl-js-viewport">
35-
46+
3647
<div class="pl-c-viewport__cover pl-js-viewport-cover"></div>
3748

3849
<div class="pl-c-viewport__iframe-wrapper pl-js-vp-iframe-container">
39-
40-
<iframe class="pl-c-viewport__iframe pl-js-iframe" sandbox="allow-same-origin allow-scripts allow-popups allow-forms allow-modals"></iframe>
41-
50+
51+
<iframe class="pl-c-viewport__iframe pl-js-iframe" sandbox="allow-same-origin allow-scripts allow-popups allow-forms allow-modals" srcdoc='<style>@-webkit-keyframes animateIn{from{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0);opacity:0}to{opacity:1;-webkit-transform:translate3d(-50%,calc(3rem - 50%),0);transform:translate3d(-50%,calc(3rem - 50%),0)}}@keyframes animateIn{from{-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0);opacity:0}to{opacity:1;-webkit-transform:translate3d(-50%,calc(3rem - 50%),0);transform:translate3d(-50%,calc(3rem - 50%),0)}}@-webkit-keyframes rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.pl-c-loader{z-index:1000;position:absolute;top:0;left:50%;margin:auto;max-width:25rem;width:calc(90vw - 2rem);border-radius:3px;background:rgba(0,0,0,.9);-webkit-transform:translate3d(-50%,-100%,0);transform:translate3d(-50%,-100%,0);-webkit-transition:opacity .3s ease,-webkit-transform .3s ease;transition:opacity .3s ease,-webkit-transform .3s ease;transition:opacity .3s ease,transform .3s ease;transition:opacity .3s ease,transform .3s ease,-webkit-transform .3s ease;pointer-events:none;opacity:0;-webkit-animation:animateIn ease .3s forwards;animation:animateIn ease .3s forwards}.pl-c-loader__content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;pointer-events:auto}.pl-c-loader__message{-webkit-box-flex:1;-ms-flex:1;flex:1;padding:1rem;font-size:.85rem;color:#fff}.pl-c-loader__spinner{position:relative;display:inline-block;width:4rem;height:2rem}.pl-c-loader-svg:not(:root){overflow:hidden}.pl-c-loader-svg{position:absolute;top:0;left:0;width:100%;height:100%;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-animation:rotate 1s linear infinite;animation:rotate 1s linear infinite}.pl-c-loader-svg__outer-circle{fill:none;stroke:#fff;stroke-width:15;stroke-miterlimit:10}.pl-c-loader-svg__electron,.pl-c-loader-svg__inner-circle{fill:#ccc}</style><div class="pl-c-loader">
52+
<div class="pl-c-loader__content">
53+
<div class="pl-c-loader__message">Loading Pattern Lab</div>
54+
<div class="pl-c-loader__spinner">
55+
<svg class="pl-c-loader-svg" viewBox="0 0 268 255">
56+
<circle class="pl-c-loader-svg__outer-circle" cx="134.2" cy="127.6" r="115.1"/>
57+
<circle class="pl-c-loader-svg__inner-circle" cx="134.2" cy="127.6" r="66.3"/>
58+
<path class="pl-c-loader-svg__electron" d="M253,56.3c0,15.6-12.6,28.2-28.2,28.2s-28.2-12.6-28.2-28.2s12.6-28.2,28.2-28.2
59+
C240.3,28.1,253,40.7,253,56.3z"/>
60+
</svg>
61+
</div>
62+
</div>
63+
</div>
64+
'></iframe>
65+
4266
<div class="pl-c-viewport__resizer pl-js-resize-container">
4367

44-
<div class="pl-c-viewport__resizer-handle pl-js-resize-handle" />
45-
68+
<div class="pl-c-viewport__resizer-handle pl-js-resize-handle"></div>
69+
4670
</div><!--end pl-c-viewport__resizer-->
4771

4872
</div><!--end pl-c-viewport__iframe-wrapper-->
4973

50-
</div><!--end pl-c-viewport-->
51-
74+
</div><!--end pl-c-viewport-->
75+
5276
<div class="pl-c-modal__cover pl-js-modal-cover"></div>
5377
<div class="pl-c-modal pl-js-modal">
5478
<div class="pl-c-modal__toolbar">
@@ -348,19 +372,21 @@ <h3 class="pl-c-annotations__item-title">{{ title }}</h3>
348372
</script>
349373

350374
<!-- load Pattern Lab data -->
351-
<script src="styleguide/data/patternlab-data.js"></script>
375+
<script src="styleguide/data/patternlab-data.js" defer></script>
352376

353377
<!-- applying theme config to get classes on before PL renders so there's no flash of unstyled content -->
354378
<!-- @todo Consider moving this to own file -->
355379
<script>
356-
if (config && config.theme) {
357-
if (config.theme.color === 'light') {
380+
// need to make sure that window.config is defined first on acccount of us async loading everything ;)
381+
window.patternlab = window.patternlab || {};
382+
window.patternlab.applyTheme = function(){
383+
if (window.config.theme.color === 'light') {
358384
document.body.classList.add('pl-c-body--theme-light');
359385
}
360-
if (config.theme.layout === 'vertical') {
386+
if (window.config.theme.layout === 'vertical') {
361387
document.body.classList.add('pl-c-body--theme-sidebar');
362388
}
363-
switch (config.theme.density) {
389+
switch (window.config.theme.density) {
364390
case 'cozy':
365391
document.body.classList.add('pl-c-body--theme-density-cozy');
366392
break;
@@ -372,26 +398,55 @@ <h3 class="pl-c-annotations__item-title">{{ title }}</h3>
372398
document.body.classList.add('pl-c-body--theme-density-compact');
373399
}
374400
}
401+
402+
// check if config already exists, if so, try to apply theme config; otherwise wait till later just in case.
403+
if (window.config !== undefined) {
404+
if (window.config.theme !== undefined) {
405+
window.patternlab.applyTheme();
406+
}
407+
}
375408
</script>
376409

377-
<script src="annotations/annotations.js"></script>
410+
<script src="annotations/annotations.js" async></script>
378411

379412
<!-- load Pattern Lab external library js -->
380-
<script src="styleguide/bower_components/jquery.min.js"></script>
381-
<script src="styleguide/bower_components/hogan-3.0.2.min.js"></script>
382-
<script src="styleguide/bower_components/prism.min.js"></script>
383-
<script src="styleguide/bower_components/jwerty.min.js"></script>
384-
<script src="styleguide/bower_components/typeahead.bundle.min.js"></script>
385-
<script src="styleguide/bower_components/EventEmitter.min.js"></script>
386-
<script src="styleguide/bower_components/script.min.js"></script>
387-
388-
<!-- set-up the dispatcher -->
389-
<script>
390-
var Dispatcher = new EventEmitter();
391-
</script>
413+
<script src="styleguide/bower_components/jquery.min.js" defer></script>
414+
<script src="styleguide/bower_components/hogan-3.0.2.min.js" defer></script>
415+
<script src="styleguide/bower_components/prism.min.js" defer></script>
416+
<script src="styleguide/bower_components/jwerty.min.js" defer></script>
417+
<script src="styleguide/bower_components/typeahead.bundle.min.js" defer></script>
418+
<script src="styleguide/bower_components/EventEmitter.min.js" defer></script>
419+
<script src="styleguide/bower_components/script.min.js" defer></script>
420+
392421

393-
<!-- load the Pattern Lab viewer js -->
394-
<script src="styleguide/js/patternlab-viewer.js"></script>
422+
<script>(function(){window.whenDefined=function(e,n,t){e[n]?t():Object.defineProperty(e,n,{configurable:!0,enumerable:!0,writeable:!0,get:function(){return this["_"+n]},set:function(e){this["_"+n]=e,t()}})}}).call(this);</script>
423+
<script>!function(r){var e=function(e,t){"use strict";var n=r.document.getElementsByTagName("script")[0],o=r.document.createElement("script");return o.src=e,o.async=!0,n.parentNode.insertBefore(o,n),t&&"function"==typeof t&&(o.onload=t),o};"undefined"!=typeof module?module.exports=e:r.loadJS=e}("undefined"!=typeof global?global:this);</script>
424+
425+
<!-- temp workaround to allow everything to be asynced / deffered with current setup. @todo: remove once refactored components + improved build process is in place. -->
426+
<script>
427+
window.Dispatcher;
428+
window.addEventListener('DOMContentLoaded', function () {
429+
window.Dispatcher = new EventEmitter();
430+
431+
// load the Pattern Lab viewer js -- preloaded earlier ^
432+
loadJS('styleguide/js/patternlab-viewer.js');
433+
});
434+
435+
whenDefined(window, 'config', function() {
436+
if (window.config.theme){
437+
window.patternlab.applyTheme();
438+
}
439+
});
440+
441+
// Check that service workers are registered
442+
// @todo: uncomment once cache-busting strategy is in place
443+
// if ('serviceWorker' in navigator) {
444+
// // Use the window load event to keep the page load performant
445+
// window.addEventListener('load', () => {
446+
// navigator.serviceWorker.register('/sw.js');
447+
// });
448+
// }
449+
</script>
395450

396451
</body>
397452

packages/uikit-workshop/dist/styleguide/bower_components/EventEmitter.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)