48 lines
		
	
	
		
			1.9 KiB
		
	
	
	
		
			HTML
		
	
	
	
			
		
		
	
	
			48 lines
		
	
	
		
			1.9 KiB
		
	
	
	
		
			HTML
		
	
	
	
{{ if $.Params.header }}
 | 
						|
<div class="swiper-container">
 | 
						|
  <div class="swiper-wrapper">
 | 
						|
  {{ range $.Params.header }}
 | 
						|
    {{ if eq .type "slide" }}
 | 
						|
      {{ $height := .height }}
 | 
						|
      {{ range .slide }}
 | 
						|
        <div class="swiper-slide site-header site-header__align-{{ .align }}" style="background-image: url('{{ .imageSrc | relURL }}'); background-size: {{ .imageSize }};
 | 
						|
    background-repeat: {{ .imageRepeat }}; background-position: {{ .imagePosition }}; height: {{ $height }}px;">
 | 
						|
          {{ $header := . }}
 | 
						|
          {{ if .title }}            
 | 
						|
            {{ range .title }}
 | 
						|
            <div class="site-header__title" style="font-size: {{ $header.titleFontSize }}px; padding: {{ $header.paddingY }}px {{ $header.paddingX }}px;">
 | 
						|
              {{ . }}
 | 
						|
            </div>
 | 
						|
            {{ end }}      
 | 
						|
          {{ end }}
 | 
						|
          {{ if .spaceBetweenTitleSubtitle }}
 | 
						|
            <div style="height: {{ .spaceBetweenTitleSubtitle }}px"></div>
 | 
						|
          {{ end }}
 | 
						|
          {{ if .subtitle }}
 | 
						|
            {{ range .subtitle }} 
 | 
						|
            <div class="site-header__subtitle" style="font-size: {{ $header.subtitleFontSize }}px; padding: {{ $header.paddingY }}px {{ $header.paddingX }}px;">
 | 
						|
              {{ . }}
 | 
						|
            </div>
 | 
						|
            {{ end }}      
 | 
						|
          {{ end }}
 | 
						|
        </div>
 | 
						|
      {{ end }}
 | 
						|
    {{ end }}
 | 
						|
  {{ end }}
 | 
						|
  </div>
 | 
						|
  <div class="swiper-pagination"></div>
 | 
						|
</div>
 | 
						|
{{ end }}
 | 
						|
 | 
						|
{{ $js := .Site.Data.lib.js }}
 | 
						|
{{ $css := .Site.Data.lib.css }}
 | 
						|
 | 
						|
<link rel="stylesheet" href="{{  $css.swiper.url }}" integrity="{{ $css.swiper.sri }}" crossorigin="anonymous">
 | 
						|
<script src="{{ $js.swiper.url }}" integrity="{{ $js.swiper.sri }}" crossorigin="anonymous"></script>
 | 
						|
 | 
						|
<script>
 | 
						|
  {{ $swiper := .Site.Data.swiper }}
 | 
						|
  var options = JSON.parse({{ $swiper | jsonify }});
 | 
						|
 | 
						|
  var mySwiper = new Swiper('.swiper-container', options);
 | 
						|
</script> |