element-plus icon indicating copy to clipboard operation
element-plus copied to clipboard

[Component] docs 的radio使用的示例有问题

Open Raywh opened this issue 10 months ago • 4 comments

Bug Type: Component

Environment

  • Vue Version: 3.2.37
  • Element Plus Version: 2.9.8
  • Browser / OS: Chrome 135.0.7049.95
  • Build Tool: Vite

Reproduction

Related Component

  • el-radio
  • el-radio-button
  • el-radio-group

Reproduction Link

Element Plus Playground

Steps to reproduce

What is Expected?

属性为 size="large" 的radio 比普通(默认)的大

What is actually happening?

size="large" 没有比普通(默认)的大

Additional comments

案例下源码,是组件的样式有问题 $radio-font-size: () !default; $radio-font-size: map.merge( ( 'large': 14px, 'small': 12px, ), $radio-font-size );

这里large应该是16px

Raywh avatar Apr 21 '25 00:04 Raywh

整个设计体系里 large 和 default 都是 14px,区别是 large 高度是 40px,default 是 32px。

kooriookami avatar Apr 21 '25 01:04 kooriookami

Image 但是你看文档上面,large和default的渲染结果,有什么区别吗?不应该有区分吗?

Raywh avatar Apr 21 '25 02:04 Raywh

行高不一样,在和表单组件搭配使用的时候能保持相同的高度,差异并不体现在字号上。

kooriookami avatar Apr 21 '25 02:04 kooriookami

原代码配置 $radio-font-size: map.merge( ( 'large': 14px, 'default': 14px, 'small': 12px, ), $radio-font-size ); 这样看不出区别,看文档的示例,我就迷糊了

我认为应该有个阶梯状,使用的时候才得看出来 $radio-font-size: map.merge( ( 'large': 16px, 'default': 14px, 'small': 12px, ), $radio-font-size );

Raywh avatar Apr 21 '25 03:04 Raywh