<div class="kiss-margin-small">
    <kiss-container>

        <?=$contents?>

    </kiss-container>
</div>

<?php $this->start('app-side-panel') ?>

<kiss-card>

    <h2 class="kiss-size-4"><?=t('Pages')?></h2>

    <kiss-navlist>
        <ul>
            <li class="kiss-flex kiss-flex-middle" gap="small">
                <a class="kiss-flex kiss-flex-1 kiss-flex-middle <?=($this->request->route === '/pages' || str_starts_with($this->request->route, '/pages/page')) ? 'kiss-link-muted kiss-text-bold':'kiss-color-muted'?>" href="<?=$this->route('/pages')?>">
                    <kiss-svg class="kiss-margin-small-end" src="<?=$this->base('pages:assets/icons/site-tree.svg')?>" width="20" height="20"><canvas width="20" height="20"></canvas></kiss-svg>
                    <?=t('Site tree')?>
                </a>
                <?php if($this->request->route !== '/pages'): ?>
                <a onclick="App.utils.selectPage((page) => location.href = App.route('/pages/page/'+page._id), {title: 'Go to page'}, false)"><icon size="larger">expand_circle_down</icon></a>
                <?php endif; ?>
            </li>
            <li class="kiss-nav-header kiss-margin-top kiss-margin-xsmall-bottom"><?=t('Other')?></li>
            <li>
                <a class="kiss-flex kiss-flex-middle <?=(str_starts_with($this->request->route, '/pages/menus')) ? 'kiss-link-muted kiss-text-bold':'kiss-color-muted'?>" href="<?=$this->route('/pages/menus')?>">
                    <kiss-svg class="kiss-margin-small-end" src="<?=$this->base('pages:assets/icons/nav.svg')?>" width="20" height="20"><canvas width="20" height="20"></canvas></kiss-svg>
                    <?=t('Menus')?>
                </a>
            </li>
            <li class="kiss-nav-divider"></li>
            <li>
                <a class="kiss-flex kiss-flex-middle <?=(str_starts_with($this->request->route, '/pages/settings')) ? 'kiss-link-muted kiss-text-bold':'kiss-color-muted'?>" href="<?=$this->route('/pages/settings')?>">
                    <kiss-svg class="kiss-margin-small-end" src="<?=$this->base('system:assets/icons/settings.svg')?>" width="20" height="20"><canvas width="20" height="20"></canvas></kiss-svg>
                    <?=t('Settings')?>
                </a>
            </li>
        </ul>
    </kiss-navlist>

</kiss-card>

<?php $this->end('app-side-panel') ?>
