feat: 评论添加模态对话框

static/styles/docx/article.css

@@ -10,3 +10,8 @@
     color: black;
     text-decoration: none;
 }
+
+#CommentModal div {
+    background-color: white;
+    border-radius: 10px;
+}

templates/docx/article.html

@@ -34,7 +34,26 @@
                         <form action="{{ url_for('docx.comment_page', blog=article.blog_id) }}" method="post">
                             {{ form.hidden_tag() }}
                             {{ form.context(class="form-control mb-2", rows="3") }}
-                            {{ form.submit(class="btn btn-info mb-2", value="评论") }}
+
+
+                            <div id="CommentModal" class="modal fade" role="dialog" aria-hidden="true">
+                                <div class="modal-dialog">
+                                    <div class="modal-content text-left">
+                                        <div class="modal-header">
+                                            <h4 class="modal-title" id="CommentModalLabel"> 确认评论？ </h4>
+                                        </div>
+                                        <div class="modal-body">
+                                            <p> 是否确认评论？请注意网络用语文明。 </p>
+                                        </div>
+                                        <div class="modal-footer">
+                                            {{ form.submit(class="btn btn-info", value="确认") }}
+                                            <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <button type="button" class="btn btn-info mb-2" data-toggle="modal" data-target="#CommentModal"> 评论 </button>
                         </form>
                     </section>
                     <hr>