<div id="mobile-nav" class="side-nav sidenav">

    <div class="mobile-head bg-color">
        <% if (theme.logo !== undefined && theme.logo.length > 0) { %>
        <img src="<%= theme.logo %>" class="logo-img circle responsive-img">
        <% } %>
        <div class="logo-name"><%- config.title %></div>
        <div class="logo-desc">
            <% if (config.description && config.description.length > 0) { %>
            <%= config.description %>
            <% } else { %>
            Never really desperate, only the lost of the soul.
            <% } %>
        </div>
    </div>

    <%
        var menuMap = new Map();
        menuMap.set("Index", "首页");
        menuMap.set("Tags", "标签");
        menuMap.set("Categories", "分类");
        menuMap.set("Archives", "归档");
        menuMap.set("About", "关于");
        menuMap.set("Friends", "友情链接");
    %>

    <ul class="menu-list mobile-menu-list">
        <% Object.keys(theme.menu).forEach(function(key) { %>
        <li>
            <a href="<%- theme.menu[key].url %>" class="waves-effect waves-light">
                <% if (theme.menu[key].icon && theme.menu[key].icon.length > 0) { %>
                <i class="fa fa-fw <%- theme.menu[key].icon %>"></i>
                <% } else { %>
                <i class="fa fa-fw fa-link"></i>
                <% } %>
                <%- (config.language === 'zh-CN' && menuMap.has(key)) ? menuMap.get(key) : key %>
            </a>
        </li>
        <% }); %>
        <% if (theme.githubLink && theme.githubLink.enable) { %>
        <li><div class="divider"></div></li>
        <li>
            <a href="<%- theme.githubLink.url %>" class="waves-effect waves-light" target="_blank">
                <i class="fa fa-github-square fa-fw"></i><%- theme.githubLink.title %>
            </a>
        </li>
        <% } %>
    </ul>
</div>
