CSS 重设
ADG 的基础样式表 .
安装
yarn add @atlaskit/css-reset
使用量
查看文档。 。 。 .
独立的滚动条外观
不消耗完整 CSS 重置的产品只能导入统一的滚动条样式:
import '@atlaskit/css-reset/scrollbars.css';
样式表不活动,直到产品添加 data-scrollbar-harmonisation 页:1
文档根。 产品自主特色门评价和属性清理. 音轨总是
透明度;不需要单独的透明属性.
只更改颜色: 拇指使用 color.background.accent.gray.subtle 轨道是
透明,一次设定为 scrollbar-color 在根和继承。 滚动栏大小、能见度
和覆盖行为保持原生状态,所以操作系统偏好如macOS"当滚动时"是
荣誉和申请 当改变。 自定义 WebKit 滚动条缩放因浏览器而未使用
永远不要把它画成覆被。 没有浏览器 scrollbar-color 支持保持本地颜色。 强迫
颜色使用浏览器颜色.
在Chrimium,一个非自动 scrollbar-color 禁用 ::-webkit-scrollbar 样式在同一元素上.
拥有自定义 WebKit 滚动栏的组件应当设置自己的 scrollbar-color,或
scrollbar-color: auto在他们的卷轴容器.
细微的符号在光线模式下与白页表面的相去相近3.24:1 2.85: 1 与 #1F1F21 页面表面的暗模式相对; 升起和上覆的对比度较低 表面 。 统一处理法接受这种对比,但并不主张 无障碍兼容性。 油漆宽度和分配宽度不是目标大小的兼容性 评估.
避免在安全部门改革网页上出现不统一滚动条的闪光
上述属性通常安装在 document.documentElement 运行时间
useScrollbarHarmonisation (单位:千美元)@atlaskit/app-provider/use-scrollbar-harmonisation) (中文(简体) ). 在一个
服务器发送的页面中, 钩子只运行客户端, 因此滚动条会短暂地不协调
直到效应起火。 生产的产品 <html> 从服务器侧模板可以调用
getScrollbarHarmonisationHtmlAttrs
(单位:千美元)@atlaskit/app-provider/get-scrollbar-harmonisation-html-attrs并将其结果传播到
服务器已交付 <html> 元素,因此属性——因此这些CSS规则——存在
从最初的油漆.