tab1.page.scss 1.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. .red-envelope {
  2. position: relative;
  3. width: 199px;
  4. height: 120px;
  5. background: linear-gradient(135deg, #ff5c5c 0%, #ff0000 100%);
  6. border-top-left-radius: 30px;
  7. border-top-right-radius: 30px;
  8. color: white;
  9. padding: 10px;
  10. box-sizing: border-box;
  11. }
  12. .red-envelope .top {
  13. font-size: 14px;
  14. font-weight: bold;
  15. margin-bottom: 10px;
  16. }
  17. .red-envelope .avatars {
  18. display: flex;
  19. }
  20. .red-envelope .avatars img {
  21. width: 30px;
  22. height: 30px;
  23. border-radius: 50%;
  24. margin-right: -10px;
  25. }
  26. .red-envelope .right {
  27. font-size: 12px;
  28. }
  29. .button {
  30. position: absolute;
  31. bottom: 10px;
  32. left: 50%;
  33. transform: translateX(-50%);
  34. padding: 5px 10px;
  35. background: white;
  36. color: #ff5c5c;
  37. border: none;
  38. border-radius: 5px;
  39. font-weight: bold;
  40. cursor: pointer;
  41. }
  42. .bottom {
  43. position: absolute;
  44. bottom: 0;
  45. width: 100%;
  46. background: rgba(0, 0, 0, 0.5);
  47. color: white;
  48. padding: 5px;
  49. border-bottom-left-radius: 10px;
  50. border-bottom-right-radius: 10px;
  51. font-size: 12px;
  52. }