templates/network/profile/components/tab_navigation_component.html.twig line 1

Open in your IDE?
  1. {% if profile is defined %}
  2.   {% set entity = profile %}
  3.   {% do tab_navigation_add({ name: 'timeline', action: 'timeline' }) %}
  4.   {% do tab_navigation_add({ name: 'achievements', action: 'achievements' }) %}
  5.   {% do tab_navigation_add({ name: 'news', action: 'news' }) %}
  6.   {% do tab_navigation_add({ name: 'network', action: 'network' }) %}
  7.   {# {% do tab_navigation_add({ name: 'references', action: 'references' }) %} #}
  8.   {# {% do tab_navigation_add({ name: 'team', action: 'team' }) %} #}
  10.   {% if
  11.     profile.profiles.racingManagerProfile
  12.       or profile.profiles.ownerProfile
  13.       or profile.profiles.trainerProfile
  14.       or profile.profiles.breederProfile %}
  15.     {% do tab_navigation_add({ name: 'horse-lists', action: 'horse_lists' }) %}
  16.     {# {% do tab_navigation_add({ name: 'horse-events', action: 'horse_events' }) %} #}
  17.   {% endif %}
  19.   {% if profile.profiles.auctionhouseProfile %}
  20.     {% do tab_navigation_add({ name: 'auctions', action: 'auctions' }) %}
  21.   {% endif %}
  23.   {% if profile.profiles.racetrackProfile %}
  24.     {% do tab_navigation_add({ name: 'racedays', action: 'raceday_list' }) %}
  25.   {% endif %}
  26. {% endif %}
  28. <section id="tab_navigation"
  29.   class="{{ profile and profile.color ? '' : 'bg-primary-500' }} mb-4"
  30.   style="background-color: {{ profile and profile.color ? profile.color : '' }};">
  31.   <div class=" sm:flex-wrap sm:container sm:flex hidden w-full gap-4 p-4 {{
  32.     profile and profile.color
  33.       ? ''
  34.       : 'bg-primary-500'
  35.     }}"
  36.     style="background-color: {{ profile and profile.color ? profile.color : '' }};"
  37.     data-controller="tab-navigation">
  38.     {% for item in tab_navigation_get() %}
  39.       {% set highlighted = null %}
  41.       {% if highlightedTab is defined %}
  42.         {% set highlighted = highlightedTab
  43.           == path('profile_tab_navigation_' ~ item.action, { id: entity.id })
  44.         %}
  45.       {% endif %}
  47.       <turbo-frame class="{{ not highlighted ? 'bg-white' }}" target="tab_content">
  48.         <a id="{{ item.name ~ '-' ~ profile.id }}"
  49.           href="{{ path('profile_tab_navigation_' ~ item.action, { id: entity.id }) }}"
  50.           class="{{ highlighted ? 'btn-sm btn btn-white active' : 'btn-sm btn btn-neutral' }} "
  51.           style="{{
  52.           not highlighted
  53.             ? 'color:white;  background-color: rgba(' ~ profile.color.r ~ ',' ~ profile.color.g
  54.               ~ ','
  55.               ~ profile.color.b
  56.               ~ ',0.6'
  57.           }}">
  58.           {{ item.name|trans }}
  59.         </a>
  60.       </turbo-frame>
  61.     {% endfor %}
  62.   </div>
  64.   <div>
  65.     <div class="block sm:hidden sticky top-20 w-screen max-w-full z-1000  {{
  66.       profile and profile.color
  67.         ? ''
  68.         : 'bg-primary-500'
  69.       }} overflow-hidden shadow-md"
  70.       style="background-color: {{ profile and profile.color ? profile.color : '' }};">
  71.       <div data-controller="tab-navigation"
  72.         data-section-navigation-active-class="text-white bg-black"
  73.         data-section-navigation-inactive-class="text-black bg-neutral-200 "
  74.         id="profile-scroll-bar"
  75.         class="relative inline-flex items-center w-screen gap-4 p-3 mx-1 overflow-scroll sm:my-3 snap-x snap-mandatory sm:flex">
  76.         {% for item in tab_navigation_get() %}
  77.           {% set highlighted = null %}
  78.           {% if highlightedTab is defined %}
  79.             {% set highlighted = highlightedTab
  80.               == path('profile_tab_navigation_' ~ item.action, { id: profile.id })
  81.             %}
  82.           {% endif %}
  84.           <turbo-frame class=" w-fit min-w-fit {{ not highlighted ? 'bg-white' }}"
  85.             target="tab_content">
  86.             <a href="{{ path('profile_tab_navigation_' ~ item.action, { id: profile.id }) }}"
  87.               class="flex-none p-3 text-sm font-medium tracking-widest {{
  88.               highlighted
  89.                 ? 'btn-sm btn btn-white active'
  90.                 : 'btn-sm btn btn-neutral inactive'
  91.               }} uppercase  snap-center"
  92.               style="{{
  93.               not highlighted
  94.                 ? 'color:white;  background-color: rgba(' ~ profile.color.r ~ ',' ~ profile.color.g
  95.                   ~ ','
  96.                   ~ profile.color.b
  97.                   ~ ',0.6'
  98.               }}">
  99.               {{ item.name|trans }}
  100.             </a>
  101.           </turbo-frame>
  102.         {% endfor %}
  103.       </div>
  104.     </div>
  105.   </div>
  107.   {# <div class="flex items-center gap-8">
  108.     <div class="hidden md:block">
  109.       {% include 'icons/arrow-right-tail.svg.twig' with { class: 'w-6 rotate-180 ' } %}
  110.     </div>
  111.     <div class="sticky block w-screen max-w-full overflow-hidden top-20 z-1000">
  112.       <div data-controller="tab-navigation"
  113.         data-section-navigation-active-class="text-white bg-black"
  114.         data-section-navigation-inactive-class="text-black bg-neutral-200 "
  115.         id="profile-scroll-bar"
  116.         class="relative inline-flex items-center gap-4 p-3 overflow-scroll sm:my-3 snap-x snap-mandatory sm:flex">
  117.         {% for item in tab_navigation_get() %}
  118.           {% set highlighted = null %}
  119.           {% if highlightedTab is defined %}
  120.             {% set highlighted = highlightedTab
  121.               == path('profile_tab_navigation_' ~ item.action, { id: profile.id })
  122.             %}
  123.           {% endif %}
  125.           <turbo-frame class="py-2 w-fit min-w-fit" target="tab_content">
  126.             <a href="{{ path('profile_tab_navigation_' ~ item.action, { id: profile.id }) }}"
  127.               style="{{ highlighted ? 'color:white; background-color:' ~ profile.color }}"
  128.               class="flex-none p-3 text-sm font-medium tracking-widest {{
  129.               highlighted
  130.                 ? 'btn-primary btn btn-sm active'
  131.                 : 'btn-neutral btn btn-sm inactive'
  132.               }} uppercase  snap-center snap-always">
  133.               {{ item.name|trans }}
  134.             </a>
  135.           </turbo-frame>
  136.         {% endfor %}
  137.       </div>
  138.     </div>
  139.     <div class="hidden md:block">
  140.       {% include 'icons/arrow-right-tail.svg.twig' with { class: 'w-6' } %}
  141.     </div>
  142.   </div> #}
  143. </section>