<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      lang="en">

    <h:head>
        <f:facet name="first">
            <meta http-equiv="X-UA-Compatible" content="IE=edge" />
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
            <!-- Obsolète : apple-mobile-web-app-capable. Remplacé par mobile-web-app-capable -->
            <meta name="mobile-web-app-capable" content="yes" />
            <link rel="icon" href="#{request.contextPath}/resources/freya-layout/images/favicon.ico" type="image/x-icon"></link>
        </f:facet>
        <title><ui:insert name="title">UnionFlow</ui:insert></title>
        <h:outputScript name="js/layout.js" library="freya-layout" />
        <h:outputScript name="js/prism.js" library="freya-layout"/>
        <ui:insert name="head"/>
    </h:head>

    <h:body styleClass="#{guestPreferences.inputStyleClass}">
        <div class="layout-wrapper layout-topbar-#{guestPreferences.topbarTheme} layout-menu-#{guestPreferences.menuTheme} #{guestPreferences.menuMode}" >
            <ui:include src="/templates/components/layout/topbar.xhtml"/>
           
            <ui:include src="/templates/components/layout/rightpanel.xhtml"/>
            <ui:include src="/templates/components/layout/config.xhtml" />

            <div class="layout-main"> 
                <div class="layout-content">
                    <ui:insert name="content"/>
                </div>
                <ui:include src="/templates/components/layout/footer.xhtml"/>
            </div>
         
            <p:ajaxStatus style="width:32px;height:32px;position:fixed;right:7px;bottom:7px">
                <f:facet name="start">
                    <i class="pi pi-spin pi-spinner ajax-loader" aria-hidden="true"/>
                </f:facet>
     
                <f:facet name="complete">
                    <h:outputText value="" />
                </f:facet>
            </p:ajaxStatus>
            <div class="layout-mask modal-in"></div>
        </div>
        <h:outputStylesheet name="css/primeicons.css" library="freya-layout" />
        <h:outputStylesheet name="css/primeflex.min.css" library="freya-layout" />
        <h:outputStylesheet name="css/layout-#{guestPreferences.layout}.css" library="freya-layout" />
        <h:outputStylesheet name="primefaces-freya-#{guestPreferences.componentTheme}/theme.css" />
    </h:body>

</html>