通用评论

index.less 1.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. .comment-item-speak-audio-container {
  2. background-color: #f5f5f5;
  3. border: 1px solid rgba(210, 210, 210, 1);
  4. border-radius: 4px;
  5. display: flex;
  6. align-items: center;
  7. height: 100%;
  8. .icon {
  9. cursor: pointer;
  10. width: 28px;
  11. height: 28px;
  12. line-height: 28px;
  13. text-align: center;
  14. border-radius: 14px;
  15. background-color: #fff;
  16. color: #71c135;
  17. margin-left: 12px;
  18. font-size: 14px;
  19. }
  20. .icon-loading {
  21. width: 100%;
  22. height: 100%;
  23. }
  24. .slider {
  25. margin: 0 0 0 16px;
  26. width: 195px;
  27. :global {
  28. .ant-slider-rail {
  29. background-color: #dfdfdf;
  30. }
  31. }
  32. }
  33. .time {
  34. margin-left: 14px;
  35. color: #848484;
  36. font-size: 12px;
  37. }
  38. }
  39. @media screen and (max-width: 616px) and (min-width: 449px) {
  40. .comment-item-speak-audio-container {
  41. .slider {
  42. width: 195px;
  43. }
  44. }
  45. }
  46. @media screen and (max-width: 449px) and (min-width: 365px) {
  47. .comment-item-speak-audio-container {
  48. .slider {
  49. width: 114px;
  50. }
  51. }
  52. }
  53. @media screen and (max-width: 365px) {
  54. .comment-item-speak-audio-container {
  55. .slider {
  56. width: 60px;
  57. }
  58. }
  59. }