Sha256: 9ef1ba49d185cf78c1ea2bfe7de6b9c7fde699b372df99b6b59674766ec3978c
Contents?: true
Size: 1.87 KB
Versions: 8
Compression:
Stored size: 1.87 KB
Contents
<!-- feedback form {% comment %}
Generates feedback form.
{% endcomment %} -->
{% if site.data.theme.forms.feedback-form %}
{% assign fform = site.data.theme.forms.feedback-form %}
<style>
.feedback--answer {
display: inline-block;
}
.feedback--response {
display: none;
margin-top: 1em;
}
.feedback--response__visible {
display: block;
}
</style>
<div class="jumbotron col-sm-4">
<i class="icon {{ fform.show.icon }} fa-4x float-right" style="margin-top: .5em;"></i>
<div class="h5">{{ fform.show.name }}</div>
<p class="feedback--question">{{ fform.show.text }}</p>
<form name="feedback" method="POST" data-netlify="true">
{% for opt in fform.send.opts %}
<button type="button" class="btn btn-sm btn-{{opt.color | default:'secondary'}} feedback--answer feedback--answer-{{ opt.slug }}">{{ opt.text }}</button>
{% endfor %}
</form>
</div>
<div class="feedback--response feedback--response-{{ opt.slug }}"></div>
<script>
{% for opt in fform.send.opts %}
const {{opt.slug}}Button = document.querySelector('.feedback--answer-{{opt.slug}}');
const {{opt.slug}}Response = document.querySelector('.feedback--response-{{opt.slug}}');
{% endfor %}
const disableButtons = () => {
{% for opt in fform.send.opts %}
{{opt.slug}}Button.disabled = true;
{% endfor %}
};
const sendFeedback = (value) => {
if (typeof ga !== 'function') return;
const args = {
command: 'send',
hitType: 'event',
category: 'Helpful',
action: 'click',
label: window.location.pathname,
value: value
};
ga(args.command, args.hitType, args.category, args.action, args.label, args.value);
};
{% for opt in fform.send.opts %}
{{opt.slug}}Button.addEventListener('click', () => {
{{opt.slug}}Response.classList.add('feedback--response__visible');
disableButtons();
sendFeedback(1);
});
{% endfor %}
</script>
{% endif %}
Version data entries
8 entries across 8 versions & 2 rubygems