From 5516203e711898ba68e7325be77ba38a9a5b2d64 Mon Sep 17 00:00:00 2001 From: jaywcjlove <398188662@qq.com> Date: Sun, 8 Aug 2021 21:42:42 +0800 Subject: [PATCH] website: update header styles. --- website/src/component/Header/index.module.less | 12 +++++++----- .../src/pages/docs/development/components/README.md | 12 ++++++------ .../src/pages/docs/environment-setup/ios/README.md | 6 +++--- 3 files changed, 16 insertions(+), 14 deletions(-) diff --git a/website/src/component/Header/index.module.less b/website/src/component/Header/index.module.less index 7078e17b9..37d4b9e11 100644 --- a/website/src/component/Header/index.module.less +++ b/website/src/component/Header/index.module.less @@ -20,17 +20,19 @@ .menus { display: flex; a { - border-bottom: transparent solid 2px; transition: all .3s; - margin-top: 5px; color: #333; + border-radius: 3px; + padding: 2px 8px 2px 8px; + display: flex; + align-items: center; } a + a { - margin-left: 16px; + margin-left: 6px; } :global(.active), a:hover { - color: #1890ff; - border-bottom: #1890ff solid 2px; + background: #f0f1f2; + color: #0366d6; } } diff --git a/website/src/pages/docs/development/components/README.md b/website/src/pages/docs/development/components/README.md index 370b638e0..24e08a6bf 100644 --- a/website/src/pages/docs/development/components/README.md +++ b/website/src/pages/docs/development/components/README.md @@ -3,7 +3,7 @@ 当前 [`react-native-uiw`](https://github.com/uiwjs/react-native-uiw) 项目工程，使用 [Yarn](https://classic.yarnpkg.com/lang/en/) & [lerna](https://github.com/lerna/lerna) 构建 `monorepo`，整个里面包含 `example` 示例、`packages` 组件包、`website` 文档网站。 -> `⚠️注意事项:示例依赖不可随意更新` +> 🚧 `注意事项:示例依赖不可随意更新` > 1. 🪲 添加新依赖包，需要配置 [nohoist](https://github.com/uiwjs/react-native-uiw/blob/46f73cf7ca5404184df7fa996a33f821d45cf0e7/package.json#L62-L80)，以解决子包依赖不存在的问题。 > 2. 📦 如果依赖本地包，React Native 示例需要更改 [metro](https://github.com/facebook/metro) 配置 [metro.config.js](https://github.com/uiwjs/react-native-uiw/blob/9a300184608c71615167c517433bb9aed606f0ec/example/examples/metro.config.js#L12) > 3. 🐛Pod 版本请根据项目安装，可以在 `ios/Podfile` 中确定使用那个版本的 `pod` @@ -70,7 +70,7 @@ pod install --repo-update --verbose ``` -> 目前 [react-native@0.64](https://github.com/facebook/react-native) 需要 `pod v1.10.0+` 以上的版本，可以在 `ios/Podfile` 中确定使用那个版本的 `pod`。 +> 🚧 目前 [react-native@0.64](https://github.com/facebook/react-native) 需要 `pod v1.10.0+` 以上的版本，可以在 `ios/Podfile` 中确定使用那个版本的 `pod`。 ### `第 2 步` 启动实时编译包 @@ -106,7 +106,7 @@ yarn run ios 我们通过 [`yarn workspaces`](https://classic.yarnpkg.com/en/docs/workspaces) 这个功能可以减轻 `monorepo` 开发人员的痛苦，并在效率（尽可能多地提升）和可用性之间取得平衡。 -> 如果需要将文档网站和实例运行起来，需要先安装依赖和编译包。使用 [`yarn workspaces`](https://classic.yarnpkg.com/en/docs/workspaces)，组件文档是从 `node_modules` 中加载，需要编译(或监听)输出到 `node_modules` 中。 +> 🚧 如果需要将文档网站和实例运行起来，需要先安装依赖和编译包。使用 [`yarn workspaces`](https://classic.yarnpkg.com/en/docs/workspaces)，组件文档是从 `node_modules` 中加载，需要编译(或监听)输出到 `node_modules` 中。 ### `问题是什么 ？` @@ -115,13 +115,13 @@ yarn run ios 为了减少冗余，大多数包管理器采用某种提升方案，来尽可能多地提取和扁平化所有相关模块到一个集中位置。 在一个独立的项目中，依赖树可以像这样减少： -![](./standalone.svg) +![](./standalone.svg) 使用 `hoist`，我们能够消除重复的 `A@1.0` 和 `B@1.0`，同时保留版本变化 (`B@2.0`) 并保持相同的根 `package-1/node_modules`。 大多数crawlers/loaders/bundlers 可以通过从项目根目录向下遍历 `node_modules` 树来非常有效地定位模块。 然后是 `monorepo` 项目，它引入了一个新的层次结构，不需要通过 `node_modules` 链接。在这样的项目中，模块可能分散在多个位置： -![](./monorepo-2.svg) +![](./monorepo-2.svg) [`yarn workspaces`](https://classic.yarnpkg.com/en/docs/workspaces) 可以通过将模块提升到其父项目的 `node_modules`: `monorepo/node_modules` 来跨子项目/包共享模块。 当考虑到这些包很可能相互依赖（拥有 monorepo 的主要原因）时，这种优化变得更加突出，即更高程度的冗余。 @@ -191,7 +191,7 @@ module.exports = { }; ``` -> 注意：虽然配置模块依赖映射，可以隐射到具体的模块/包目录中，但是还是会报错，因为模块中的依赖路径导致错误。 +> 🚧 注意：虽然配置模块依赖映射，可以隐射到具体的模块/包目录中，但是还是会报错，因为模块中的依赖路径导致错误。 在 TypeScript 任然会出错，将在 [`example/examples/tsconfig.json`](https://github.com/uiwjs/react-native-uiw/blob/fe25f853fcdbe3590c3ac89924bf71326f11c58c/example/examples/tsconfig.json#L40-L44) 中配置，导入重新映射到相对于 `baseUrl` 的查找位置的一系列目录。 diff --git a/website/src/pages/docs/environment-setup/ios/README.md b/website/src/pages/docs/environment-setup/ios/README.md index 8859e4a90..9615d8606 100644 --- a/website/src/pages/docs/environment-setup/ios/README.md +++ b/website/src/pages/docs/environment-setup/ios/README.md @@ -29,14 +29,14 @@ brew install watchman 如果您已经在系统上安装了 Xcode，请确保它是 10 版或更新版本。 -![Xcode](./001.png) +![Xcode](./001.png) ### `在 Xcode 中安装 iOS 模拟器` 要安装模拟器，请打开 `Xcode` > `Preferences...` 并选择 `Components` 选项卡。 选择您要使用的 iOS 相应版本的模拟器。 -![Xcode Preferences Components](./002.png) +![Xcode Preferences Components](./002.png) ### `CocoaPods` @@ -153,7 +153,7 @@ npx react-native run-ios 在您的 `iOS` 模拟器中点击 `⌘R` 以重新加载应用程序并查看您的更改！ -⌘D +![⌘D](./003.png) 您还可以在 `iOS` 模拟器中使用 `⌘D` 或者 `DD` 调出 `Debug` 菜单。如果在真机调试请 `摇一摇` 手机调出菜单。