the-riddle
clone your own copy | download snapshot

Snapshots | iceberg

Inside this repository
template.html
text/html

Download raw (2.1 KB)

<!DOCTYPE HTML>
<html lang="en-us">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <link rel="stylesheet" href="style.css" type="text/css" media="all">
    <title>Regions</title>
</head>
<body>
    <!-- PAGES -->
    <div id="pages">
        <!-- MASTER -->
        <div id="master-page" class="paper">
            <div class="page">
                <div class="header"></div>
                <section id="master-region" class="body">
                    <div class="main"></div>
                    <div class="main"></div>
                </section>
                <div clahss="footer"></div>
            </div>
        </div>
    </div>
    <div id="stories">
        <!-- <article id="flow-excursion" data-src="/stories/1-2-2-excursion7.html"></article> -->
        <article id="main" data-src="__story_path__"></article>
    </div>
    <script type="text/javascript" src="index.js"></script>
    <script type="text/javascript" src="/js/flow.js"></script>
    <script type="text/javascript" src="/js/stories.js"></script>
    <script type="text/javascript">
        ; (function () {
            'use strict';

            if (!(document.webkitGetNamedFlows || document.getNamedFlows)) {
                var polyfill = document.createElement("script");
                polyfill.setAttribute("src", "/assets/lib/css-regions.min.js");
                document.body.appendChild(polyfill);
            }
            
            window.addEventListener("load", function () {
              document.getNamedFlow('main').addEventListener('regionlayoutcomplete', function () {
                  window.requestAnimationFrame(function () {
                      document.layoutcomplete = true;
                  });
              });

              var template = document.querySelector('#master-page');
              template.removeAttribute('id');
              template.remove();

              fitFlow(document.getNamedFlow('main'), template, document.querySelector('#pages'), function (node) { return node.classList.contains('paper')});
            });
        })();
    </script>
</body>
</html>