<ul class="site-header-nav list-unstyled">
    <% loop $Menu(1) %>
        <% if $ClassName == 'VenueContainerPage' %>
            <li>
                <a class="<% if $LinkingMode='current' %>active<% else %>$LinkingMode<% end_if %>" href="$Link?location={$Top.getLocaleID}">$MenuTitle.XML</a>
            </li>
        <% else %>
            <li>
                <a class="<% if $LinkingMode='current' %>active<% else %>$LinkingMode<% end_if %>" href="$Link"><% if $ClassName == 'ShortlistPage' %>$SVG('shortlist-heart').Size('15','12')<% end_if %>$MenuTitle.XML</a>
            </li>
           
        <% end_if %>
    <% end_loop %>
    
                <li class="toolbar-search">
                    <a class="icon-link" href="#" id="header-search-trigger">
                        <span class="open">
                            $SVG('toolbar-search').Size('25','25')
                        </span>
                        <span class="close">
                            $SVG('toolbar-search-close').Size('25','25')
                        </span>
                        <span class="sr-only">Search</span>
                    </a>

                    <div class="header-search" id="header-search-container">
                        <div class="container">
                            <form class="header-search-form" method="get" action="{$ShowPage.Link}">
                                <input class="form-control" name="Search" id="header-search-input" type="text"
                                       placeholder="Search for a show or comedian"/>
                                <button class="header-search-submit btn" id="SearchFormSubmit" type="submit">
                                    $SVG('toolbar-search').Size('25','25')
                                    <span class="sr-only">Search</span>
                                </button>
                                <i id="header-search-loading" class="fa fa-cog fa-spin"></i>
                            </form>
                        </div>
                    </div>
                </li>
                <li class="toolbar-shortlist" style="line-height: unset;">
                <svg id='heart' height="0" width="0">
    <defs>
        <clipPath id="svgPath">
            <path transform="scale(0.8,0.8)" d="M20,35.09,4.55,19.64a8.5,8.5,0,0,1-.13-12l.13-.13a8.72,8.72,0,0,1,12.14,0L20,10.79l3.3-3.3a8.09,8.09,0,0,1,5.83-2.58,8.89,8.89,0,0,1,6.31,2.58,8.5,8.5,0,0,1,.13,12l-.13.13Z"/>
        </clipPath>
    </defs>
</svg>

<div class="heart-container">
   <svg width="25" height="25" viewBox="0 0 25 25" class='heart-stroke'>
      <path transform="scale(0.8,0.8)" d="M20,35.07,4.55,19.62a8.5,8.5,0,0,1-.12-12l.12-.12a8.72,8.72,0,0,1,12.14,0L20,10.77l3.3-3.3A8.09,8.09,0,0,1,29.13,4.9a8.89,8.89,0,0,1,6.31,2.58,8.5,8.5,0,0,1,.12,12l-.12.12ZM10.64,7.13A6.44,6.44,0,0,0,6.07,18.19L20,32.06,33.94,18.12A6.44,6.44,0,0,0,34,9l0,0a6.44,6.44,0,0,0-4.77-1.85A6,6,0,0,0,24.83,9L20,13.78,15.21,9A6.44,6.44,0,0,0,10.64,7.13Z"/>
   </svg>
   
   <a href="/shortlist/" style="vertical-align: text-top;display: block;" class='heart-clip'></a>
</div>
                </li>
              
                <li class="toolbar-calendar">
                    <a class="icon-link" href="#" id="header-calendar-trigger">
                        $SVG('toolbar-calendar').Size('25','25')
                        <span class="sr-only">View calendar</span>
                    </a>

                    <div class="header-calendar" id="header-calendar-container">
                        <div class="header-calendar-title"><strong>$Locale.Title</strong> {$Locale.DateString}</div>
                        <div class="header-calendar-picker" id="HeaderCalendarPicker"
                             data-festivalstart="{$SiteConfig.FestivalStartDate}"
                             data-festivalend="{$SiteConfig.FestivalEndDate}"
                             data-festivalyear="{$SiteConfig.FestivalStartDate.FormatPHP('Y')}">
                            <form method="get" id="HeaderCalendarForm" class="sr-only">
                                <input id="HeaderCalendarFormInput" data-calendar-link="{$ShowPage.Link}?Day="
                                       type="hidden" class="form-control form-date-static"/>
                            </form>
                        </div>
                        <% if $Locale.CalendarDocument %>
                            <div class="header-calendar-download">
                                <a href="{$Locale.CalendarDocument.Link}">Download calendar</a>
                            </div>
                        <% end_if %>
                    </div>
                </li>
</ul>