feat(typora): add new theme style - slim

typora/lapis-cv-slim.css

@@ -0,0 +1,270 @@
+/* 
+ *   Typora Theme - LapisCV  /  Author - YiNN (BingyanStudio)
+ *   https://github.com/BingyanStudio/LapisCV
+ */
+
+/* Custom Config */
+
+:root {
+    --text-size: 9.8pt;
+    --line-height: 1.8;
+    --avatar-width: 24mm;
+
+    --text-color: #1f252e;
+    --primary-color: #4870ac;
+    --link-color: #4c91da;
+    --shadow-color: #dae3eac9;
+    --border-color: #dae3ea;
+
+    --h1-size: 26pt;
+    --h2-size: 13pt;
+    --h3-size: 11pt;
+
+    --text-font: 'SourceHanSansCN';
+    --title-font: 'SourceHanSansCN';
+    --link-font: 'JetBrainsMono';
+    --code-font: 'JetBrainsMono';
+}
+
+@media print {
+    @page {
+        margin: 15mm 10mm 0 10mm;
+    }
+}
+
+/* Font Face */
+
+@font-face {
+    font-family: "JetBrainsMono";
+    src: url('lapis-cv/JetBrainsMono-Regular.ttf');
+}
+
+@font-face {
+    font-family: "SourceHanSansCN";
+    src: url('lapis-cv/SourceHanSansCN-Regular.otf');
+}
+
+@font-face {
+    font-family: "SourceHanSansCN";
+    src: url('lapis-cv/SourceHanSansCN-Medium.otf');
+    font-weight: bold;
+}
+
+@font-face {
+    font-family: "LapisCV Icon";
+    font-weight: normal;
+    src: url('lapis-cv/iconfont.ttf?t=1727014108932') format('truetype');
+}
+
+@font-face {
+    font-family: "LapisCV Icon";
+    font-weight: bold;
+    src: url('lapis-cv/iconfont.ttf?t=1727014108932') format('truetype');
+}
+
+@font-face {
+    font-family: "Serif";
+    src: url('lapis-cv/SourceHanSerifEN.otf');
+}
+
+@font-face {
+    font-family: "Serif";
+    font-weight: bold;
+    src: url('lapis-cv/SourceHanSerifEN.otf');
+}
+
+
+/* Global */
+
+#write {
+    max-width: 224mm;
+    text-align: justify;
+    font-size: var(--text-size);
+    line-height: var(--line-height);
+    font-family: "LapisCV Icon", var(--text-font);
+}
+
+@media screen {
+    #write {
+        box-shadow: 0 0 4mm 0 var(--shadow-color);
+        padding-left: 20mm;
+        padding-right: 20mm;
+        padding-top: 18mm;
+    }
+}
+
+/* Title */
+
+#write h1,
+#write h2 {
+    font-family: "LapisCV Icon", "Serif", var(--title-font);
+}
+
+#write h1 {
+    font-weight: normal;
+    font-size: var(--h1-size);
+    line-height: 1.5;
+    padding: 1mm 0 0 0;
+    margin: 1mm;
+}
+
+#write h2 {
+    color: var(--primary-color);
+    font-size: var(--h2-size);
+    border-bottom: 1px solid #a2b6d4;
+    margin-top: 3mm;
+    margin-bottom: 2mm;
+    line-height: 1;
+    padding: 1.2mm 0;
+}
+
+#write h3,
+#write h4,
+#write h5,
+#write h6 {
+    color: black;
+    font-size: var(--h3-size);
+}
+
+#write strong {
+    color: black;
+}
+
+#write h3 a,
+#write h4 a,
+#write h5 a,
+#write h6 a {
+    font-size: var(--h3-size) - 0.5pt;
+}
+
+#write .md-math-block,
+#write .md-rawblock,
+#write h1,
+#write h3,
+#write h4,
+#write h5,
+#write h6,
+#write blockquote,
+#write p {
+    margin-top: 0;
+    margin-bottom: 0;
+}
+
+@media print {
+
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+        page-break-after: avoid;
+    }
+}
+
+
+/* List */
+
+#write ul {
+    list-style-type: '\2022';
+    padding-inline-start: 3mm;
+    padding-inline-end: 1mm;
+}
+
+#write ol {
+    padding-inline-start: 5mm;
+    padding-inline-end: 1mm;
+}
+
+#write ol li {
+    padding-left: 0;
+}
+
+#write ol,
+#write ul {
+    margin-block-start: 0;
+    margin-block-end: 0;
+    margin-inline-start: 0;
+    margin-inline-end: 0;
+}
+
+#write li {
+    padding-left: 1.5mm;
+}
+
+ul ::marker {
+    font-weight: bolder;
+}
+
+ol ::marker {
+    font-weight: normal;
+}
+
+/* Avatar */
+
+#write img[alt="avatar"] {
+    display: block;
+    position: absolute;
+    z-index: 9999;
+    float: right;
+    object-fit: cover;
+    overflow: hidden;
+
+    width: var(--avatar-width);
+    height: var(--avatar-width);
+    border-radius: 50%;
+    border: 2px solid var(--border-color);
+    box-shadow: 0 0 0 3mm var(--bg-color);
+}
+
+#write p:has(img[alt="avatar"]) {
+    height: 0;
+    padding: 0;
+    margin: 0;
+    text-align: center;
+}
+
+#write img[alt="avatar"] {
+    top: 0;
+    right: 1mm;
+}
+
+/* Link */
+
+#write a {
+    color: var(--primary-color);
+    text-decoration: none;
+}
+
+/* Code */
+
+#write code {
+    background-color: var(--bg-color);
+    font-family: var(--code-font);
+}
+
+/* Block Quote */
+
+#write blockquote {
+    line-height: 1.5;
+    padding: 0mm 1mm 2mm 1mm;
+}
+
+#write blockquote a {
+    color: var(--text-color);
+}
+
+/* Horizontal Line */
+
+#write hr {
+    border-top: 2px solid var(--shadow-color);
+    margin: 15mm 0 12mm 0;
+}
+
+@media print {
+    #write hr {
+        page-break-after: always;
+        margin: 0;
+        visibility: hidden;
+    }
+}

