templates/app/menus.html.twig line 1

Open in your IDE?
  1. {% set current = app.request.attributes.get('_route') %}
  3. {# Styles du nouveau menu #}
  4. {% block stylesheets %}
  5.   <style>
  6.     :root {
  7.       --primary: #3D7299;
  8.       --secondary: #a4286d;
  9.     }
  11.     *, ::before, ::after {
  12.       box-sizing: inherit;
  13.     }
  15.     #navbar-container {
  16.       bottom: 0;
  17.       align-items: center;
  18.       display: flex;
  19.       height: 100vh;
  20.       justify-content: center;
  21.       left: 0;
  22.       padding: 3rem 3rem;
  23.       position: fixed;
  24.       width: 330px;
  25.     }
  27.     #navbar {
  28.       background: #fff;
  29.       border-radius: 20px;
  30.       box-shadow: 15px 15px 10px #00000029;
  31.       display: flex;
  32.       flex-direction: column;
  33.       height: 100%;
  34.       align-items: center;
  35.       color: var(--primary);
  36.       width: 100%;
  37.     }
  39.     header {
  40.       align-items: center;
  41.       display: flex;
  42.       padding: 1.5rem 2rem;
  43.       width: 100%;
  44.     }
  46.     header svg {
  47.       fill: var(--primary);
  48.     }
  50.     header #header-title {
  51.       display: flex;
  52.       flex-direction: column;
  53.       height: 100%;
  54.       justify-content: center;
  55.       margin-left: 1rem;
  56.       position: relative;
  57.     }
  59.     header #header-title #hello {
  60.       font-size: 1.6em;
  61.       font-weight: 400;
  62.     }
  64.     header #header-title #app-version {
  65.       bottom: -5px;
  66.       font-size: .9em;
  67.       font-weight: 100;
  68.       left: 0;
  69.       position: absolute;
  70.     }
  72.     .nav {
  73.       height: 100%;
  74.       padding: 2rem 0;
  75.       width: 100%;
  76.     }
  78.     .nav ul {
  79.       list-style: none;
  80.       display: flex;
  81.       flex-direction: column;
  82.       height: 100%;
  83.       margin: 0;
  84.       padding: 0;
  85.     }
  87.     #nav-item-end {
  88.       margin-top: auto;
  89.     }
  91.     .nav li {
  92.       display: flex;
  93.       flex-direction: column;
  94.       padding: .2rem 2rem;
  95.     }
  97.     .nav li:hover .link-bottom {
  98.       background: var(--secondary);
  99.       width: 100%;
  100.     }
  102.     .nav li .link-bottom {
  103.       background: var(--primary);
  104.       border-radius: 6px;
  105.       height: .2rem;
  106.       transition: .2s linear;
  107.       width: 0;
  108.     }
  110.     .nav li .nav-link {
  111.       color: var(--primary);
  112.       display: flex;
  113.       align-items: center;
  114.       width: 100%;
  115.     }
  117.     .nav li .icon-container {
  118.       align-items: center;
  119.       display: flex;
  120.       height: 50px;
  121.       justify-content: center;
  122.       width: 50px;
  123.     }
  125.     .nav li .nav-icon {
  126.       align-items: center;
  127.       color: var(--primary);
  128.       display: flex;
  129.       font-size: 2.25em;
  130.       justify-content: center;
  131.     }
  133.     .nav li .nav-link-content {
  134.       display: flex;
  135.       align-items: center;
  136.     }
  138.     .nav li .nav-link-content .link-text {
  139.       font-size: 1.1em;
  140.       font-weight: 500;
  141.       margin-left: 1rem;
  142.     }
  144.     .nav li .router-link-active + .link-bottom {
  145.       width: 100%;
  146.     }
  148.     .nav li .router-link-active + .link-bottom:hover {
  149.       color: #065580;
  150.       font-weight: 400;
  151.     }
  153.     #menu-version {
  154.       padding: 0.5rem 2rem 1rem;
  155.       font-size: 0.75em;
  156.       color: #999;
  157.     }
  158.   </style>
  159. {% endblock %}
  161. {% if (is_granted('ROLE_SURVEY')) %}
  163.   {% if app.user.hasGroup('GROUP_LANDLORD') %}
  164.     {% set hasAdministrativeInterface = app.user.organization.isAdminInterfaceVisible %}
  165.     {% set hasPrivateMessage = app.user.organization.hasPrivateMessage %}
  166.     {% set isManager = app.user.isManager %}
  167.     {% set hasIncident = false %}
  168.     {% set hasSocialAd = false %}
  169.     {% set batiConnect = app.user.organization.corporateName | lower == "noralsy" %}
  170.   {% elseif  app.user.hasGroup('GROUP_RESIDENT') %}
  171.     {% set isManager = false %}
  172.     {% set hasAdministrativeInterface = app.user.organization.isAdminInterfaceVisible %}
  173.     {% set hasPrivateMessage = app.user.apartment.entrance.residence.hasPrivateMessage %}
  174.     {% set hasIncident = app.user.apartment.entrance.residence.hasIncident %}
  175.     {% set hasSocialAd = app.user.apartment.entrance.residence.hasSocialAd %}
  176.     {% set batiConnect = false %}
  177.   {% elseif  app.user.hasGroup('GROUP_ADMIN') %}
  178.     {% set hasPrivateMessage = false %}
  179.     {% set hasIncident = false %}
  180.     {% set hasSocialAd = false %}
  181.     {% set isManager = app.user.isManager %}
  182.     {% set batiConnect = false %}
  183.   {% endif %}
  185.   <div id="navbar-container">
  186.     <div id="navbar">
  188.       <header>
  189.         <svg xmlns="http://www.w3.org/2000/svg"
  190.           width="50"
  191.           height="50"
  192.           viewBox="0 0 100 100"
  193.           role="presentation">
  194.           <title id="logo-oecko" lang="en">oecko icon</title>
  195.           <g>
  196.             <path d="M49.52,45.77a3,3,0,1,0,4.29.34,3.05,3.05,0,0,0-4.29-.34Z"/>
  197.             <path d="M74.11,32.28,60.72,73.53a3.48,3.48,0,0,1-6.62,0L47.84,54a3.44,3.44,0,0,0-1.94-2.13L26.66,43.5a3.48,3.48,0,0,1,.66-6.6l42.75-9.1a3.49,3.49,0,0,1,4,4.48ZM40.41,54.36a3,3,0,1,1-.34,4.29,3,3,0,0,1,.34-4.29Zm5.41,13.77L27,72.68a1.55,1.55,0,0,1-1.85-1.94l5.44-18.43a1.54,1.54,0,0,1,2.93-.07l3,8.59a1.54,1.54,0,0,0,.88.92L46,65.2a1.54,1.54,0,0,1-.22,2.93Zm3.44-64A46.5,46.5,0,1,0,95.92,50.45,46.49,46.49,0,0,0,49.26,4.12Z"/>
  198.           </g>
  199.         </svg>
  200.         <div id="header-title">
  201.           <span id="hello">OECKO</span>
  202.           <span id="app-version">βeta</span>
  203.         </div>
  204.       </header>
  206.       <div class="nav">
  207.         <ul>
  208.           <li>
  209.             <a href="{{ path('front_homepage', { _locale: app.request.locale }) }}" class="nav-link {{ current == 'front_homepage' ? "router-link-active" }}">
  210.               <span class="nav-link-content">
  211.                 <div class="icon-container">
  212.                   <span class="material-symbols-outlined nav-icon">home</span>
  213.                 </div>
  214.                 <span class="link-text">{{ 'navbar.home' | trans }}</span>
  215.               </span>
  216.             </a>
  217.             <div class="link-bottom"></div>
  218.           </li>
  219.           {% if (is_granted('ROLE_READ_MESSAGE')) and hasPrivateMessage %}
  220.             <li>
  221.               <a href="{{ path('app_privatemessage_showmessages', { _locale: app.request.locale }) }}" class="nav-link {{ current == 'app_privatemessage_showmessages' ? "router-link-active" }}">
  222.                 <span class="nav-link-content">
  223.                   <div class="icon-container">
  224.                     <span class="material-symbols-outlined nav-icon">message</span>
  225.                   </div>
  226.                   <span class="link-text">{{ 'navbar.messaging' | trans }}</span>
  227.                 </span>
  228.               </a>
  229.               <div class="link-bottom"></div>
  230.             </li>
  231.           {% endif %}
  232.           {% if (is_granted('ROLE_PUBLICMESSAGE')) %}
  233.             <li>
  234.               <a href="{{ path('app_publication_publicationsindex', { _locale: app.request.locale }) }}" class="nav-link {{ current == 'app_publication_publicationsindex' ? "router-link-active" }}">
  235.                 <span class="nav-link-content">
  236.                   <div class="icon-container">
  237.                     <span class="material-symbols-outlined nav-icon">document_scanner</span>
  238.                   </div>
  239.                   <span class="link-text">{{ 'navbar.publications' | trans }}</span>
  240.                 </span>
  241.               </a>
  242.               <div class="link-bottom"></div>
  243.             </li>
  244.           {% endif %}
  245.           {% if (is_granted('ROLE_MODERATOR')) %}
  246.             <li>
  247.               <a href="{{ path('app_moderation_moderation', { _locale: app.request.locale }) }}" class="nav-link {{ current == 'app_moderation_moderation' ? "router-link-active" }}">
  248.                 <span class="nav-link-content">
  249.                   <div class="icon-container">
  250.                     <span class="material-symbols-outlined nav-icon">remove_red_eye</span>
  251.                   </div>
  252.                   <span class="link-text">{{ 'navbar.moderation' | trans }}</span>
  253.                 </span>
  254.               </a>
  255.               <div class="link-bottom"></div>
  256.             </li>
  257.           {% endif %}
  258.           <li>
  259.             <a href="{{ nuxtAppUrl }}/{{ app.request.locale }}/surveys" class="nav-link">
  260.               <span class="nav-link-content">
  261.                 <div class="icon-container">
  262.                   <span class="material-symbols-outlined nav-icon">add_chart</span>
  263.                 </div>
  264.                 <span class="link-text">{{ 'navbar.surveys' | trans }}</span>
  265.               </span>
  266.             </a>
  267.             <div class="link-bottom"></div>
  268.           </li>
  269.           {% if (is_granted('ROLE_USEFULCONTACT_MANAGER')) %}
  270.             <li>
  271.               <a href="{{ path('app_contact_contactmanagement', { _locale: app.request.locale }) }}" class="nav-link {{ current == 'app_contact_contactmanagement' ? "router-link-active" }}">
  272.                 <span class="nav-link-content">
  273.                   <div class="icon-container">
  274.                     <span class="material-symbols-outlined nav-icon">phone_in_talk</span>
  275.                   </div>
  276.                   <span class="link-text">{{ 'navbar.contacts' | trans }}</span>
  277.                 </span>
  278.               </a>
  279.               <div class="link-bottom"></div>
  280.             </li>
  281.           {% endif %}
  282.           {% if is_granted('ROLE_EDIT_RESIDENCE') %}
  283.             <li>
  284.               <a href="{{ path('app_manageproperties_manageproperties', { _locale: app.request.locale }) }}" class="nav-link {{ current == 'app_manageproperties_manageproperties' ? "router-link-active" }}">
  285.                 <span class="nav-link-content">
  286.                   <div class="icon-container">
  287.                     <span class="material-symbols-outlined nav-icon">apartment</span>
  288.                   </div>
  289.                   <span class="link-text">{{ 'navbar.residences' | trans }}</span>
  290.                 </span>
  291.               </a>
  292.               <div class="link-bottom"></div>
  293.             </li>
  294.           {% endif %}
  295.           {% if isManager %}
  296.             <li>
  297.               <a href="{{ path('app_manageaccounts_manageaccounts', { _locale: app.request.locale }) }}" class="nav-link {{ current == 'app_manageaccounts_manageaccounts' ? "router-link-active" }}">
  298.                 <span class="nav-link-content">
  299.                   <div class="icon-container">
  300.                     <span class="material-symbols-outlined nav-icon">supervised_user_circle</span>
  301.                   </div>
  302.                   <span class="link-text">{{ 'navbar.accounts' | trans }}</span>
  303.                 </span>
  304.               </a>
  305.               <div class="link-bottom"></div>
  306.             </li>
  307.           {% endif %}
  308.           <li id="nav-item-end">
  309.             <a href="{{ path('app_logout', { _locale: app.request.locale }) }}" class="nav-link">
  310.               <span class="nav-link-content">
  311.                 <div class="icon-container">
  312.                   <span class="material-symbols-outlined nav-icon">logout</span>
  313.                 </div>
  314.                 <span class="link-text">{{ 'navbar.logout' | trans }}</span>
  315.               </span>
  316.             </a>
  317.             <div class="link-bottom"></div>
  318.           </li>
  319.         </ul>
  320.       </div>
  322.       <div id="menu-version">v{{ config.version }}</div>
  324.     </div>
  325.   </div>
  326. {% else %}
  327.   <a href="#" id="menu-slide-out-btn" data-activates="slide-out" class="button-collapse"><i class="fa fa-bars"></i></a>
  328.   <ul style="height: 100%" id="slide-out" class="side-nav fixed">
  330.     <div id="navbar-header">
  332.       {% set home_url = absolute_url(path('front_homepage')) %}
  333.       {% if app.user %}
  334.         {% if app.user.hasGroup('GROUP_ADMIN') or not app.user.organization.activeInterface or app.user.organization.corporateLogoName == null %}
  335.           <img
  336.             src="{{ asset('app/img/oecko-round-icon.png') }}"
  337.             onclick="document.location.href='{{ home_url }}'"
  338.             alt="Logo Oecko"
  339.           />
  340.           <div id="oecko-clock" class="hide-on-small-only"></div>
  341.         {% else %}
  342.           <img
  343.               id="orga-logo"
  344.               src="{{ medias.getServerUrl(app.user.organization.corporateLogoStorageName) }}"
  345.               onclick="document.location.href='{{ home_url }}'"
  346.               alt="Logo Oecko"/>
  347.           <div id="oecko-clock" class="hide-on-small-only"></div>
  348.         {% endif %}
  349.       {% endif %}
  350.     </div>
  351.     <div id="navbar-scroll-container">
  353.       {% if app.user %}
  354.         {% if app.user.hasGroup('GROUP_LANDLORD') %}
  355.           {% set hasAdministrativeInterface = app.user.organization.isAdminInterfaceVisible %}
  356.           {% set hasPrivateMessage = app.user.organization.hasPrivateMessage %}
  357.           {% set isManager = app.user.isManager %}
  358.           {% set hasIncident = false %}
  359.           {% set hasSocialAd = false %}
  360.           {% set batiConnect = app.user.organization.corporateName | lower == "noralsy" %}
  361.         {% elseif  app.user.hasGroup('GROUP_RESIDENT') %}
  362.           {% set isManager = false %}
  363.           {% set hasAdministrativeInterface = app.user.organization.isAdminInterfaceVisible %}
  364.           {% set hasPrivateMessage = app.user.apartment.entrance.residence.hasPrivateMessage %}
  365.           {% set hasIncident = app.user.apartment.entrance.residence.hasIncident %}
  366.           {% set hasSocialAd = app.user.apartment.entrance.residence.hasSocialAd %}
  367.           {% set batiConnect = false %}
  368.         {% elseif  app.user.hasGroup('GROUP_ADMIN') %}
  369.           {% set hasPrivateMessage = false %}
  370.           {% set hasIncident = false %}
  371.           {% set hasSocialAd = false %}
  372.           {% set isManager = app.user.isManager %}
  373.           {% set batiConnect = false %}
  374.         {% endif %}
  376.         {% if (is_granted('ROLE_READ_MESSAGE')) and hasPrivateMessage %}
  377.           <li>
  378.             {% if app.user.getUnreadMessageNumber() > 0  and app.user.getUnreadMessageNumber()<100 %}
  379.               <div class='pastille'>{{ app.user.getUnreadMessageNumber() }}</div>
  380.             {% elseif app.user.getUnreadMessageNumber()>=100 %}
  381.               <div class='pastille'>99+</div>
  382.             {% endif %}
  383.             <a class="waves-effect waves-light tooltipped {{ current == 'app_privatemessage_showmessages' ? "active" }}"
  384.               href="{{ path('app_privatemessage_showmessages', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50" data-tooltip="Messages">
  385.               <i class="fa fa-envelope"></i>
  386.             </a>
  388.           </li>
  389.         {% endif %}
  391.         {% if (is_granted('ROLE_PUBLICMESSAGE')) %}
  392.           <li>
  393.             <a class="waves-effect waves-light tooltipped {{ current == 'app_publication_publicationsindex' ? "active" }}"
  394.               href="{{ path('app_publication_publicationsindex', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50"
  395.               data-tooltip="Gérer les publications">
  396.               <i class="fa fa-pencil-square-o"></i>
  397.             </a>
  398.           </li>
  399.         {% endif %}
  401.         {% if (is_granted('ROLE_SURVEY')) %}
  402.           <li>
  403.             <a class="waves-effect waves-light tooltipped"
  404.               href="{{ nuxtAppUrl }}/{{ app.request.locale }}/surveys" data-position="right" data-delay="50"
  405.               data-tooltip="Gérer les enquêtes">
  406.               <i class="fa fa-question"></i>
  407.             </a>
  408.           </li>
  409.         {% endif %}
  410.         {% if (is_granted('ROLE_MODERATOR')) %}
  411.           <li>
  412.             <a class="waves-effect waves-light tooltipped {{ current == 'app_moderation_moderation' ? "active" }}"
  413.               href="{{ path('app_moderation_moderation', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50"
  414.               data-tooltip="Espace de modération">
  415.               <i class="fa fa-eye-slash"></i>
  416.             </a>
  417.           </li>
  418.         {% endif %}
  420.         {% if isManager %}
  421.           <li>
  422.             <a class="waves-effect waves-light tooltipped {{ current == 'app_manageaccounts_manageaccounts' ? "active" }}"
  423.               href="{{ path('app_manageaccounts_manageaccounts', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50"
  424.               data-tooltip="Gestion des comptes">
  425.               <i class="fa fa-users"></i>
  426.             </a>
  427.           </li>
  428.         {% endif %}
  430.         {% if is_granted('ROLE_EDIT_RESIDENCE') %}
  431.           <li>
  432.             <a class="waves-effect waves-light tooltipped {{ current == 'app_manageproperties_manageproperties' ? "active" }}"
  433.               href="{{ path('app_manageproperties_manageproperties', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50"
  434.               data-tooltip="Gestion des résidences">
  435.               <i class="fa fa-building-o"></i>
  436.             </a>
  437.           </li>
  438.         {% endif %}
  440.         {% if is_granted('ROLE_USEFULCONTACT_MANAGER') %}
  441.           <li>
  442.             <a class="waves-effect waves-light tooltipped {{ current == 'app_contact_contactmanagement' ? "active" }}"
  443.               href="{{ path('app_contact_contactmanagement', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50"
  444.               data-tooltip="Gestion des résidences">
  445.               <i class="fa fa-phone"></i>
  446.             </a>
  447.           </li>
  448.         {% endif %}
  450.         {% if is_granted('ROLE_MANAGE_THINCLIENT') %}
  451.           <li>
  452.             <a class="waves-effect waves-light tooltipped {{ current == 'app_defaultback_managethinclients' ? "active" }}"
  453.               href="{{ path('app_defaultback_managethinclients', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50"
  454.               data-tooltip="Gestion des écrans">
  455.               <i class="fa fa-tablet"></i>
  456.             </a>
  457.           </li>
  458.         {% endif %}
  460.         {% if is_granted('ROLE_MANAGE_THINCLIENT') %}
  461.           <li>
  462.             <a class="waves-effect waves-light tooltipped {{ current == 'app_defaultback_managethinclients_v2' ? "active" }}"
  463.               href="{{ nuxtAppUrl }}/{{ app.request.locale }}/park" data-position="right" data-delay="50"
  464.               data-tooltip="Gestion des écrans V2">
  465.               V2
  466.             </a>
  467.           </li>
  468.         {% endif %}
  470.         {% if is_granted('ROLE_REPORT_INCIDENT') and hasIncident %}
  471.           <li>
  472.             <a class="waves-effect waves-light tooltipped {{ current == 'app_incident_reportincident' ? "active" }}"
  473.               href="{{ path('app_incident_reportincident', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50"
  474.               data-tooltip="Déclarer un incident">
  475.               <i class="fa fa-bullhorn"></i>
  476.             </a>
  477.           </li>
  478.         {% endif %}
  480.         {% if is_granted('ROLE_SOCIALAD') and hasSocialAd %}
  481.           <li>
  482.             <a class="waves-effect waves-light tooltipped {{ current == 'app_socialad_socialads' ? "active" }}"
  483.               href="{{ path('app_socialad_socialads', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50" data-tooltip="Lien social">
  484.               <i class="fa fa-group"></i>
  485.             </a>
  486.           </li>
  487.         {% endif %}
  489.         {% if hasAdministrativeInterface is defined and hasAdministrativeInterface == true and app.user.hasGroup('GROUP_RESIDENT') %}
  490.           <li>
  491.             <a class="waves-effect waves-light tooltipped {{ current == 'app_documents_documents' ? "active" }}"
  492.               href="{{ path('app_documents_documents', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50" data-tooltip="Lien social">
  493.               <i class="menu-icon material-icons">attach_file</i>
  494.             </a>
  495.           </li>
  496.         {% endif %}
  498.         {% if is_granted('ROLE_SOCIALAD') and hasSocialAd %}
  499.           <li>
  500.             <a class="waves-effect waves-light tooltipped {{ current == 'app_contact_contact' ? "active" }}"
  501.               href="{{ path('app_contact_contact', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50" data-tooltip="Contact">
  502.               <i class="menu-icon material-icons">local_phone </i>
  503.             </a>
  504.           </li>
  505.         {% endif %}
  507.         {% if (is_granted('ROLE_ADD_ADMIN')) %}
  508.           <li>
  509.             <a class="waves-effect waves-light tooltipped {{ current == 'app_managefeatures_managefeaturesindex' ? "active" }}"
  510.               href="{{ path('app_managefeatures_managefeaturesindex', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50"
  511.               data-tooltip="Gestion des fonctionnalités Oecko">
  512.               <i class="fa fa-sliders"></i>
  513.             </a>
  514.           </li>
  516.           <li>
  517.             <a class="waves-effect waves-light tooltipped {{ current == 'app_appsettings_appsettings' ? "active" }}"
  518.               href="{{ path('app_appsettings_appsettings', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50"
  519.               data-tooltip="Paramètres généraux">
  520.               <i class="fa fa-cogs"></i>
  521.             </a>
  522.           </li>
  524.         {% endif %}
  526.     {% if (batiConnect) %}
  527.       <li>
  528.         <a class="baticonnect"
  529.            href="https://www.baticonnect.com/index.php" data-position="right" data-delay="50"
  530.            data-tooltip="Gestion administrative">
  531.            <img
  532.             src="{{ asset('app/img/baticonnect.png') }}"
  533.             alt="Logo Baticonnect"
  534.           />
  535.         </a>
  536.       </li>
  537.     {% endif %}
  539.         <li>
  540.           <a class="waves-effect waves-light tooltipped"
  541.             href="{{ path('app_logout', { _locale:  app.request.locale }) }}" data-position="right" data-delay="50"
  542.             data-tooltip="Se déconnecter">
  543.             <i class="fa fa-sign-out"></i>
  544.           </a>
  545.         </li>
  547.       {% else %}
  548.         <li>
  549.           <a class="waves-effect waves-light tooltipped {{ current == 'app_login' ? "active" }}"
  550.             href="#" data-position="right" data-delay="50"
  551.             data-tooltip="S'identifier">
  552.             <i class="fa fa-lock"></i>
  553.           </a>
  554.         </li>
  556.         <li>
  557.           <a class="waves-effect waves-light tooltipped {{ current == '#' ? "active" }}"
  558.             href="https://oecko.com" data-position="right" data-delay="50" data-tooltip="Découvrez l'application OECKO">
  559.             <i class="fa fa-info-circle"></i>
  560.           </a>
  561.         </li>
  563.       {% endif %}
  565.       <div class="clearer"></div>
  566.     </div>
  567.     <div style="padding: 0.5rem 1rem; font-size: 0.7em; color: #999; margin-top: auto;">v{{ config.version }}</div>
  568.   </ul>
  569. {% endif %}