chore: update comment system (doocs#2499)

Author: acbin

docs-en/assets/images/hero.jpg

@@ -1,6 +1,6 @@
 ---
 comments: true
-template: index.html
+# template: en/index.html
 hide:
   - navigation
   - toc

docs-en/index.md

@@ -1,6 +1,6 @@
 ---
 comments: true
-template: index.html
+# template: index.html
 hide:
   - navigation
   - toc

docs/assets/images/hero.jpg

@@ -1,3 +1,9 @@
+---
+comments: true
+---
+
+
+
 # [1. 两数之和](https://leetcode.cn/problems/two-sum)
 
 

docs/index.md

@@ -0,0 +1,61 @@
+{% extends "base.html" %}
+
+<!-- Render hero under tabs -->
+{% block tabs %}
+{{ super() }}
+
+<!-- Additional styles for landing page -->
+<style>
+    /* Application header should be static for the landing page */
+    .md-header {
+        position: initial;
+    }
+
+    /* Remove spacing, as we cannot hide it completely */
+    .md-main__inner {
+        margin: 0;
+    }
+
+    /* Hide table of contents */
+    @media screen and (min-width: 60em) {
+        .md-sidebar--secondary {
+            display: none;
+        }
+    }
+
+    /* Hide navigation */
+    @media screen and (min-width: 76.25em) {
+        .md-sidebar--primary {
+            display: none;
+        }
+    }
+</style>
+
+<section class="mdx-container">
+    <div class="md-grid md-typeset">
+        <div class="mdx-hero">
+
+            <!-- Hero image -->
+            <div class="mdx-hero__image">
+                <img src="assets/images/hero.jpg" alt="" width="1659" height="1200" draggable="false">
+            </div>
+
+            <!-- Hero content -->
+            <div class="mdx-hero__content">
+                <h1>LeetCode Wiki</h1>
+                <p>{{ config.site_description }}</p>
+                <a href="{{ page.next_page.url | url }}" title="{{ page.next_page.title | e }}"
+                    class="md-button md-button--primary">
+                    Get Started
+                </a>
+            </div>
+
+            <!-- Comments system -->
+            {% include "partials/comments.html" %}
+        </div>
+    </div>
+
+</section>
+{% endblock %}
+
+{% block content %} {% endblock %}

docs/lc/1.md

@@ -1 +1,61 @@
-{% extends "base.html" %}
+{% extends "base.html" %}
+
+<!-- Render hero under tabs -->
+{% block tabs %}
+{{ super() }}
+
+<!-- Additional styles for landing page -->
+<style>
+    /* Application header should be static for the landing page */
+    .md-header {
+        position: initial;
+    }
+
+    /* Remove spacing, as we cannot hide it completely */
+    .md-main__inner {
+        margin: 0;
+    }
+
+    /* Hide table of contents */
+    @media screen and (min-width: 60em) {
+        .md-sidebar--secondary {
+            display: none;
+        }
+    }
+
+    /* Hide navigation */
+    @media screen and (min-width: 76.25em) {
+        .md-sidebar--primary {
+            display: none;
+        }
+    }
+</style>
+
+<section class="mdx-container">
+    <div class="md-grid md-typeset">
+        <div class="mdx-hero">
+
+            <!-- Hero image -->
+            <div class="mdx-hero__image">
+                <img src="assets/images/hero.jpg" alt="" width="1659" height="1200" draggable="false">
+            </div>
+
+            <!-- Hero content -->
+            <div class="mdx-hero__content">
+                <h1>LeetCode Wiki</h1>
+                <p>{{ config.site_description }}</p>
+                <a href="{{ page.next_page.url | url }}" title="{{ page.next_page.title | e }}"
+                    class="md-button md-button--primary">
+                    开始学习
+                </a>
+            </div>
+
+            <!-- Comments system -->
+            {% include "partials/comments.html" %}
+        </div>
+    </div>
+
+</section>
+{% endblock %}
+
+{% block content %} {% endblock %}

overrides/en/index.html

@@ -20,6 +20,11 @@ <h2 id="__comments">{{ lang.t("meta.comments") }}</h2>
 <script>
     var giscus = document.querySelector("script[src*=giscus]")
 
+    /* Set language on initial load */
+    var lang = document.querySelector("html").lang
+    const dataLang = lang === "en" ? "en" : "zh-CN"
+    giscus.setAttribute("data-lang", dataLang)
+
     /* Set palette on initial load */
     var palette = __md_get("__palette")
     if (palette && typeof palette.color === "object") {