描述bug
Typeset
组件中的行高有问题。Typeset
组件应该允许提供 lineHeights
属性,该属性将对应于 fontSizes
属性。这样我们就可以创建适当的字体展示(我们需要始终定义 lineHeight 以获得给定的 fontSizes 的最佳外观)。
目前它是基于大小设置的,但存在一个bug(没有 px
后缀,因此默认情况下单位是相对的 - 对于 fontSize
,默认数字是 px
)。
以前它的值被固定为 1
。
926b68f
预期行为
在 Typeset
组件中公开 lineHeights
属性
截图
代码片段
9条答案
按热度按时间lmyy7pcs1#
@jpzwarte 看起来这是在 #12134 中引入的。要不要看一下?
bq3bfh9z2#
@shilman@coderitual 我无法复现这个问题。我的代码是:
<Typeset fontFamily="open-sans" fontSizes={['12px', '14px', '16px']}></Typeset>
结果是:
@coderitual 你是指定了
font-size
没有单位吗?据我所知,这并不是有效的(除非它是百分比)?https://developer.mozilla.org/en-US/docs/Web/CSS/font-sizewlwcrazw3#
在CSS中,
font-size
没有单位是无效的 - 我同意。在React中,你不需要它,因为px
后缀会自动添加到支持该单位的内联属性上 -> https://reactjs.org/docs/dom-elements.html#style我还认为将
line-height
属性设置为与字体大小相同的值从设计Angular 来看是不正确的。最好将其保留为默认值,即normal
(并根据font-family而有所不同)。如果能像设计系统那样暴露出
lineHeights
属性就太棒了,字体大小标记总是定义为一对size
和line-height
。这样设计师就可以为给定的font-size
提供多行文本的最佳字体版本(这被称为垂直节奏 - https://iamsteve.me/blog/entry/a-guide-to-vertical-rhythm)。bkkx9g8r4#
@coderitual 将
line-height
设置为与font-size
相同的值是为了修复这个bug:#12134针对您的问题,一个解决方法是指定一个有效的
font-size
(从CSS的Angular 来看)。您可以提交一个PR,以便自定义
line-height
。就我所知,storybook开发人员对于这类PR非常开放 :)1u4esq0p5#
感谢@jpzwarte :)
8ftvxx2r6#
大家好!最近似乎没有太多关于这个问题的进展。如果还有问题、评论或错误,请随时继续讨论。遗憾的是,我们没有时间处理每一个问题。我们始终欢迎贡献,所以如果你想帮忙,请发送一个pull request。30天后未活跃的问题将被关闭。谢谢!
jyztefdp7#
我们能重新激活这个吗?
gzszwxb48#
期待这次更新。
643ylb089#
这是否仍然是管道中的东西?非常感兴趣!