sedlav
/
libreta


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
							{% import './macros/icon.njk' as icon  %}
<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="A layout example that shows off a responsive email layout.">
        <title>Email &ndash; Layout Examples &ndash; Pure</title>
        <link rel="stylesheet" href="https://unpkg.com/purecss@2.1.0/build/pure-min.css" integrity="sha384-yHIFVG6ClnONEA5yB5DJXfW2/KC173DIQrYoZMEtBvGzmf0PKiGyNEqe9N6BNDBH" crossorigin="anonymous">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/styles/base16/gruvbox-dark-hard.min.css" integrity="sha512-kCMzrI8UyzNgyq0JVxwb17xy9nRVhwyPBSTaRC1hiOCnbMKBv9vII61ZHD4EmHpc+o0o9trcRCRAk6j5vVft8A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/codemirror.min.css" integrity="sha512-uf06llspW44/LZpHzHT6qBOIVODjWtv4MxCricRxkzvopAlSWnTf6hpZTFxuuZcuNE9CBQhqE0Seu1CoRk84nQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,400;0,500;1,400;1,500&display=swap" rel="stylesheet">    
        <link rel="stylesheet" href="/stylesheets/style.css">
    </head>
    <body>
        <div id="layout" class="content pure-g">
            <div id="nav" class="pure-u-1">
                <a href="#" id="menuLink" class="nav-menu-button">Menu</a>

                <div class="nav-inner">
                    <button id="new" class="pure-button pure-button-primary">{{ icon.svg('plus-circle') }} New</button>

                    <div class="pure-menu">
                        <ul class="pure-menu-list">
                            <li class="pure-menu-heading">Languages</li>
                            {% for language in languages %}
                                <li class="pure-menu-item{% if selected.language === language.code %} pure-active{% endif %}"><a href="/{{ language.code }}" class="pure-menu-link">{{ language.name }}</a></li>
                            {% endfor %}
                        </ul>
                    </div>
                </div>
            </div>

            <div id="list" class="pure-u-1">
                {% for row in rows %}
                    <div id="{{ row.id }}" class="item-container">
                        <div class="item pure-g {% if row.id == selected.id %}item-selected{% endif %}">
                            <div class="pure-u-3-4">
                                <h4 class="subject">{{ row.title }}</h4>
                                <p class="desc">{{ row.tags }}</p>
                            </div>
                            <div class="pure-u-1-4">
                                {% if row.status == 'DRAFT' %}
                                    <div>{{ icon.svg('slash-circle') }}</div>
                                {% elseif row.status == 'PUBLISHED' %}
                                    <div>{{ icon.svg('check2-circle') }}</div>
                                {% elseif row.status == 'SYNCHRONIZED' %}
                                    <div>{{ icon.svg('arrow-left-right') }}</div>
                                {% endif %}
                                {% if row.translations_count > 1 %}
                                    <div>{{ icon.svg('translate') }}</div>
                                {% endif %}
                            </div>
                            
                        </div>
                    </div>
                {% endfor %}
                
            </div>

            <div id="main" class="pure-u-1">
                {% include "./partial/view.njk" %}
            </div>
        </div>
        <!-- Script to make the Menu link work -->
        <!-- Just stripped down version of the js/ui.js script for the side-menu layout -->
        <script>
            function getElements() {
                return {
                    menu: document.getElementById('nav'),
                    menuLink: document.getElementById('menuLink')
                };
            }

            function toggleClass(element, className) {
                var classes = element.className.split(/\s+/);
                var length = classes.length;
                var i = 0;

                for (; i < length; i++) {
                    if (classes[i] === className) {
                        classes.splice(i, 1);
                        break;
                    }
                }
                // The className is not found
                if (length === classes.length) {
                    classes.push(className);
                }

                element.className = classes.join(' ');
            }

            function toggleMenu() {
                var active = 'active';
                var elements = getElements();

                toggleClass(elements.menu, active);
            }

            function handleEvent(e) {
                var elements = getElements();

                if (e.target.id === elements.menuLink.id) {
                    toggleMenu();
                    e.preventDefault();
                } else if (elements.menu.className.indexOf('active') !== -1) {
                    toggleMenu();
                }
            }

            document.addEventListener('DOMContentLoaded', function () {
                document.addEventListener('click', handleEvent);
            });
        </script>
        <script type="text/javascript" src="/javascripts/main.js"></script>
        <script id="view.js" type="text/javascript" src="/javascripts/view.js"></script>
    </body>
</html>