base3-no-menu.pt 13.4 KB
<!DOCTYPE html>
<html lang="en-us" class="hidden-menu-mobile-lock">
    <head>
        <meta charset="utf-8">
        <!--<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">-->
        <title>${request.app_name} | ${request.company}</title>
        <meta name="description" content="">
        <meta name="author" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <!-- GOOGLE FONT -->
        <link rel="stylesheet" href="${request._host}/static/v3/css/gf_open_sans-400italic_700italic_300_400_700.css">
        <!-- Basic Styles -->
        <link rel="stylesheet" type="text/css" media="screen" href="${request._host}/static/v3/css/bootstrap.min.css">
        <link rel="stylesheet" type="text/css" media="screen" href="${request._host}/static/v3/css/font-awesome.min.css">
        <!-- SmartAdmin Styles : Caution! DO NOT change the order -->
        <link rel="stylesheet" type="text/css" media="screen" href="${request._host}/static/v3/css/smartadmin-production-plugins.min.css">
        <link rel="stylesheet" type="text/css" media="screen" href="${request._host}/static/v3/css/smartadmin-production.min.css">
        <link rel="stylesheet" type="text/css" media="screen" href="${request._host}/static/v3/css/smartadmin-skins.min.css">
        <!-- We recommend you use "your_style.css" to override SmartAdmin
             specific styles this will also ensure you retrain your customization with each SmartAdmin update. -->
             <link rel="stylesheet" type="text/css" media="screen" href="${request._host}/static/v3/css/osipkd.css">
        <!-- FAVICONS -->
        <link rel="shortcut icon" href="${request._host}/static/v3/img/favicon.png" type="image/x-icon">
        <link rel="icon" href="${request._host}/static/v3/img/favicon.png" type="image/x-icon">
        <!-- OTHER CSS -->
        <link href="${request._host}/static/v3/js/plugin/bootstrap-datepicker/css/bootstrap-datepicker.min.css" rel="stylesheet">
        <link href="${request._host}/deform_static/css/form.css" rel="stylesheet">
        <link href="${request._host}/deform_static/css/typeahead.css" rel="stylesheet">
        <link href="${request._host}/static/css/home.css" rel="stylesheet" type="text/css">
        <metal:css define-slot="css_files"></metal:css>
        <style type="text/css">
            html, body {
                overflow-x: hidden;
            }
            #header {
                background-image: none !important;
                background-color: #57889c !important;
                box-shadow: none !important;
            }
            .container {
                height: 100%;
            }
            .fixed-navigation nav>ul {
                height:auto;
            }
            ::-webkit-scrollbar {
                width: 10px;
            }
            ::-webkit-scrollbar-track {
                -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
                border-radius: 10px;
            }
            ::-webkit-scrollbar-thumb {
                background-color: rgba(181,181,181,0.7);
                border-radius: 10px;
                -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
            }
            h3#logo {
                margin:0px;
            }
            h3#logo img {
                height:48px;
                width:auto;
            }
            .project-context .title-page {
                font-weight:normal;
                color:#fff;
            }
            .project-context .label,
            .project-context .project-selector,
            #header .header-dropdown-list a.dropdown-toggle {
                color :#fff;
            }
            .project-context .label {
                text-shadow:none;
            }
            #header #hide-menu a,
            #header #fullscreen a {
                background-image: none;
                background-color :#fff;
                border:0px;
            }
            #main {
                margin-left:0px !important;
            }
            header #hide-menu {
                display:none;
            }
            .well {
                padding:10px;
            }
        </style>
    </head>
    <body>
        <!-- #HEADER -->
        <header id="header">
            <div id="logo-group">
                <!-- PLACE YOUR LOGO HERE -->
                <h3 id="logo" style="margin-top:4px">
                    <a href="${request._host}/"><img src="${request._host}/static/img/logo.png" alt="" style="height:45px; width:auto;"></a>
                </h3>
                <!-- END LOGO PLACEHOLDER -->
            </div>
            <!-- #PROJECTS: projects dropdown -->
            <div class="project-context hidden-xs">
                <span class="title-page">${request.title}</span>
            </div>
            <!-- end projects dropdown -->
            <!-- #TOGGLE LAYOUT BUTTONS -->
            <!-- pulled right: nav area -->
            <div class="pull-right">
                <div tal:condition="request.user"  class="project-context hidden-xs">
                    <span class="label"><i class="fa fa-sm fa-fw fa-institution"></i> ${request.company}</span>
                    <span tal:condition="request.user" class="project-selector dropdown-toggle" data-toggle="dropdown">Pilih Module <i class="fa fa-angle-down"></i></span>
                    <ul tal:condition="request.user"  class="dropdown-menu">
                        <li tal:repeat="menu request.menus">
                            <a href="${request._host}/${menu}">${request.menus[menu]}</a>
                        </li>
                    </ul>
                </div>
                
                <!-- collapse menu button -->
                <div id="hide-menu" class="btn-header pull-right">
                    <span> <a href="javascript:void(0);" data-action="toggleMenu" title="Collapse Menu"><i class="fa fa-reorder"></i></a> </span>
                </div>
                <!-- end collapse menu -->
                <!-- fullscreen button -->
                <div id="fullscreen" class="btn-header transparent pull-right">
                    <span> <a href="javascript:void(0);" data-action="launchFullscreen" title="Full Screen"><i class="fa fa-arrows-alt"></i></a> </span>
                </div>
                <!-- end fullscreen button -->
                <!-- User info -->
                <ul tal:condition="request.user"  class="header-dropdown-list hidden-xs">
                    <li>
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-lg fa-fw fa-user"></i> <span style="text-transform:capitalize"> ${request.user and request.user.nice_username() or ""} </span> <i class="fa fa-angle-down"></i> </a>
                        <ul class="dropdown-menu pull-right">
                            <li><a style="text-transform:capitalize" href="${request._host}/logout">Logout</a></li>
                            <li><a style="text-transform:capitalize" href="${request._host}/password">Ubah password</a></li>
                            <li tal:condition="request.user.api_key"><a
                                    style="text-transform:capitalize"
                                    href="${request._host}/recreate-api-key">API Key</a></li>
                            <li tal:condition="'core' in request.modules and change_unit(request)"><a style="text-transform:capitalize" href="${request._host}/departemen/chg">Ubah Organisasi</a></li>
                        </ul>
                    </li>
                </ul>
                <!-- end user info -->
            </div>
            <!-- end pulled right: nav area -->
        </header>
        <!-- END HEADER -->
        <!-- Left panel : Navigation area -->
        <!-- Note: This width of the aside area can be adjusted through LESS variables -->
        <!-- <aside metal:define-slot="aside-left"></aside>  -->
        <!-- END NAVIGATION -->
        <!-- MAIN PANEL -->
        <div id="main" role="main">
            <!-- MAIN CONTENT -->
                <div id="content">
                    <!-- Error session flash -->
                    <div tal:condition="request.session.peek_flash()">
                      <div class="alert alert-success" tal:repeat="message request.session.pop_flash()"><i class="fa fa-fw fa-lg fa-check-circle"></i>&nbsp;${message}</div>
                    </div>
                    <div tal:condition="request.session.peek_flash('error')">
                      <div class="alert alert-danger" tal:repeat="message request.session.pop_flash('error')"><i class="fa fa-fw fa-lg fa-times-circle"></i>&nbsp;${message}</div>
                    </div>
                    <!-- Error session flash -->
                    <!-- <div id="errors" name="errors"> -->
                    <div class="alert alert-danger" id="errors" name="errors" style="display:none;">errors</div>
                    <div class="alert alert-success" id="success" name="success" style="display:none;">success</div>
                    <!-- <div id="errors" name="errors"> -->
                    <!-- Global Alert -->
                    <div tal:condition="request.session.peek_flash()">
                        <div class="alert alert-success" tal:repeat="message request.session.pop_flash()">${message}</div>
                    </div>
                    <div tal:condition="request.session.peek_flash('error')">
                        <div class="alert alert-danger" tal:repeat="message request.session.pop_flash('error')">${message}</div>
                    </div>
                    <div>
                        <div class="alert alert-danger" id="errors" name="errors" style="display:none;">errors</div>
                        <div class="alert alert-success" id="success" name="success" style="display:none;">success</div>
                    </div>
                    <!-- End Global Alert -->
                    <!-- SLOT KONTEN -->
                    <div metal:define-slot="content"></div>
                    <!-- END SLOT KONTEN -->
                </div>
            <!-- END MAIN CONTENT -->
        </div>
        <!-- END MAIN PANEL -->
        <!-- JS -->
        <script src="${request._host}/static/v3/js/jquery-2.1.1.min.js"></script>
        <script>
            if (!window.jQuery) {
                document.write('<script src="${request._host}/static/v3/js/libs/jquery-2.1.1.min.js"><\/script>');
            }
        </script>
        <script src="${request._host}/static/v3/js/jquery-ui-1.10.3.min.js"></script>
        <script>
            if (!window.jQuery.ui) {
                document.write('<script src="${request._host}/static/v3/js/libs/jquery-ui-1.10.3.min.js"><\/script>');
            }
        </script>
        <!-- IMPORTANT: APP CONFIG -->
        <script src="${request._host}/static/v3/js/app.config.js"></script>
        <!-- BOOTSTRAP JS -->
        <script src="${request._host}/static/v3/js/bootstrap/bootstrap.min.js"></script>
        <!-- FastClick: For mobile devices -->
        <script src="${request._host}/static/v3/js/plugin/fastclick/fastclick.min.js"></script>
        <!--[if IE 8]>
        <h1>Your browser is out of date, please update your browser by going to www.microsoft.com/download</h1>
        <![endif]-->
        <!-- MAIN APP JS FILE -->
        <script src="${request._host}/static/v3/js/app.min.js"></script>
        <!-- PAGE RELATED PLUGIN(S) -->
        <script src="${request._host}/static/v3/js/plugin/datatables/jquery.dataTables.min.js"></script>
        <script src="${request._host}/static/v3/js/plugin/datatables/dataTables.colVis.min.js"></script>
        <script src="${request._host}/static/v3/js/plugin/datatables/dataTables.tableTools.min.js"></script>
        <script src="${request._host}/static/v3/js/plugin/datatables/dataTables.bootstrap.min.js"></script>
        <script src="${request._host}/static/v3/js/plugin/datatable-responsive/datatables.responsive.min.js"></script>
        <script src="${request._host}/static/v3/js/plugin/bootstrap-datepicker/js/bootstrap-datepicker.min.js"></script>
        <script src="${request._host}/static/v3/js/plugin/bootstrap-timepicker/bootstrap-timepicker.min.js"></script>
        <script src="${request._host}/deform_static/scripts/deform.js"></script>
        <script src="${request._host}/deform_static/scripts/typeahead.min.js"></script>
        <script src="${request._host}/static/v3/js/tools.js"></script>
        <script src="${request._host}/static/v3/js/notification/SmartNotification.min.js"></script>
        <script src="${request._host}/static/v3/js/plugin/masked-input/jquery.maskedinput.min.js"></script>
        <script>
            function showError(msg){
                $("#success").css('display', 'none', 'important');
                $("#errors").css('display', 'box', 'important');
                $("#errors").html("<span class='glyphicon glyphicon-remove'></span> " + msg);
            };
            function showSuccess(msg){
                $("#errors").css('display', 'none', 'important');
                $("#success").css('display', 'box', 'important');
                $("#success").html("<span class='glyphicon glyphicon-ok'></span> " + msg);
            };
            $(document).ready(function() {
                // DO NOT REMOVE : GLOBAL FUNCTIONS!
                pageSetUp();
                /*
                 * PAGE RELATED SCRIPTS
                 */
            });
        </script>
        <metal:js define-slot="js_files"></metal:js>
        <!-- Define Script-->
        <script metal:define-slot="scripts"></script>
        <!-- End isi Script-->
    </body>
</html>