Initial commit

.gitattributes

@@ -0,0 +1,5 @@
+*.md linguist-detectable=true
+*.html linguist-detectable=false
+*.js linguist-detectable=false
+*.css linguist-detectable=false
+slide/site/* linguist-vendored

.github/workflows/deploy.yml

@@ -0,0 +1,25 @@
+name: Deploy to slides repo
+
+on: push
+
+jobs:
+  deploy:
+    if: ${{ contains(github.event.head_commit.message, '[deploy]') }}
+    runs-on: ubuntu-latest
+    name: copy site folder to slides repo
+
+    steps:
+    - name: Checkout
+      uses: actions/checkout@master
+
+    - name: Push update file to slides repo
+      uses: dmnemec/copy_file_to_another_repo_action@3fe42250d47e0764da9de9939b151b09a26e5857
+      env:
+        API_TOKEN_GITHUB: ${{ secrets.API_TOKEN_GITHUB }}
+      with:
+        source_file: 'slide/site/.'
+        destination_repo: 'jujimeizuo/slides'
+        destination_branch: 'master'
+        destination_folder: 'RevealmdTemplate'
+        user_email: 'fengzetao.zed@foxmail.com'
+        user_name: 'jujimeizuo'

.gitignore

@@ -0,0 +1 @@
+.DS_Store

.vscode/snippets.code-snippets

@@ -0,0 +1,64 @@
+{
+	"Middle Layout": {
+		"scope": "markdown",
+		"prefix": "middle",
+		"body": [
+			"<div class=\"middle center\">",
+			"<div style=\"width: 100%\">",
+			"",
+			"$1",
+			"",
+			"</div>",
+			"</div>",
+			"",
+			"$0"
+		]
+	},
+	"hr": {
+		"scope": "markdown",
+		"prefix": "hr",
+		"body": [
+			"<hr/>",
+			"$0"
+		]
+	},
+	"Three Line Table": {
+		"scope": "markdown",
+		"prefix": "three-line",
+		"body": [
+			"<div class=\"three-line\">",
+			"",
+			"$1",
+			"",
+			"</div>",
+			"",
+			"$0"
+		]	
+	},
+	"Multi-Columns Wrapper": {
+		"scope": "markdown",
+		"prefix": "mul-cols",
+		"body": [
+			"<div class=\"mul-cols\">",
+			"<div class=\"col\">",
+			"",
+			"$1",
+			"",
+			"</div>",
+			"$0",
+			"</div>"
+		]
+	},
+	"Single Column Block": {
+		"scope": "markdown",
+		"prefix": "col",
+		"body": [
+			"<div class=\"col\">",
+			"",
+			"$1",
+			"",
+			"</div>",
+			"$0",
+		]
+	}
+}

README.md

@@ -0,0 +1,65 @@
+# TonyCrane's Slide Template
+
+一个 [reveal-md](https://github.com/webpro/reveal-md) 的简单主题，部分参考了 [jyywiki](https://jyywiki.cn) 的主题。（应该会随着我的使用不断更新）
+
+预览：https://slides.jujimeizuo.cn/RevealmdTemplate
+
+- custom.css：亮色主题，载入即可
+- dark.css：暗色配置，使用需附带在 custom.css 后面
+
+~~对于我这种停留在 html+css 的前端水平，当然是宁可多糊 html 也不愿意写个预处理插件。~~ 在 `.vscode/snippets.code-snippets` 中是一些方便糊 html 的代码片段。
+
+## 构建与部署
+
+<details>
+<summary>旧版指南</summary>
+
+1. 安装 reveal-md
+    ```sh 
+    $ npm install -g reveal-md
+    ```
+2. 在浏览器中实时预览
+    ```sh 
+    $ reveal-md main.md -w
+    ```
+3. 构建静态文件
+    ```sh 
+    $ reveal-md main.md --static site --assets-dir assets
+    ```
+    - 生成 pdf 版：在 url 后面加上 `?print-pdf` 使用浏览器打印
+4. 部署
+    - 很蠢的一个实现，总之就是用 Action 把 site 文件夹中的内容复制到我的另一个私有 repo 中，然后在那个 repo 里部署 GitHub Pages
+    - 构建出 site 文件夹后 commit & push，message 需要以 `[deploy]` 开头
+
+</details>
+
+使用 Makefile 来辅助预览与构建
+
+1. 安装 reveal-md
+    ```sh 
+    $ npm install -g reveal-md
+    ```
+2. 开启本地实时预览
+    ```sh
+    $ make  # or make live
+    ```
+3. 构建静态文件
+    ```sh
+    $ make build
+    ```
+    - 生成 pdf 版：在 url 后面加上 `?print-pdf` 使用浏览器打印
+
+## 用法
+
+和 reveal-js 的快捷键一致，在页面中按下 `?` 可以查看所有快捷键。常用的：
+
+- N / SPACE：下一页
+- P / Shift SPACE：上一页
+- ← / H：翻到左边页面
+- → / L：翻到右边页面
+- ↑ / K：翻到上边页面
+- ↓ / J：翻到下边页面
+- B / .：暂停（黑屏）
+- F：全屏
+- ESC / O：显示概览
+- S：打开演讲者窗口

slide/site/assets/custom.css

@@ -0,0 +1,228 @@
+@import url(https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;600&family=Source+Code+Pro&family=JetBrains+Mono:ital,wght@0,300;0,400;0,600;0,700;1,400;1,700);
+@import url(https://gcore.jsdelivr.net/npm/lxgw-wenkai-screen-webfont@1.1.0/style.css);
+
+:root {
+  --r-main-font: "JetBrains Mono", "LXGW WenKai Screen", sans-serif;
+  --r-heading-font: "JetBrains Mono", "LXGW WenKai Screen", sans-serif;
+  --r-code-font: "JetBrains Mono", "LXGW WenKai Screen", sans-serif;
+}
+
+.reveal .slide-number {
+  font-size: 26px;
+  border-radius: 5px;
+  background-color: rgba(0, 0, 0, .3);
+}
+
+.reveal .slides {
+  border: 1.5px #ddd solid;
+  border-radius: 7px;
+  text-align: left;
+  font-weight: 300;
+}
+
+.reveal section {
+  padding: 20px 0;
+}
+
+.reveal p, .reveal li, .reveal center {
+  font-size: 30px;
+}
+.reveal h1, .reveal h2, .reveal h3, .reveal h4 {
+  font-weight: 700;
+}
+.reveal p, .reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5 {
+  padding:  0 25px 0 25px;
+}
+
+.reveal pre {
+  font-size: 20px;
+  border-radius: 3mm;
+}
+.reveal pre code {
+  max-height: none;
+  border-radius: 3mm;
+  padding: 20px;
+  line-height: 28px;
+}
+.reveal pre code table {
+  font-size: inherit;
+}
+
+.reveal ul {
+  margin: 0 0 0 1.5em
+}
+.reveal ol {
+  margin: 0 0 0 2em;
+}
+.reveal li {
+  margin-top: 10px;
+}
+.reveal li + li {
+  margin-top: 10px;
+}
+.reveal ul {
+  display: block;
+  margin-right: 15px;
+}
+
+.reveal h1,
+.reveal h2,
+.reveal h3,
+.reveal h4,
+.reveal h5,
+.reveal h6 {
+  text-align: left;
+  margin: 0 0 20px 0;
+  color: #222;
+  font-weight: 400;
+  line-height: 1.2;
+  letter-spacing: normal;
+}
+.reveal h1 {
+  margin: 0 10 0 10;
+  font-size: 50px;
+}
+.reveal .middle h1 {
+  text-align: center;
+}
+.reveal h2 {
+  font-size: 48px;
+  border-bottom: 2px solid rgb(0, 63, 163);
+  padding-bottom: 20px;
+}
+.reveal h3 { font-size: 1.15em; }
+.reveal h4 { font-size: 1.05em; }
+
+.reveal .center {
+  text-align: center;
+}
+.reveal .middle {
+  height: 660px;
+  display: flex;
+  align-items: center;
+  width: 100%;
+}
+section .center {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.reveal hr {
+  border: 10px solid white;
+}
+.reveal .middle hr {
+  border: 0;
+  height: 2px;
+  background: radial-gradient(ellipse at center,rgba(1, 14, 54, 0.324) 0,hsla(0, 0%, 100%, 0) 75%);
+  margin-bottom: 40px;
+}
+
+.reveal table {
+  font-size: 30px;
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+.three-line {
+  text-align: center;
+}
+.three-line > table {
+  border-top: 1.5pt solid;
+  border-bottom: 1.5pt solid;
+  text-align: center;
+  page-break-inside: avoid;
+  display: inline-table !important;
+}
+.three-line > table > tbody > tr > td {
+  border: none;
+  padding: 7px 15px;
+}
+.three-line > table > tbody > tr {
+  border: none;
+  padding: 7px;
+}
+.three-line > table > thead {
+  border-bottom: 0.75pt solid;
+  font-size: 0.9em;
+}
+.three-line > table th {
+  border: none;
+}
+section > table {
+  border: 1.5pt solid;
+  text-align: center;
+  page-break-inside: avoid;
+}
+section > table > tbody > tr > td {
+  border: 0.75pt solid;
+  padding: 7px;
+}
+section > table > tbody > tr {
+  border: 0.75pt solid;
+  padding: 7px;
+}
+section > table > thead {
+  border: 0.75pt solid;
+  font-size: 0.9em;
+}
+section > table th {
+  border: 0.75px solid;
+}
+
+.reveal .mul-cols {
+  display: flex;
+}
+.reveal .mul-cols .col {
+  width: 100%
+}
+
+html.print-pdf .reveal pre code {
+  font-family: var(--r-code-font) !important;
+}
+
+/**
+ * Modified from https://github.com/sivan/heti
+ */
+
+.reveal heti-spacing {
+  display: inline;
+}
+
+.reveal heti-spacing + sup,
+.reveal heti-spacing + sub {
+  margin-inline-start: 0;
+}
+
+.reveal .heti-spacing {
+  font-size: 0.5em;
+  vertical-align: top;
+}
+
+.reveal .heti-spacing-start {
+  margin-inline-end: 0.25em;
+}
+
+.reveal .heti-spacing-end {
+  margin-inline-start: 0.25em;
+}
+
+.reveal heti-adjacent {
+  display: inline;
+}
+
+.reveal .heti-adjacent-half {
+  margin-inline-end: -0.5em;
+}
+
+.reveal .heti-adjacent-quarter {
+  margin-inline-end: -0.25em;
+}
+
+.reveal .slide-number {
+  left: 8px;
+  right: unset;
+}
+
+.MathJax .math {
+  font-size: 80%;
+}