@douyinfe/semi-foundation 2.35.0 → 2.36.0-beta.0

package/typography/typography.scss

@@ -177,49 +177,174 @@ $module: #{$prefix}-typography;
     &-paragraph {
         margin: $spacing-typography_title_paragraph-margin;
     }
+
 }
 
 // ============ Title ============
 h1.#{$module},
 .#{$module}-h1.#{$module} {
     @include font-size-header-1;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title1-fontWeight;
     margin: $spacing-typography_title_h1-margin;
+
+    &.#{$module}-h1-weight-light {
+        font-weight: $font-typography_title1-light-fontWeight;
+    }
+
+    &.#{$module}-h1-weight-regular {
+        font-weight: $font-typography_title1-regular-fontWeight;
+    }
+
+    &.#{$module}-h1-weight-medium {
+        font-weight: $font-typography_title1-medium-fontWeight;
+    }
+
+    &.#{$module}-h1-weight-semibold {
+        font-weight: $font-typography_title1-semibold-fontWeight;
+    }
+
+    &.#{$module}-h1-weight-bold {
+        font-weight: $font-typography_title1-bold-fontWeight;
+    }
+
 }
 
 h2.#{$module},
 .#{$module}-h2.#{$module} {
     @include font-size-header-2;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title2-fontWeight;
     margin: $spacing-typography_title_h2-margin;
+
+    &.#{$module}-h2-weight-light {
+        font-weight: $font-typography_title2-light-fontWeight;
+    }
+
+    &.#{$module}-h2-weight-regular {
+        font-weight: $font-typography_title2-regular-fontWeight;
+    }
+
+    &.#{$module}-h2-weight-medium {
+        font-weight: $font-typography_title2-medium-fontWeight;
+    }
+
+    &.#{$module}-h2-weight-semibold {
+        font-weight: $font-typography_title2-semibold-fontWeight;
+    }
+
+    &.#{$module}-h2-weight-bold {
+        font-weight: $font-typography_title2-bold-fontWeight;
+    }
+
 }
 
 h3.#{$module},
 .#{$module}-h3.#{$module} {
     @include font-size-header-3;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title3-fontWeight;
     margin: $spacing-typography_title_h3-margin;
+
+    &.#{$module}-h3-weight-light {
+        font-weight: $font-typography_title3-light-fontWeight;
+    }
+
+    &.#{$module}-h3-weight-regular {
+        font-weight: $font-typography_title3-regular-fontWeight;
+    }
+
+    &.#{$module}-h3-weight-medium {
+        font-weight: $font-typography_title3-medium-fontWeight;
+    }
+
+    &.#{$module}-h3-weight-semibold {
+        font-weight: $font-typography_title3-semibold-fontWeight;
+    }
+
+    &.#{$module}-h3-weight-bold {
+        font-weight: $font-typography_title3-bold-fontWeight;
+    }
+
 }
 
 h4.#{$module},
 .#{$module}-h4.#{$module} {
     @include font-size-header-4;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title4-fontWeight;
     margin: $spacing-typography_title_h4-margin;
+
+    &.#{$module}-h4-weight-light {
+        font-weight: $font-typography_title4-light-fontWeight;
+    }
+
+    &.#{$module}-h4-weight-regular {
+        font-weight: $font-typography_title4-regular-fontWeight;
+    }
+
+    &.#{$module}-h4-weight-medium {
+        font-weight: $font-typography_title4-medium-fontWeight;
+    }
+
+    &.#{$module}-h4-weight-semibold {
+        font-weight: $font-typography_title4-semibold-fontWeight;
+    }
+
+    &.#{$module}-h4-weight-bold {
+        font-weight: $font-typography_title4-bold-fontWeight;
+    }
 }
 
 h5.#{$module},
 .#{$module}-h5.#{$module} {
     @include font-size-header-5;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title5-fontWeight;
     margin: $spacing-typography_title_h5-margin;
+
+    &.#{$module}-h5-weight-light {
+        font-weight: $font-typography_title5-light-fontWeight;
+    }
+
+    &.#{$module}-h5-weight-regular {
+        font-weight: $font-typography_title5-regular-fontWeight;
+    }
+
+    &.#{$module}-h5-weight-medium {
+        font-weight: $font-typography_title5-medium-fontWeight;
+    }
+
+    &.#{$module}-h5-weight-semibold {
+        font-weight: $font-typography_title5-semibold-fontWeight;
+    }
+
+    &.#{$module}-h5-weight-bold {
+        font-weight: $font-typography_title5-bold-fontWeight;
+    }
 }
 
 h6.#{$module},
 .#{$module}-h6.#{$module} {
     @include font-size-header-6;
-    font-weight: $font-typography_title-fontWeight;
+    font-weight: $font-typography_title6-fontWeight;
     margin: $spacing-typography_title_h6-margin;
