Mkdocs (#23)

* create web use mkdocs-material

* change file ./docs/wiki/Study_Git/local_hub.md

* change file docs/index.md docs/wiki/Study_Git/local_hub.md. remove file index.html

* fix file docs/wiki/MSD/MSD_Diffusion-Coefficient_and_calculation.md

* change file mkdocs.yml, add file css/extra.css, change file of VASP/blue_moon

* change file local_hub.md

* change file local_hub.md; add file 恒电势模拟及避坑指南_DFT-基于电子的恒电势数学模型和意义.md

* change file mkdocs.yml

* modified:   docs/index.md; new file:   docs/javascripts/mathjax.js; deleted one png; modified constP based on electron; modified:   mkdocs.yml

* modified:   .github/workflows/ci.yml;modified:   docs/blog/index.md;new file:   docs/icons/*.png; modified:   docs/index.md; modified:   mkdocs.yml; modified: some file in docs/wiki/

* Fixes #11;  new file:   .gitignore; renamed:    docs/blog/posts/LaTeX_with_Docker.md -> docs/blog/LaTeX_with_Docker.md; new file:   docs/blog/hello-world.md; deleted:    docs/blog/posts/hello-world.md;  modified:   mkdocs.yml; not push site/ to github

.gitignore

@@ -0,0 +1 @@
+site/

docs/blog/hello-world.md

@@ -0,0 +1,71 @@
+---
+Titel: Hello world!
+draft: True
+date: 2024-09-07
+---
+
+# Hello world!
+**Let's start together!**
+
+<!-- more -->
+
+## 引言
+
+“Hello World”程序是编程入门的经典示例。无论你学习哪种编程语言，通常都会从这个简单的程序开始。它的目的是让你了解基本的语法和编译运行过程。
+
+## 示例代码
+
+以下是几种常见编程语言的“Hello World”代码示例：
+
+### Python
+
+```python
+print("Hello, World!")
+```
+
+### C
+
+```c
+#include <stdio.h>
+
+int main() {
+    printf("Hello, World!\n");
+    return 0;
+}
+```
+
+### Java
+
+```java
+public class HelloWorld {
+    public static void main(String[] args) {
+        System.out.println("Hello, World!");
+    }
+}
+```
+
+### JavaScript
+
+```javascript
+console.log("Hello, World!");
+```
+
+## 解释
+
+- **Python**: 使用 `print` 函数输出字符串。
+- **C**: 使用 `printf` 函数输出字符串，并包含标准输入输出库 `stdio.h`。
+- **Java**: 定义一个类 `HelloWorld`，在 `main` 方法中使用 `System.out.println` 输出字符串。
+- **JavaScript**: 使用 `console.log` 输出字符串。
+
+## 结论
+
+“Hello World”程序虽然简单，但它是编程学习的重要一步。通过编写这个程序，你可以熟悉编程语言的基本语法和运行环境。
+
+---
+
+希望这个示例对你有帮助！你可以根据自己的需求和风格进行调整和扩展。如果你有任何问题或需要进一步的帮助，请随时告诉我。😊
+
+## References:
+(1) helloworld - 同一个世界，同一行代码. https://www.helloworld.net/.<br>
+(2) Qt5——从零开始的Hello World教程(Qt Creator) - suvvm - 博客园. https://www.cnblogs.com/suvvm/p/10643826.html.<br>
+(3) C语言学习2：Hello World！详解 - CSDN博客. https://blog.csdn.net/JAVADGAVIN/article/details/111212062.

docs/wiki/Study_Git/local_hub.md

@@ -217,6 +217,7 @@ git branch
 ### 6.2 提交远端 <a id ='charpt6.2'></a>
 将本地git的dev分支推送到远程仓库(`git push origin dev`)。这样就不会影响到远程仓库的main分支的代码。
 ### 6.3 同步远端 <a id ='charpt6.3'></a>
+### 6.3 同步远端 <a id ='charpt6.3'></a>
 一种很常见的情况是，远程仓库中的`main`分支有了更新`update`，而我们的`dev`分支相对于init代码也有了更新`feature`，这时候我们需要测试我们的`feature`能否在main分支更新的`update`下工作。这需要将远程仓库的`main`分支的`update`更新同步到本地仓库的`dev`分支。
 #### 6.3.1 远程仓库`main`分支最新的`update`同步到本地仓库的`main`分支
 首先，我们需要切换当前分支`dev`到`main`分支：
@@ -330,6 +331,7 @@ git request-pull 09a9585 https://github.com/Ternity/Ternity.github.io.git mkdocs
 ### 6.5 删除分支 <a id ='charpt6.5'></a>
 当`dev`分支的代码合并到`main`分支后，`dev`分支就没有存在的必要了，可以删除。<br>
 GitHub上有操作为`Delete branch`。这样远程仓库的`dev`分支就被删除了。<br>
+![Delete branch](Delete_branch.png)<br>
 然后本地的`dev`分支也可以删除：
 ```bash
 git checkout main   # 本地分支切换到main

mkdocs.yml

@@ -71,6 +71,9 @@ extra_javascript:
 extra_css:
   - css/extra.css
 
+extra_css:
+  - css/extra.css
+
 nav:
   - Home: index.md
   - MKDocs: 
@@ -93,14 +96,11 @@ nav:
         - wiki/恒电势方法-电荷-极化力场系列/DFT静态-AIMD-Geo-Opt下的恒电势/Norskov关于能垒的恒电势校正思路.md
         - wiki/恒电势方法-电荷-极化力场系列/DFT静态-AIMD-Geo-Opt下的恒电势/恒电势模拟及避坑指南_DFT-基于电子的恒电势数学模型和意义.md
 
-
   - Blog:
     - blog/index.md
-    # - Start: 
-      # - blog/index.md
-    # - Hello World: 
-      # - blog/posts/hello-world.md
-    # - LaTeX with Docker: 
-      # - blog/posts/LaTeX_with_Docker.md
+    - blog/LaTeX_with_Docker.md
+    - blog/hello-world.md
 
 copyright: Copyright © 2024 - 2024 Qinghan Yu
+
+copyright: Copyright © 2024 - 2024 Qinghan Yu