success.css 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. /* 页面背景 */
  2. page {
  3. background-color: #fff;
  4. /* 图3看起来是白色背景,或者非常淡的灰 */
  5. font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Segoe UI, Arial, Roboto, 'PingFang SC', 'miui', 'Hiragino Sans GB', 'Microsoft Yahei', sans-serif;
  6. }
  7. .success-container {
  8. padding: 60rpx 40rpx;
  9. display: flex;
  10. flex-direction: column;
  11. align-items: center;
  12. }
  13. /* 成功图标区域 */
  14. .icon-area {
  15. margin-top: 60rpx;
  16. margin-bottom: 30rpx;
  17. display: flex;
  18. flex-direction: column;
  19. align-items: center;
  20. }
  21. .success-icon {
  22. width: 120rpx;
  23. height: 120rpx;
  24. margin-bottom: 20rpx;
  25. }
  26. .main-title {
  27. font-size: 36rpx;
  28. font-weight: bold;
  29. color: #333;
  30. }
  31. /* 红色提示 */
  32. .sub-tip {
  33. font-size: 26rpx;
  34. color: #FF5722;
  35. /* 红色/橙红色 */
  36. margin-bottom: 60rpx;
  37. text-align: center;
  38. }
  39. /* 信息卡片 */
  40. .info-card {
  41. width: 100%;
  42. background-color: #fff;
  43. border: 2rpx dashed #eee;
  44. /* 虚线边框 */
  45. border-radius: 12rpx;
  46. padding: 40rpx;
  47. box-sizing: border-box;
  48. margin-bottom: 100rpx;
  49. }
  50. .info-item {
  51. display: flex;
  52. margin-bottom: 25rpx;
  53. font-size: 28rpx;
  54. }
  55. .info-item:last-child {
  56. margin-bottom: 0;
  57. }
  58. .label {
  59. min-width: 160rpx;
  60. /* 对齐 */
  61. color: #999;
  62. }
  63. .value {
  64. color: #333;
  65. font-weight: bold;
  66. }
  67. /* 底部按钮 */
  68. .footer-btn {
  69. width: 240rpx;
  70. height: 80rpx;
  71. line-height: 80rpx;
  72. background: linear-gradient(90deg, #FF6F00 0%, #FF5722 100%);
  73. color: #fff;
  74. font-size: 28rpx;
  75. font-weight: bold;
  76. border-radius: 8rpx;
  77. /* 方角带一点圆 */
  78. text-align: center;
  79. margin-top: auto;
  80. }