typora/template.md

@@ -1,53 +1,62 @@
-# 八爪猫
+<img src="https://avatars.githubusercontent.com/u/583231?v=4" alt="avatar">
 
-> 电话：`(123)456-7890`       邮箱：`[email protected]`
+# 八 爪 猫
 
-<img src="https://avatars.githubusercontent.com/u/583231?v=4" alt="avatar">
+> <span style="color:#4870ac">&#xe60f;</span>  `12345678901`             <span style="color:#4870ac">&#xe7ca;</span>  `[email protected]`    
 
-## 基本信息
+## &#xe638; 基本信息
+
+<div style="display: flex; justify-content: space-between;">
+    <h3>八爪科技大学 - 本科 - 软件工程专业</h3> <span style="text-align: right">2008.02 - 2024.06</span>
+</div>
 
-### 八爪科技大学 - 本科 - 软件工程专业   (2008.02 - 2024.06)
 
 - **曾获奖项：** GitHub 认证八爪编码员，敏捷章鱼实践者
-
 - **校园经历：** 担任 OctoStudio 队长，致力于推动服务于八爪生物的技术创新和项目开发。
 
 **Github：** [github.com/octocat](https://github.com/octocat)   |  **个人博客：** [octocat.github.io](https://octocat.github.io)
 
-## 专业技能
+## &#xecfa; 专业技能
 
 - **熟练掌握多种编程语言，包括 Octolang，OctoScript 等**，对**面向对象**和**函数式编程范式**有很好的理解，专注于编写清晰，高效，可维护的代码。
 - **出色的沟通和语言能力，无论八爪生物抑或来自不同地区的猫**，都能进行有效的团队合作和清晰技术概念沟通。
 - **扎实的软件开发原理，数据结构和算法理解**，熟悉计算机底层原理。
 - **在版本控制方面有丰富的经验**，熟练管理代码库、解决合并冲突，并促进代码审议。
 
-## 工作经验
+## &#xe618; 工作经验
 
 <div style="display: flex; justify-content: space-between;">
     <h3>软件开发实习生 - 八爪科技</h3> <span style="text-align: right">2008.06 - 2008.08</span>
 </div>
+
 - 与软件工程师团队合作，**使用 Octolang 开发数据可视化仪表盘**，为海洋保护工作提供八爪种群趋势的洞察。
 - **参与会议和代码审议，按照敏捷章鱼论交付高质量的软件，在紧迫的截止日期内完成任务。**
 - **协助解决技术问题，展现解决问题的技巧和在快节奏环境下积极主动解决挑战的态度。**为项目需求、架构设计和编码标准的文档撰写做出贡献，促进团队成员间的知识共享和新成员的快速适应。
 
-## 项目经历
+## &#xe635; 项目经历
+
+<div style="display: flex; justify-content: space-between;">
+    <h3>GitFlix</h3> <a href="https://github.com">github.com/octocat/gitflix</a>
+</div>
 
-### GitFlix - [github.com/octocat/gitflix](https://github.com/octocat/gitflix)
 
 - **全栈 Web 应用程序，前端使用 Octo.js，后端使用 OctoScript**，允许用户发现和评价八爪生物主题电影。
 - **实现了一个复杂的推荐算法**，分析八爪生物的偏好和观影历史，为八爪生物跨多个流派提供八爪主题的电影推荐，确保了个性化和吸引人的内容发现。
 - **使用 JSON Web Tokens 和 bcrypt 实现用户身份验证和授权**，用于安全密码哈希。**利用 GitHub Actions 进行持续集成和部署**，确保流畅高效的开发工作流程。
 
-### OctoConnect - [github.com/octocat/octo-connect](https://github.com/octocat/octo-connect)
+<div style="display: flex; justify-content: space-between;">
+    <h3>OctoConnect</h3> <a href="https://github.com">github.com/octocat/gitflix</a>
+</div>
+
 
 - 团队项目，**使用 OctoDB 和 Octolang 创建八爪生物社交平台**。
 - **设计八爪风格的用户个人资料和互动功能**，例如**基于触手的消息传递**和**墨水喷溅反应**，以促进全球八爪生物和猫之间的社区参与。
 - **集成 OAuth 认证，与 GitHub 账户进行同步**，为 Octocat 和其他在 GitHub 上活跃的八爪生物提供无缝登录和个人资料同步。
 
+<div style="display: flex; justify-content: space-between;">
+    <h3>OctoGithubber</h3> <a href="https://github.com">github.com/octocat/gitflix</a>
+</div>
 
-### OctoGitHubber - [github.com/octocat/octo-githubber](https://github.com/octocat/octo-githubber)
 
 - **一款专门针对八爪生物的 GitHub 活动和贡献的网络应用程序**，利用 Octo.js 构建前端，Octolang 构建后端。
-- **与 GitHub API 集成，检索和分析八爪生物的存储库统计信息、提交历史和拉取请求活动**，提供个性化的见解和可视化，深入了解八爪生物的开源之旅。
-- **实现了八爪主题的勋章和成就等游戏化元素**，激励和鼓励八爪生物达成编码里程碑，促进持续学习和改进。
-- **设计了响应式和直观的仪表板界面，具有八爪主题的数据可视化**，使八爪生物能够跟踪进度、设定编码目标，并以有趣和吸引人的方式庆祝成就。
+- **设计了响应式和直观的仪表板界面，具有八爪主题的数据可视化**，使八爪生物能够跟踪进度、设定编码目标。