index.less 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. @import '../../app.less';
  2. .module.qa-list {
  3. padding: 30px;
  4. .tabs {
  5. border-bottom: 1px solid #eee;
  6. }
  7. .qa-item {
  8. border-bottom: 1px solid rgba(239, 243, 247, 1);
  9. position: relative;
  10. padding-top: 10px;
  11. .title {
  12. color: #303036;
  13. font-size: 16px;
  14. margin-bottom: 10px;
  15. }
  16. .small-tag {
  17. display: inline-block;
  18. background: rgb(172, 206, 251);
  19. padding: 0 5px;
  20. border-radius: 5px;
  21. color: #fff;
  22. margin-bottom: 5px;
  23. font-size: 10px;
  24. }
  25. .desc {
  26. color: #686872;
  27. font-size: 16px;
  28. margin-bottom: 20px;
  29. overflow: hidden;
  30. }
  31. .icon {
  32. position: absolute;
  33. bottom: -18px;
  34. left: 50%;
  35. transform: translateX(-50%);
  36. display: none;
  37. }
  38. }
  39. .qa-item.more.hide {
  40. .desc {
  41. height: 80px;
  42. background: linear-gradient(360deg, rgba(161, 161, 171, 0) 0%, rgba(104, 104, 114, 1) 100%);
  43. -webkit-background-clip: text;
  44. -webkit-text-fill-color: transparent;
  45. }
  46. }
  47. .qa-item.more:hover {
  48. .icon {
  49. display: block;
  50. }
  51. }
  52. }