src/ApplicationBundle/Resources/views/framework/cp_module_layout.html.twig line 1

Open in your IDE?
  1. {#
  2.   framework/cp_module_layout.html.twig
  3.   ══════════════════════════════════════════════════════════════════════════════
  4.   Generic cp-shell MODULE layout (sidebar + topbar + content). One shell for every
  5.   module — a module extends this, sets its identity vars, and fills the blocks.
  7.   A module layout (e.g. @Purchase/layouts/purchase_layout.html.twig) does:
  8.       {% extends '@Application/framework/cp_module_layout.html.twig' %}
  9.       {% set module_brand   = 'Purchasing' %}
  10.       {% set module_context = 'Procure to Pay' %}
  11.       {% set module_icon    = 'shopping_cart' %}
  12.       {% set module_accent  = '#2e7d68' %}       (one hex re-accents the whole module)
  13.       {% set module_accent_hover = '#25624f' %}
  14.       {% set module_accent_dim   = 'rgba(46,125,104,.10)' %}
  15.       (block) sidebar_nav …module nav links… (endblock)
  16.   …and each PAGE extends the module layout and fills the body block.
  18.   Blocks: eyebrow · page_heading · topbar_actions · sidebar_nav · sidebar_footer · body · page_scripts
  19.   NOTE: codecovers_header loads the JS bundles, so proposal.js / approval / selectize
  20.   all keep working inside this shell. This layout is PRESENTATION only.
  21.   ══════════════════════════════════════════════════════════════════════════════
  22. #}
  23. {% include '@Application/codecovers_header.html.twig' %}
  24. {% include '@Application/framework/_cp_tokens.html.twig' %}
  25. {% include '@Application/framework/_cp_shell_css.html.twig' %}
  27. <div class="cp-app cp-scope">
  28. {% include '@Application/framework/_cp_topstrip.html.twig' %}
  29. <div class="cp-shell cp-scope"
  30.      style="--cp-accent:{{ module_accent|default('#1f5673') }};--cp-accent-hover:{{ module_accent_hover|default('#16465f') }};--cp-accent-dim:{{ module_accent_dim|default('rgba(31,86,115,.10)') }};">
  32.   {# ── Global module rail ── #}
  33.   {% include '@Application/framework/_cp_global_rail.html.twig' %}
  35.   {# ── Module sub-nav ── #}
  36.   <aside class="cp-sidebar">
  37.     <div class="cp-sidebar-brand">
  38.       <div class="cp-brand-icon"><i class="material-icons">{{ module_icon|default('widgets') }}</i></div>
  39.       <div class="cp-brand-name">{{ module_brand|default('Module') }}</div>
  40.       {% if module_context is defined and module_context %}<div class="cp-brand-context">{{ module_context }}</div>{% endif %}
  41.     </div>
  42.     <nav class="cp-sidebar-nav">{% block sidebar_nav %}{% endblock %}</nav>
  43.     <div class="cp-sidebar-footer">
  44.       {% block sidebar_footer %}
  45.         <a href="{{ path('dashboard') }}" class="cp-nav-link" style="font-size:12px;">
  46.           <span class="cp-nav-icon"><i class="material-icons" style="font-size:14px">arrow_back</i></span> <span>Back to ERP</span>
  47.         </a>
  48.       {% endblock %}
  49.     </div>
  50.   </aside>
  52.   {# ── Main column ── #}
  53.   <div class="cp-main">
  54.     <header class="cp-topbar">
  55.       <div>
  56.         <div class="cp-eyebrow">{% block eyebrow %}{{ module_brand|default('') }}{% endblock %}</div>
  57.         <h1 class="cp-title">{% block page_heading %}{{ page_title|default('') }}{% endblock %}</h1>
  58.       </div>
  59.       <div class="cp-topbar-actions">{% block topbar_actions %}{% endblock %}</div>
  60.     </header>
  61.     <main class="cp-content">
  62.       {% include '@Application/inc/notification/error_notification.html.twig' %}
  63.       {% include '@Application/inc/notification/success_notification.html.twig' %}
  64.       {% block body %}{% endblock %}
  65.     </main>
  66.   </div>
  68. </div>{# /.cp-shell #}
  69. </div>{# /.cp-app #}
  71. {% include '@Application/footer/footer_js_codecovers.html.twig' %}
  72. {% include '@Application/codecovers_footer.html.twig' %}
  73. {% block page_scripts %}{% endblock %}