导航系统
Atlassian应用的最新导航系统.
Atlassian的导航由这些基本部分组成:
- 布局定义了导航元素的清晰区域
- 侧向导航菜单创建对动作和链接的一致感觉
- 顶端导航元素为共同特性提供熟悉的点
安装
注:软件包将改名为 @atlaskit/navigation-system 在下一次发布,并将是
已公开出版并出版至npm. 现有 @atlassian/navigation-system 软件包仍将是
可在Atlassian的内部登记册中查阅,但将作折旧。 没有支持
私人软件包正在向前移动 - 您应该迁移到新的 @atlaskit/navigation-system
软件包.
yarn add @atlaskit/navigation-system
使用量
可找到详细的文件和示例使用 这里。 。 。 .
将控件放置在本地面板旁
对于布局外的全局控制,主要 Root 可选择加入
UNSAFE_dangerouslyHoistSlotSizes。 。 PanelLayout 然后发布其已渲染的边框宽度
,使用 localPanelWidthVar 从
@atlaskit/navigation-system/layout/panel-layout数字 :
import type { localPanelWidthVar } from '@atlaskit/navigation-system/layout/panel-layout';
// A type-checked literal keeps static styles compatible with Compiled.
style={{ right: `calc(var(${'--n_localPanelWidth' satisfies typeof localPanelWidthVar}, 0px) + 24px)` }}
数值遵循内线和上线宽度,包括推迟前的CSS限制
调整协调器大小激活 。 当面板平面卸载时将其取出;使用 0px 倒计时
当关闭或水合之前。 只有一个主要根应使全球规模能够上升。 这个
变量用于定位外部控制,而不是用于显示面板大小或坚持首选
宽度。 遗产小组 --rightPanelWidth 合同不变.