text.scss 1019 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. @use 'sass:map';
  2. @use 'mixins/mixins' as *;
  3. @use 'mixins/var' as *;
  4. @use 'common/var' as *;
  5. @include b(text) {
  6. @include set-component-css-var('text', $text);
  7. }
  8. @include b(text) {
  9. align-self: center;
  10. margin: 0;
  11. padding: 0;
  12. font-size: getCssVar('text', 'font-size');
  13. color: getCssVar('text', 'color');
  14. overflow-wrap: break-word;
  15. @include when(truncated) {
  16. display: inline-block;
  17. max-width: 100%;
  18. text-overflow: ellipsis;
  19. white-space: nowrap;
  20. overflow: hidden;
  21. }
  22. @include when(line-clamp) {
  23. display: -webkit-inline-box;
  24. -webkit-box-orient: vertical;
  25. overflow: hidden;
  26. }
  27. @each $size in (large, default, small) {
  28. @include m($size) {
  29. @include set-css-var-value(
  30. ('text', 'font-size'),
  31. map.get($text-font-size, $size)
  32. );
  33. }
  34. }
  35. @each $type in $types {
  36. &.#{bem('text', '', $type)} {
  37. @include css-var-from-global(('text', 'color'), ('color', $type));
  38. }
  39. }
  40. & > .#{bem('icon')} {
  41. vertical-align: -2px;
  42. }
  43. }