From 2eb5220fd2eca0178d6063b0fdc1465f0d87075c Mon Sep 17 00:00:00 2001 From: Chen Yangjian <252317+cyjake@users.noreply.github.com> Date: Fri, 25 Jun 2021 15:34:46 +0800 Subject: [PATCH] docs: switch to 3-column layout if screen is big enough (#121) and make the Table of Contents more accessible --- docs/_layouts/en.html | 10 ++- docs/_layouts/zh.html | 12 ++- docs/assets/css/style.scss | 91 ++++++++++++++++++++++- docs/basics.md | 4 +- docs/index.md | 7 ++ docs/migrations.md | 5 ++ docs/sequelize.md | 6 ++ docs/setup/egg.md | 6 ++ docs/setup/express.md | 5 ++ docs/zh/index.md | 7 +- docs/zh/logging.md | 0 docs/zh/migrations.md | 6 ++ docs/zh/sequelize.md | 6 ++ docs/zh/setup/egg.md | 6 ++ docs/zh/setup/{expresss.md => express.md} | 5 ++ docs/zh/setup/index.md | 7 ++ 16 files changed, 170 insertions(+), 13 deletions(-) create mode 100644 docs/zh/logging.md rename docs/zh/setup/{expresss.md => express.md} (61%) create mode 100644 docs/zh/setup/index.md diff --git a/docs/_layouts/en.html b/docs/_layouts/en.html index 4a84f09a..eb456e68 100644 --- a/docs/_layouts/en.html +++ b/docs/_layouts/en.html @@ -22,12 +22,16 @@
  • Sequelize Adapter
  • + - diff --git a/docs/_layouts/zh.html b/docs/_layouts/zh.html index 4e690d40..9859605f 100644 --- a/docs/_layouts/zh.html +++ b/docs/_layouts/zh.html @@ -11,7 +11,7 @@ 首页 + - diff --git a/docs/assets/css/style.scss b/docs/assets/css/style.scss index c04c6f16..129d4c59 100644 --- a/docs/assets/css/style.scss +++ b/docs/assets/css/style.scss @@ -57,7 +57,6 @@ position: absolute; top: 100%; right: -0.5em; - min-width: 140px; text-align: right; background: #f0f0f0; border: 1px solid #e0e0e0; @@ -66,7 +65,8 @@ li { list-style: none; - padding-left: 0; + padding-left: 0.25em; + white-space: nowrap; } a { @@ -104,7 +104,86 @@ } } -@media(min-width: 1000px) { +@media(min-width: 1400px) { + #header { + position: fixed; + // half the width of container-lg + right: calc(50% + 506px); + top: 26px; + min-width: 200px; + background: none; + border-bottom: none; + + .container-lg { + padding-left: 0 !important; + padding-right: 0 !important; + } + + a.logo { + background: url(/favicon.ico) no-repeat 32px 8px; + background-size: 40px; + display: block; + height: 56px; + padding-left: 84px; + padding-top: 6px; + margin-bottom: 12px; + font-size: 2em; + font-weight: bold; + color: #FF7F61; + } + + a { + padding: 6px 12px 6px 32px; + + &:hover { + background-color: #f0f0f0; + text-decoration: none; + } + } + + nav { + float: none; + + .nav-item { + display: block; + padding: 0; + } + + .dropdown-trigger:hover:after { + display: none; + } + + .dropdown-list { + display: block; + text-align: left; + background: none; + padding: 0; + position: static; + border: none; + + li { + padding-left: 0; + + a { + padding: 6px 12px 6px 60px; + } + } + } + } + } + + #markdown-toc { + position: fixed; + left: calc(50% + 506px); + top: 92px; + bottom: 16px; + overflow: auto; + } + + .no_toc { + display: none; + } + .belongs-to-erd, .has-many-erd, .has-one-erd { @@ -125,3 +204,9 @@ width: 462px; } } + +@media(min-width: 1600px) { + #header { + min-width: 230px; + } +} diff --git a/docs/basics.md b/docs/basics.md index 5e2977b6..36a453ce 100644 --- a/docs/basics.md +++ b/docs/basics.md @@ -163,9 +163,9 @@ const realm = new Realm({ await realm.sync(); ``` -`realm.sync()` not only connects models to database, but also tries to synchronize `Model.attributes` in each model back to database structure automatically to make sure consistency between each other. If your application data changes a log, this practice is not recommended. +`realm.sync()` not only connects models to database, but also tries to synchronize `Model.attributes` in each model back to database structure automatically to make sure consistency between each other. If your application data changes a lot, this practice is not recommended. -Intead, it is recommended only connecting to database but not to synchronize to it. Please use the [migration]({ '/migrations' | relative_url }) feature to change database structure. +In that case, please use the [migrations]({{ '/migrations' | relative_url }}) to change database structure instead. ```js const Realm = require('leoric'); diff --git a/docs/index.md b/docs/index.md index 93b9e03d..9cb92a66 100644 --- a/docs/index.md +++ b/docs/index.md @@ -1,5 +1,6 @@ --- layout: en +title: Intro --- Leoric is an object-relational mapping library for Node.js, with which you can manipulate database like this: @@ -41,6 +42,12 @@ async function() { 本站点提供[中文版本]({{ '/zh' | relative_url }}),猛戳左边了解更多。 +## Table of Contents +{:.no_toc} + +1. Table of Contents +{:toc} + ## Use in Web Frameworks Leoric can be used in many web frameworkds from Node.js community. If you are developing with egg framework, it is highly recommended using the egg-orm plugin: diff --git a/docs/migrations.md b/docs/migrations.md index 7b217fd5..ab4aac4a 100644 --- a/docs/migrations.md +++ b/docs/migrations.md @@ -4,6 +4,11 @@ layout: en Developers can use migrations to manage operations that changes table schema etc. +## Table of Contents +{:.no_toc} + +1. Table of Contents +{:toc} ## What Is A Migration Take following migration for example: diff --git a/docs/sequelize.md b/docs/sequelize.md index b0f446bb..5e9ae8de 100644 --- a/docs/sequelize.md +++ b/docs/sequelize.md @@ -16,6 +16,12 @@ await realm.sync(); When sequelize adapter is active, the model API will behave similarly with the actual [Sequelize Model](https://sequelize.org/master/class/lib/model.js~Model.html). See the content below for detail. +## 目录 +{:.no_toc} + +1. 目录 +{:toc} + ## CRUD: Reading and Writing Data ### Dirty Check diff --git a/docs/setup/egg.md b/docs/setup/egg.md index 00c84328..3b9a3d8c 100644 --- a/docs/setup/egg.md +++ b/docs/setup/egg.md @@ -5,6 +5,12 @@ title: Setup Leoric in Egg Applications To reduce the effort to setup Leoric in Egg applications, a specific Egg plugin called [egg-orm](https://github.com/eggjs/egg-orm) is provided. +## Table of Contents +{:.no_toc} + +1. Table of Contents +{:toc} + ## Install ```bash diff --git a/docs/setup/express.md b/docs/setup/express.md index 37df06aa..3208e3a7 100644 --- a/docs/setup/express.md +++ b/docs/setup/express.md @@ -3,3 +3,8 @@ layout: en title: Setup Leoric in Express ---- +## Table of Contents +{:.no_toc} + +1. Table of Contents +{:toc} diff --git a/docs/zh/index.md b/docs/zh/index.md index cf07f7a0..914d0965 100644 --- a/docs/zh/index.md +++ b/docs/zh/index.md @@ -1,5 +1,6 @@ --- layout: zh +title: 简介 --- Leoric 是一个 Node.js 的关系对象映射库(ORM),使用 Leoric 操作数据库的方式大致如下: @@ -35,7 +36,11 @@ async function() { } ``` -推荐阅读[基本功能](./basics)一文了解更多有关模型声明和数据操作的介绍。除了基础功能,Leoric 还支持[表结构变更](./migrations)、[数据校验](./validations)、[钩子](./hooks)、[关联关系](./associations)、以及[高级查询](./querying)。 +## 目录 +{:.no_toc} + +1. 目录 +{:toc} ## 在 Web 开发框架中使用 diff --git a/docs/zh/logging.md b/docs/zh/logging.md new file mode 100644 index 00000000..e69de29b diff --git a/docs/zh/migrations.md b/docs/zh/migrations.md index 72b899af..0f3bb48b 100644 --- a/docs/zh/migrations.md +++ b/docs/zh/migrations.md @@ -4,6 +4,12 @@ layout: zh Leoric 提供迁移任务来帮助开发者完成日常工作中的表结构变更与数据迁移。 +## 目录 +{:.no_toc} + +1. 目录 +{:toc} + ## 什么是迁移任务 以下面这个迁移任务为例: diff --git a/docs/zh/sequelize.md b/docs/zh/sequelize.md index 291d7235..effdeea0 100644 --- a/docs/zh/sequelize.md +++ b/docs/zh/sequelize.md @@ -16,6 +16,12 @@ await realm.sync(); 开启 Sequelize 适配器之后,数据模型的 API 将和 [Sequelize Model](https://sequelize.org/master/class/lib/model.js~Model.html) 基本保持一致,具体异同见下文。 +## 目录 +{:.no_toc} + +1. 目录 +{:toc} + ## 读取与写入数据 ### 脏检查 diff --git a/docs/zh/setup/egg.md b/docs/zh/setup/egg.md index 86165e35..5a3640bc 100644 --- a/docs/zh/setup/egg.md +++ b/docs/zh/setup/egg.md @@ -5,6 +5,12 @@ title: 在 Egg 应用中使用 Leoric 我们为 Egg 准备了专门的插件 [egg-orm](https://github.com/eggjs/egg-orm),使用 egg-orm 即可快速搞定 Egg 应用中的数据模型定义以及消费。 +## 目录 +{:.no_toc} + +1. 目录 +{:toc} + ## 安装 ```bash diff --git a/docs/zh/setup/expresss.md b/docs/zh/setup/express.md similarity index 61% rename from docs/zh/setup/expresss.md rename to docs/zh/setup/express.md index d20b5305..26df6adf 100644 --- a/docs/zh/setup/expresss.md +++ b/docs/zh/setup/express.md @@ -3,3 +3,8 @@ layout: zh title: 在 Express 应用中使用 Leoric --- +## 目录 +{:.no_toc} + +1. 目录 +{:toc} diff --git a/docs/zh/setup/index.md b/docs/zh/setup/index.md new file mode 100644 index 00000000..bc00ab6c --- /dev/null +++ b/docs/zh/setup/index.md @@ -0,0 +1,7 @@ +--- +layout: zh +title: 快速配置 +--- + +- [在 Egg 应用中配置]({{ '/zh/setup/egg' | relative_url }}) +- [在 Express 应用中配置]({{ '/zh/setup/express' | relative_url }})