index.wxss 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. .pkResult {
  2. width: 100vw;
  3. height: 100vh;
  4. background-color: #2B2859;
  5. overflow: hidden;
  6. }
  7. .pkResult .title {
  8. margin: 85rpx 0rpx 34rpx;
  9. color: white;
  10. text-align: center;
  11. font-size: 46rpx;
  12. }
  13. .pkResult .time {
  14. font-size: 34rpx;
  15. text-align: center;
  16. color: white;
  17. }
  18. .pkResult .body {
  19. position: relative;
  20. width: 720rpx;
  21. height: 640rpx;
  22. margin: 60rpx auto;
  23. background-image: radial-gradient(50% 102%, #5171BD 1%, #21287A 100%);
  24. box-shadow: 0 4rpx 10rpx 0 rgba(0, 0, 0, 0.3), inset 0 -2rpx 3rpx 0 #052552, inset 0 2rpx 3rpx 0;
  25. border-radius: 20rpx;
  26. }
  27. .pkResult .body .left {
  28. position: absolute;
  29. top: 30rpx;
  30. left: 30rpx;
  31. height: 500rpx;
  32. width: 328rpx;
  33. background: url('http://reader-wx.ai160.com/images/reader/v3/victory.png') no-repeat;
  34. background-size: 100% 100%;
  35. }
  36. .pkResult .body .right {
  37. position: absolute;
  38. top: 70rpx;
  39. right: 30rpx;
  40. height: 500rpx;
  41. width: 328rpx;
  42. background: url('http://reader-wx.ai160.com/images/reader/v3/defeated.png') no-repeat;
  43. background-size: 100% 100%;
  44. }
  45. .pkResult .body .avatar {
  46. position: absolute;
  47. width: 110rpx;
  48. height: 110rpx;
  49. border-radius: 50%;
  50. }
  51. .pkResult .body .avatarL {
  52. top: 64rpx;
  53. left: 110rpx;
  54. }
  55. .pkResult .body .avatarR {
  56. top: 57rpx;
  57. left: 107rpx;
  58. }
  59. .pkResult .footer {
  60. position: fixed;
  61. bottom: 0px;
  62. left: 0px;
  63. width: 100%;
  64. padding: 20rpx 104rpx;
  65. box-sizing: border-box;
  66. background-color: white;
  67. display: flex;
  68. align-items: center;
  69. justify-content: space-between;
  70. }
  71. .pkResult .footer .stBtn {
  72. padding: 16rpx 0rpx;
  73. text-align: center;
  74. border-radius: 50rpx;
  75. width: 220rpx;
  76. font-size: 30rpx;
  77. color: white;
  78. background-color: #66C5FF;
  79. box-shadow: 0 6px 14px 0 rgba(50, 197, 255, 0.65);
  80. }