index.html

<!DOCTYPE html>
<html class="no-js">
    <head>
        <title>Patterns demo pages</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="/style/common.css" />
        <script src="/bundle.min.js"></script>
    </head>
    <body class="component-index">
        <h1>Demos and documentation for the individual patterns</h1>
        <nav id="component-index" class="component-index navigation">
            <div class="behavioural">
                <h4>Behavioural</h4>
                <a
                    class="navigation ajax"
                    href="/src/pat/inject/index.html"
                    title="AJAX injection"
                    >Injection (AJAX)<sup>unknown</sup></a
                >
                <a
                    class="navigation ajax"
                    href="/src/pat/inject-history/index.html"
                    title="Inject history"
                    >Inject history<sup>unknown</sup></a
                >
                <a
                    class="navigation switch"
                    href="/src/pat/switch/index.html"
                    title="Switch"
                    >Switching<sup>β</sup></a
                >
                <a
                    class="navigation toggle"
                    href="/src/pat/toggle/index.html"
                    title="Toggle"
                    >Class toggle<sup>β</sup></a
                >
                <a
                    class="navigation depends"
                    href="/src/pat/depends/index.html"
                    title="Depends"
                    >Depends<sup>β</sup></a
                >
                <a
                    class="navigation clone"
                    href="/src/pat/clone/index.html"
                    title="Clone"
                    >Clone<sup>β</sup></a
                >
                <a
                    class="navigation scroll"
                    href="/src/pat/scroll/index.html"
                    title="Scroll"
                    >Scroll<sup>β</sup></a
                >
                <a
                    class="navigation scroll-box"
                    href="/src/pat/scroll-box/index.html"
                    title="Scroll box"
                    >Scroll Box<sup>β</sup></a
                >
                <a
                    class="navigation ajax"
                    href="/src/pat/push/index.html"
                    title="Push"
                    >Push<sup>β</sup></a
                >
            </div>

            <div class="navigation">
                <h4>Navigation</h4>
                <a
                    class="navigation tree"
                    href="/src/pat/expandable-tree/index.html"
                    title=""
                    >Expandable tree<sup>unknown</sup></a
                >
                <a
                    class="navigation navigation-marker"
                    href="/src/pat/navigation/index.html"
                    title="Navigation markers"
                    >Navigation<sup>unknown</sup></a
                >
                <a
                    class="navigation menu"
                    href="/src/pat/menu/index.html"
                    title="Menu"
                    >Menu<sup>unknown</sup></a
                >
                <a
                    class="navigation tabs"
                    href="/src/pat/tabs/index.html"
                    title="Tabs"
                    >Tabs<sup>unknown</sup></a
                >
            </div>

            <div class="layout">
                <h4>Layout</h4>
                <a
                    class="navigation auto-scale"
                    href="/src/pat/auto-scale/index.html"
                    title="Auto scale"
                    >Auto scaling<sup>ß</sup></a
                >
                <a
                    class="navigation bumper"
                    href="/src/pat/bumper/index.html"
                    title="Bumper"
                    >Bumper<sup>β</sup></a
                >
                <a
                    class="navigation equaliser"
                    href="/src/pat/equaliser/index.html"
                    title="Equaliser"
                    >Equaliser<sup>β</sup></a
                >
                <a
                    class="navigation grid"
                    href="/src/pat/grid/index.html"
                    title="Grid"
                    >Grid</a
                >
                <a
                    class="navigation stacks"
                    href="/src/pat/stacks/index.html"
                    title="Stacks"
                    >Stacks</a
                >
                <a
                    class="navigation syntax-highlight"
                    href="/src/pat/syntax-highlight/index.html"
                    title="Syntax Highlighting"
                    >Syntax Highlight</a
                >
                <a
                    class="navigation sticky"
                    href="/src/pat/sticky/index.html"
                    title="Sticky"
                    >Sticky</a
                >
            </div>

            <div class="forms">
                <h4>Forms</h4>
                <a
                    class="navigation autofocus"
                    href="/src/pat/autofocus/index.html"
                    title="Auto focus"
                    >Autofocus<sup>stable</sup></a
                >
                <a
                    class="navigation auto-submit"
                    href="/src/pat/auto-submit/index.html"
                    title="Auto submit"
                    >Auto submit<sup>β</sup></a
                >
                <a
                    class="navigation auto-suggest"
                    href="/src/pat/auto-suggest/index.html"
                    title="Auto suggest"
                    >Auto suggest<sup>β</sup></a
                >
                <a
                    class="navigation focus"
                    href="/src/pat/focus/index.html"
                    title=""
                    >Focus<sup>stable</sup></a
                >
                <a
                    class="navigation date-picker"
                    href="/src/pat/date-picker/index.html"
                    title=""
                    >Date picker<sup>β</sup></a
                >
                <a
                    class="navigation datetime-picker"
                    href="/src/pat/datetime-picker/index.html"
                    title=""
                    >Date/Time picker<sup>β</sup></a
                >
                <a
                    class="navigation checkboxes"
                    href="/src/pat/checklist/index.html"
                    title="checklist"
                    >Checkboxes<sup>unknown</sup></a
                >
                <a
                    class="navigation selectbox"
                    href="/src/pat/selectbox/index.html"
                    title="selectbox"
                    >Selectbox<sup>unknown</sup></a
                >
                <a
                    class="navigation validate"
                    href="/src/pat/validation/index.html"
                    title="Validate"
                    >Validation<sup>β</sup></a
                >
                <a
                    class="navigation subform"
                    href="/src/pat/subform/index.html"
                    title="Subform"
                    >Subform<sup>unknown</sup></a
                >
                <a
                    class="navigation colour-picker"
                    href="/src/pat/colour-picker/index.html"
                    title="Colour Picker"
                    >Colour-Picker<sup>unknow</sup></a
                >
            </div>

            <div class="fancy-stuff">
                <h4>Fancy stuff</h4>
                <a
                    class="navigation full-calendar"
                    href="/src/pat/calendar/index.html"
                    title="Calendar"
                    >Full calendar<sup>β</sup></a
                >
                <a
                    class="navigation carousel"
                    href="/src/pat/carousel/index.html"
                    title=""
                    >Carousel<sup>β</sup></a
                >
                <a
                    class="navigation collapsible"
                    href="/src/pat/collapsible/index.html"
                    title="collapsible"
                    >Collapsible<sup>stable</sup></a
                >
                <a
                    class="navigation display-time"
                    href="/src/pat/display-time/index.html"
                    title="Display time"
                    >Display time<sup>unknown</sup></a
                >
                <a
                    class="navigation forward"
                    href="/src/pat/forward/index.html"
                    title="Forward"
                    >Forward click events<sup>unknown</sup></a
                >
                <a
                    class="navigation image-crop"
                    href="/src/pat/image-crop/index.html"
                    title="Image crop"
                    >Image crop<sup>unknown</sup></a
                >
                <a
                    class="navigation markdown"
                    href="/src/pat/markdown/index.html"
                    title="Markdown rendering"
                    >Markdown<sup>α</sup></a
                >
                <a
                    class="navigation modal-panel"
                    href="/src/pat/modal/index.html"
                    title="Modal panels"
                    >Modal panels<sup>unknown</sup></a
                >
                <a
                    class="navigation notification"
                    href="/src/pat/notification/index.html"
                    title="Notifications"
                    >Notifications<sup>unknown</sup></a
                >
                <a
                    class="navigation sortable"
                    href="/src/pat/sortable/index.html"
                    title="Sortable"
                    >Sortable<sup>unknown</sup></a
                >
                <a
                    class="navigation tooltip"
                    href="/src/pat/tooltip/index.html"
                    title="Tooltip"
                    >Tooltips<sup>stable</sup></a
                >
                <a
                    class="navigation zoom"
                    href="/src/pat/zoom/index.html"
                    title="Zoom"
                    >Zoom<sup>β</sup></a
                >
                <a
                    class="navigation gallery"
                    href="/src/pat/gallery/index.html"
                    title="Gallery"
                    >Gallery<sup>β</sup></a
                >
                <a
                    class="navigation slides"
                    href="/src/pat/slides/index.html"
                    title="Slides"
                    >Slideshows<sup>β</sup></a
                >
                <a
                    class="navigation masonry"
                    href="/src/pat/masonry/index.html"
                    title="Masonry"
                    >Masonry<sup>β</sup></a
                >
                <a
                    class="navigation fullscreen"
                    href="/src/pat/fullscreen/index.html"
                    title="Fullscreen"
                    >Fullscreen<sup>β</sup></a
                >
                <a
                    class="navigation close-panel"
                    href="/src/pat/close-panel/index.html"
                    title="Close panel"
                    >Close panels<sup>unknown</sup></a
                >
            </div>

            <div class="fancy-examples">
                <h4>Pattern development examples</h4>
                <a
                    class="minimalpattern"
                    href="/src/pat/minimalpattern/index.html"
                    title=""
                    >Minimalpattern<sup>β</sup></a
                >
            </div>
        </nav>
    </body>
</html>