index.module.less 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. .album {
  2. margin-bottom: 12px;
  3. padding: 10px;
  4. background-color: var(--music-list-item-background-color);
  5. border-radius: 10px;
  6. display: flex;
  7. position: relative;
  8. .albumType {
  9. position: absolute;
  10. left: 10px;
  11. top: 10px;
  12. background: #FE2451;
  13. border-radius: 10px 0px 10px 0px;
  14. font-size: 12px;
  15. padding: 0 6px;
  16. line-height: 20px;
  17. color: #ffffff;
  18. }
  19. .img {
  20. width: 94px;
  21. height: 94px;
  22. margin-right: 18px;
  23. position: relative;
  24. >img,
  25. >div {
  26. position: absolute;
  27. border-radius: 10px;
  28. overflow: hidden;
  29. }
  30. }
  31. .content {
  32. flex: 1;
  33. >h4 {
  34. font-size: 14px;
  35. color: #131415;
  36. line-height: 24px;
  37. }
  38. >p {
  39. margin: 4px 0 6px;
  40. font-size: 12px;
  41. color: #777777;
  42. line-height: 18px;
  43. }
  44. .musicNum {
  45. font-size: 12px;
  46. color: #FE2451;
  47. border-radius: 4px;
  48. border: 1px solid #FE2451;
  49. padding: 1px 6px;
  50. }
  51. }
  52. }
  53. .footer {
  54. margin-top: 11px;
  55. display: flex;
  56. >div {
  57. display: flex;
  58. align-items: center;
  59. justify-content: center;
  60. font-size: 12px;
  61. color: var(--music-list-item-mate-color);
  62. margin-right: 18px;
  63. .icon {
  64. margin-right: 5px;
  65. }
  66. span {
  67. display: block;
  68. margin-top: 1px;
  69. }
  70. }
  71. }