login.component.less 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. @import "../../../../src/theme.less";
  2. :host {
  3. width: 100%;
  4. }
  5. .login {
  6. position: absolute; /*兼容chrome39*/
  7. width: 100%; /*兼容chrome39*/
  8. height: 100%;
  9. display: flex;
  10. justify-content: center;
  11. align-items: center;
  12. .loginBox {
  13. flex: 1;
  14. .title {
  15. text-align: center;
  16. margin-bottom: 24px;
  17. font-size: 28px;
  18. color: @primary-color;
  19. img {
  20. height: 48px;
  21. margin-right: 8px;
  22. }
  23. }
  24. .content {
  25. background: url(../../../assets/images/bg_login.png) center no-repeat;
  26. background-size: contain;
  27. display: flex;
  28. justify-content: center;
  29. align-items: center;
  30. .form_wrap {
  31. width: 480px;
  32. height: 400px;
  33. padding: 32px 40px;
  34. background-color: #ffffff;
  35. border-radius: 8px;
  36. border: solid 1px #e5e5e5;
  37. p {
  38. font-size: 24px;
  39. color: #68686b;
  40. text-align: center;
  41. }
  42. .form {
  43. .inp {
  44. height: 52px;
  45. font-size: 16px;
  46. }
  47. .loginBtn {
  48. button {
  49. width: 100%;
  50. height: 52px;
  51. background-color: #8e9d9e;
  52. border-radius: 26px;
  53. border: 1px solid #8e9d9e;
  54. font-size: 20px;
  55. color: #fff;
  56. }
  57. }
  58. }
  59. .tips {
  60. font-size: 12px;
  61. color: #68686b;
  62. margin-top: 24px;
  63. }
  64. }
  65. }
  66. .bottom {
  67. font-size: 12px;
  68. color: @primary-color;
  69. text-align: center;
  70. margin-top: 16px;
  71. display: flex;
  72. align-items: center;
  73. justify-content: center;
  74. a,
  75. strong {
  76. margin-left: 16px;
  77. }
  78. a {
  79. text-decoration: underline;
  80. }
  81. }
  82. }
  83. }