rtl.less 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. @import '../../style/themes/index';
  2. @import '../../style/mixins/index';
  3. @skeleton-prefix-cls: ~'@{ant-prefix}-skeleton';
  4. @skeleton-avatar-prefix-cls: ~'@{skeleton-prefix-cls}-avatar';
  5. @skeleton-title-prefix-cls: ~'@{skeleton-prefix-cls}-title';
  6. @skeleton-paragraph-prefix-cls: ~'@{skeleton-prefix-cls}-paragraph';
  7. .@{skeleton-prefix-cls} {
  8. &-rtl {
  9. direction: rtl;
  10. }
  11. &-header {
  12. .@{skeleton-prefix-cls}-rtl & {
  13. padding-right: 0;
  14. padding-left: 16px;
  15. }
  16. }
  17. // With active animation
  18. &.@{skeleton-prefix-cls}-active {
  19. & .@{skeleton-prefix-cls}-content {
  20. .@{skeleton-title-prefix-cls},
  21. .@{skeleton-paragraph-prefix-cls} > li {
  22. .@{skeleton-prefix-cls}-rtl& {
  23. animation-name: ~'@{skeleton-prefix-cls}-loading-rtl';
  24. }
  25. }
  26. }
  27. .@{skeleton-avatar-prefix-cls} {
  28. .@{skeleton-prefix-cls}-rtl& {
  29. animation-name: ~'@{skeleton-prefix-cls}-loading-rtl';
  30. }
  31. }
  32. }
  33. }
  34. @keyframes ~"@{skeleton-prefix-cls}-loading-rtl" {
  35. 0% {
  36. background-position: 0% 50%;
  37. }
  38. 100% {
  39. background-position: 100% 50%;
  40. }
  41. }