dot-hugo/layouts/partials/banner.html
2022-01-30 11:10:45 +06:00

46 lines
1.5 KiB
HTML

<!-- banner -->
<div class="container section">
<div class="row">
<div class="col-lg-8 text-center mx-auto">
<h1 class="text-white mb-3">
{{ .Site.Params.banner.title | markdownify }}
</h1>
<p class="text-white mb-4">
{{ .Site.Params.banner.subtitle | markdownify }}
</p>
<div class="position-relative">
<input
id="search"
class="form-control"
placeholder="{{ .Site.Params.banner.placeholder }}"
/>
<i class="ti-search search-icon"></i>
<!-- Javascript -->
{{ $currentNode := . }} {{ $currentNode.Scratch.Set "pages" .Site.Pages
}} {{ $pages := ($currentNode.Scratch.Get "pages") }}
<script>
$(function() {
var projects = [
{{ range $pages }}
{
value: "{{ .Title }}",
label: "<p>{{.Plain}}</p>{{range.Params.Keywords}}<p>{{.}}</p>{{end}}",
url:"{{ .Permalink }}"
},
{{ end }}
];
$( "#search" ).autocomplete({
source: projects
})
.data( "ui-autocomplete" )._renderItem = function( ul, item ) {
return $( "<li>" )
.append( "<a href=" + item.url + " + \" &quot;\" + >" + item.value + "</a>" + item.label )
.appendTo( ul );
};
});
</script>
</div>
</div>
</div>
</div>
<!-- /banner -->