<div id="giscus_thread" style="max-width: {{ site.max_width }}; margin: 0 auto;">
  {% if site.giscus.repo %}
    <script>
      let giscusTheme = determineComputedTheme();
      let giscusAttributes = {
        src: 'https://giscus.app/client.js',
        'data-repo': '{{ site.giscus.repo }}',
        'data-repo-id': '{{ site.giscus.repo_id }}',
        'data-category': '{{ site.giscus.category }}',
        'data-category-id': '{{ site.giscus.category_id }}',
        'data-mapping': '{{ site.giscus.mapping }}',
        'data-strict': '{{ site.giscus.strict }}',
        'data-reactions-enabled': '{{ site.giscus.reactions_enabled }}',
        'data-emit-metadata': '{{ site.giscus.emit_metadata }}',
        'data-input-position': '{{ site.giscus.input_position }}',
        'data-theme': giscusTheme,
        'data-lang': '{{ site.giscus.lang }}',
        crossorigin: 'anonymous',
        async: '',
      };

      let giscusScript = document.createElement('script');
      Object.entries(giscusAttributes).forEach(([key, value]) => giscusScript.setAttribute(key, value));
      document.getElementById('giscus_thread').appendChild(giscusScript);
    </script>
    <noscript>Please enable JavaScript to view the <a href="http://giscus.app/?ref_noscript">comments powered by giscus.</a></noscript>
  {% else %}
    {% capture giscus_warning %} > ##### giscus comments misconfigured > Please follow instructions at
  [http://giscus.app](http://giscus.app) and update your giscus configuration. {: .block-danger } {% endcapture %}
    {{ giscus_warning | markdownify }}
  {% endif %}
</div>
