<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>{$item.name|escape} 预览 - {$domain}</title>
    <meta charset="utf-8" />
    <meta name="Description" content="{$item.name|escape}">
    <meta name="keywords" content="{if isset($meta_keywords)}{$meta_keywords}{else}{$lang.page_keywords}{/if}" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimal-ui, user-scalable=yes" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <!-- for ios 7 style, multi-resolution icon of 152x152 -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-barstyle" content="black-translucent">
    <link rel="apple-touch-icon" href="/mbthemes/assets/images/logo.png">
    <meta name="apple-mobile-web-app-title" content="Flatkit">
    <!-- for Chrome on Android, multi-resolution icon of 196x196 -->
    <meta name="mobile-web-app-capable" content="yes">
    <link rel="shortcut icon" sizes="196x196" href="/mbthemes/assets/images/logo.png">
    <!-- style -->
    <link href="http://cdn.staticfile.org/animate.css/3.4.0/animate.min.css" rel="stylesheet">
    <link rel="stylesheet" href="http://cdn.staticfile.org/twitter-bootstrap/4.0.0-alpha/css/bootstrap.min.css" type="text/css" />
    <link rel="stylesheet" href="/mbthemes/assets/styles/icon.css" type="text/css" />
    <!--<link rel="stylesheet" href="http://cdn.bootcss.com/simple-line-icons/2.2.3/css/simple-line-icons.min.css">-->
    <link rel="stylesheet" href="/mbthemes/assets/styles/app.css" type="text/css" />
    <link rel="stylesheet" href="" type="text/css" id="skinStyle" />
    <!-- js -->
{include file="$template_path/html/jstemplate.html"}
<script src="/mbthemes/scripts/canvas/animation.js"></script>
</head>
<body>
{include file="$template_path/html/pagenav-preview.html"}
<iframe id="preview-frame" src="{$item.demo_url}" name="preview-frame" frameborder="0" noresize="noresize" style="margin-top: 3rem">
</iframe>
{literal}
<script type="text/javascript">
    seajs.use(["jq", "modules/preview"], function($, pre){
        $(function(){
            pre.init();
        });
    });
</script>
<!--[if IE 6]>
<script type="text/javascript">
    $(document).ready(function() {
        $('#close-button').remove();
    });
</script>
<![endif]-->
{/literal}

{include file="$template_path/html/mb-settings.html"}
{literal}
<style>
    html body {
        width: 100%;
        height: 100%;
        padding: 0px;
        margin: 0px;
        overflow: hidden;
        font-size: 12px;
        color: #c3c3c3;
        background-color: #ddd;
        text-align: center;
    }
    #changeskins{display: none}
    .inlinei{
        vertical-align: -11px;
    }
    #preview-frame{
        width:100%;
        height: 100%;
        background-color:#fff;
        margin: 0 auto;
    }
</style>
{/literal}
</body>