+
+    &.#{$module}-h6-weight-light {
+        font-weight: $font-typography_title6-light-fontWeight;
+    }
+
+    &.#{$module}-h6-weight-regular {
+        font-weight: $font-typography_title6-regular-fontWeight;
+    }
+
+    &.#{$module}-h6-weight-medium {
+        font-weight: $font-typography_title6-medium-fontWeight;
+    }
+
+    &.#{$module}-h6-weight-semibold {
+        font-weight: $font-typography_title6-semibold-fontWeight;
+    }
+
+    &.#{$module}-h6-weight-bold {
+        font-weight: $font-typography_title6-bold-fontWeight;
+    }
+
 }
 
 // ============ Paragraph ============

package/typography/variables.scss

@@ -27,6 +27,54 @@ $font-typography_link-fontWeight: $font-weight-bold; // 链接文本字重
 $font-typography_strong-fontWeight: $font-weight-bold; // 强调文本字重
 $font-typography_paragraph_extended-lineHeight: 24px; // 宽松行距段落文本行高
 
+$font-typography_title1-fontWeight: $font-typography_title-fontWeight; // 一级标题文本字重
+$font-typography_title2-fontWeight: $font-typography_title-fontWeight; // 二级标题文本字重
+$font-typography_title3-fontWeight: $font-typography_title-fontWeight; // 三级标题文本字重
+$font-typography_title4-fontWeight: $font-typography_title-fontWeight; // 四级标题文本字重
+$font-typography_title5-fontWeight: $font-typography_title-fontWeight; // 五级标题文本字重
+$font-typography_title6-fontWeight: $font-typography_title-fontWeight; // 六级标题文本字重
+
+
+
+
+$font-typography_title1-light-fontWeight: 200; // 一级标题文本字重 - 细
+$font-typography_title2-light-fontWeight: 200; // 二级标题文本字重 - 细
+$font-typography_title3-light-fontWeight: 200; // 三级标题文本字重 - 细
+$font-typography_title4-light-fontWeight: 200; // 四级标题文本字重 - 细
+$font-typography_title5-light-fontWeight: 200; // 五级标题文本字重 - 细
+$font-typography_title6-light-fontWeight: 200; // 六级标题文本字重 - 细
+
+$font-typography_title1-regular-fontWeight: 400; // 一级标题文本字重 - 正常
+$font-typography_title2-regular-fontWeight: 400; // 二级标题文本字重 - 正常
+$font-typography_title3-regular-fontWeight: 400; // 三级标题文本字重 - 正常
+$font-typography_title4-regular-fontWeight: 400; // 四级标题文本字重 - 正常
+$font-typography_title5-regular-fontWeight: 400; // 五级标题文本字重 - 正常
+$font-typography_title6-regular-fontWeight: 400; // 六级标题文本字重 - 正常
+
+$font-typography_title1-medium-fontWeight: 500; // 一级标题文本字重 - 中等
+$font-typography_title2-medium-fontWeight: 500; // 二级标题文本字重 - 中等
+$font-typography_title3-medium-fontWeight: 500; // 三级标题文本字重 - 中等
+$font-typography_title4-medium-fontWeight: 500; // 四级标题文本字重 - 中等
+$font-typography_title5-medium-fontWeight: 500; // 五级标题文本字重 - 中等
+$font-typography_title6-medium-fontWeight: 500; // 六级标题文本字重 - 中等
+
+$font-typography_title1-semibold-fontWeight: 600; // 一级标题文本字重 - 半粗
+$font-typography_title2-semibold-fontWeight: 600; // 二级标题文本字重 - 半粗
+$font-typography_title3-semibold-fontWeight: 600; // 三级标题文本字重 - 半粗
+$font-typography_title4-semibold-fontWeight: 600; // 三级标题文本字重 - 半粗
+$font-typography_title5-semibold-fontWeight: 600; // 三级标题文本字重 - 半粗
+$font-typography_title6-semibold-fontWeight: 600; // 三级标题文本字重 - 半粗
+
+$font-typography_title1-bold-fontWeight: 700; // 一级标题文本字重 - 粗
+$font-typography_title2-bold-fontWeight: 700; // 二级标题文本字重 - 粗
+$font-typography_title3-bold-fontWeight: 700; // 三级标题文本字重 - 粗
+$font-typography_title4-bold-fontWeight: 700; // 三级标题文本字重 - 粗
+$font-typography_title5-bold-fontWeight: 700; // 三级标题文本字重 - 粗
+$font-typography_title6-bold-fontWeight: 700; // 三级标题文本字重 - 粗
+
+
+
+
 $spacing-typography_iconPrefix-marginRight: 4px; // 带前缀文本图标右侧外边距
 $spacing-typography_expandText-marginLeft: 8px; // 支持展开文本展开按钮左侧外边距
 $spacing-typography_copyIcon-marginLeft: 4px; // 可复制文本复制图标左侧外边距