巴青农资商城

auth.scss 1.8KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. @import '@/styles/morandi.scss';
  2. .auth-page {
  3. height: 100vh;
  4. display: flex;
  5. flex-direction: column;
  6. background: $morandi-bg-page;
  7. }
  8. .auth-hero {
  9. flex-shrink: 0;
  10. min-height: 320rpx;
  11. padding: 80rpx 48rpx 100rpx;
  12. background: linear-gradient(145deg, #3d9b6e 0%, #22c55e 42%, #86efac 100%);
  13. }
  14. .auth-hero__app {
  15. display: block;
  16. font-size: 40rpx;
  17. font-weight: 700;
  18. color: #fff;
  19. }
  20. .auth-hero__welcome {
  21. display: block;
  22. margin-top: 12rpx;
  23. font-size: 28rpx;
  24. color: rgba(255, 255, 255, 0.9);
  25. }
  26. .auth-body {
  27. flex: 1;
  28. margin-top: -60rpx;
  29. padding: 0 32rpx 48rpx;
  30. }
  31. .auth-card {
  32. padding: 40rpx 32rpx 32rpx;
  33. background: #fff;
  34. border-radius: 24rpx;
  35. box-shadow: 0 8rpx 32rpx rgba(46, 125, 50, 0.08);
  36. }
  37. .auth-card__title {
  38. font-size: 36rpx;
  39. font-weight: 600;
  40. color: #333;
  41. }
  42. .auth-card__sub {
  43. display: block;
  44. margin-top: 8rpx;
  45. margin-bottom: 32rpx;
  46. font-size: 24rpx;
  47. color: #999;
  48. }
  49. .auth-closed {
  50. padding: 48rpx 0;
  51. text-align: center;
  52. font-size: 28rpx;
  53. color: #999;
  54. }
  55. .auth-field {
  56. margin-bottom: 24rpx;
  57. }
  58. .auth-field__box {
  59. display: flex;
  60. align-items: center;
  61. height: 88rpx;
  62. padding: 0 24rpx;
  63. background: #f5faf6;
  64. border: 1rpx solid #e0e0e0;
  65. border-radius: 16rpx;
  66. }
  67. .auth-field__input {
  68. flex: 1;
  69. margin-left: 16rpx;
  70. font-size: 28rpx;
  71. color: #333;
  72. }
  73. .auth-field__placeholder {
  74. color: #bbb;
  75. }
  76. .auth-btn {
  77. margin-top: 32rpx;
  78. height: 88rpx;
  79. line-height: 88rpx;
  80. text-align: center;
  81. background: linear-gradient(135deg, #43a047 0%, #2e7d32 100%);
  82. border-radius: 44rpx;
  83. }
  84. .auth-btn--loading {
  85. opacity: 0.7;
  86. }
  87. .auth-btn__txt {
  88. font-size: 32rpx;
  89. color: #fff;
  90. font-weight: 500;
  91. letter-spacing: 4rpx;
  92. }
  93. .auth-switch {
  94. margin-top: 32rpx;
  95. text-align: center;
  96. font-size: 26rpx;
  97. color: #999;
  98. }
  99. .auth-switch__link {
  100. margin-left: 8rpx;
  101. color: #2e7d32;
  102. }