<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>{$title} | {siteTitle}</title>
    <base href="{=BASE_URL}" target="_self">
    <meta name="MobileOptimized" content="320">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" type="text/css" media="screen" href="public/css/ink.min.css" />
    <link rel="icon" type="image/png" href="public/images/lemon-24.png">
    <style>
     {block style}
     html, body {
       height: 100%;
     }
     .ink-navigation ul.menu.MediumSeaGreen {
       background: #3CB371;
     }
     .ink-navigation ul.menu.MediumSeaGreen li a {
       color: #fff;
       text-decoration: none;
     }
     .ink-navigation ul.menu.MediumSeaGreen li a:hover {
       background: #38a86a;
     }
     .ink-navigation ul.menu li:hover > ul.submenu {
       display: block;
     }
     .ink-navigation ul.menu.MediumSeaGreen > li ul.submenu li {
       font-size: .875em;
     }
     .ink-navigation ul.menu.MediumSeaGreen > li ul.submenu li a {
       border-bottom: 1px solid rgba(0, 0, 0, 0.1);
     }
     .ink-navigation ul.menu.MediumSeaGreen li ul.submenu {
       background: #fff;
       border: 1px solid rgba(0, 0, 0, 0.1);
     }
     .ink-navigation ul.menu.MediumSeaGreen li ul.submenu li a {
       color: #555;
     }
     .ink-navigation ul.menu.MediumSeaGreen li ul.submenu li a:hover {
       background: rgba(0, 0, 0, 0.05);
     }
     .wrap {
       min-height: 100%;
       height: auto !important;
       height: 100%;
       margin: 0 auto -50px;
       overflow: auto;
     }
     .push, footer {
       height: 50px;
       margin-top: 0;
     }
     {/block}
    </style>
  </head>
  <body>
    {var $mediumDate = IoC::resolve( 'i18n' )->__( 'medium_date_format' )}
    <div class="wrap">
      <header>
	<nav class="ink-navigation">
	  {var $menu = new \library\BackendMenu()}
	  {var $class = 'menu horizontal MediumSeaGreen'}
	  {block menu}
	  <ul class="{$class}">
	    {foreach $menu as $item}
	    <li><a href="{$item['url']}">{_}{$item['name']}{/_}</a>
	      {ifset $item['submenu']}
	      {include menu, menu => $item['submenu'], class => 'submenu'}
	      {/ifset}
	    </li>
	    {/foreach}
	  </ul>
	  {/block}
	</nav>
      </header>
      <div class="ink-grid">
	{ifset $flash['error']}
	<div class="ink-alert basic error" role="alert">
	  <button class="ink-dismiss">&times;</button>
	  <p>{$flash['error']}</p>
	</div>
	{/ifset}
	{ifset $flash['warning']}
	<div class="ink-alert basic warning" role="alert">
	  <button class="ink-dismiss">&times;</button>
	  <p>{$flash['warning']}</p>
	</div>
	{/ifset}
	{ifset $flash['success']}
	<div class="ink-alert basic success" role="alert">
	  <button class="ink-dismiss">&times;</button>
	  <p>{$flash['success']}</p>
	</div>
	{/ifset}
	{ifset $flash['notice']}
	<div class="ink-alert basic info" role="alert">
	  <button class="ink-dismiss">&times;</button>
	  <p>{$flash['notice']}</p>
	</div>
	{/ifset}
	{block content}
	{/block}
      </div>
      <div class="push"></div>
    </div>
    <footer class="clearfix">
      <div class="align-center small half-top-space half-bottom-space">
	{_}powered_by{/_} LemonCMS version {=CMS_VERSION}
      </div>
    </footer>
    <script src="public/js/ink/ink-all.js"></script>
    <script src="public/js/ink/autoload.js"></script>
  </body>
</html>
