#if ($currentLocale == 'en')
<div class="kh-subnavigation-heading">
   <p class="normal">Page content</p>
</div>
#if ($heroAnchorLinkButton == 'Ja')
<div class="kh-anchorlink">
#else
<div class="kh-anchorlink kh-anchorlink--full-height">
#end
   <div class="js-toc kh-anchorlink-menu"></div>
   #if ($heroAnchorLinkButton == 'Ja')
   <div class="kh-anchorlink-button--wrapper">
      <button class="kh-button kh-button-anchorlink normal"><span class="kh-button-anchorlink--text">Show more</span><span class="kh-icon--plus--black" aria-hidden="true"></span></button>
   </div>
   #end
</div>

<script>

   svDocReady(function() {

      if ($svjq('.kh-button-anchorlink').length > 0) {
      
         if ($svjq('.kh-hero > div').height() > 1079) {
         	var defaultMenuHeight = 202;
         } else {
         	var defaultMenuHeight = 202;
         }

         $svjq('.kh-button-anchorlink').on("click", function() {
            $svjq(this).toggleClass('kh-button-anchorlink--active');
            $svjq('.kh-subnavigation-monogram').slideToggle();
            $svjq(this).children(':not(.kh-button-anchorlink--text)').toggleClass("kh-icon--plus--black kh-icon--minus--black");
            
            if ($svjq(this).children('.kh-button-anchorlink--text').text() == "Show more") { 
               $svjq(this).children('.kh-button-anchorlink--text').text("Show less"); 
            } else { 
               $svjq(this).children('.kh-button-anchorlink--text').text("Show more"); 
            }; 
            

            var menuList = $svjq(this).parents('.kh-anchorlink').find('.toc-list');
            var menuHeight = menuList[0].scrollHeight;
            var newMenuHeight = 0;

            if ($svjq(this).parents('.kh-anchorlink').hasClass('kh-anchorlink--active')) {
               newMenuHeight = defaultMenuHeight;
               $svjq(this).parents('.kh-anchorlink').removeClass('kh-anchorlink--active');
            } else {
               newMenuHeight = menuHeight;
               $svjq(this).parents('.kh-anchorlink').addClass('kh-anchorlink--active');
            }
            
            $svjq(this).parents('.kh-anchorlink').find('.toc-list').animate({
               "max-height": newMenuHeight
            }, 400);
            
         });
      }
   });

</script>

#else

<div class="kh-subnavigation-heading">
   <p class="normal">Innehåll på sidan</p>
</div>

#if ($heroAnchorLinkButton == 'Ja')
<div class="kh-anchorlink">
#else
<div class="kh-anchorlink kh-anchorlink--full-height">
#end
   <div class="js-toc kh-anchorlink-menu"></div>
   #if ($heroAnchorLinkButton == 'Ja')
   <div class="kh-anchorlink-button--wrapper">
      <button class="kh-button kh-button-anchorlink normal"><span class="kh-button-anchorlink--text">Visa mer</span><span class="kh-icon--plus--black" aria-hidden="true"></span></button>
   </div>
    #end  
</div>

<script>

   svDocReady(function() {

      if ($svjq('.kh-button-anchorlink').length > 0) {
      
         if ($svjq('.kh-hero > div').height() > 1079) {
         	var defaultMenuHeight = 202;
         } else {
         	var defaultMenuHeight = 202;
         }

         $svjq('.kh-button-anchorlink').on("click", function() {
            $svjq(this).toggleClass('kh-button-anchorlink--active');
            $svjq('.kh-subnavigation-monogram').slideToggle();
            $svjq(this).children(':not(.kh-button-anchorlink--text)').toggleClass("kh-icon--plus--black kh-icon--minus--black");
            
            if ($svjq(this).children('.kh-button-anchorlink--text').text() == "Visa mer") { 
               $svjq(this).children('.kh-button-anchorlink--text').text("Visa mindre"); 
            } else { 
               $svjq(this).children('.kh-button-anchorlink--text').text("Visa mer"); 
            }; 
            

            var menuList = $svjq(this).parents('.kh-anchorlink').find('.toc-list');
            var menuHeight = menuList[0].scrollHeight;
            var newMenuHeight = 0;

            if ($svjq(this).parents('.kh-anchorlink').hasClass('kh-anchorlink--active')) {
               newMenuHeight = defaultMenuHeight;
               $svjq(this).parents('.kh-anchorlink').removeClass('kh-anchorlink--active');
            } else {
               newMenuHeight = menuHeight;
               $svjq(this).parents('.kh-anchorlink').addClass('kh-anchorlink--active');
            }
            
            $svjq(this).parents('.kh-anchorlink').find('.toc-list').animate({
               "max-height": newMenuHeight
            }, 400);
            
         });
      }
   });

</script>

#end