|
|
@@ -1,128 +1,160 @@
|
|
|
-* {
|
|
|
- margin: 0;
|
|
|
- padding: 0; }
|
|
|
-
|
|
|
-html,
|
|
|
-body {
|
|
|
- width: 100%;
|
|
|
- height: 100%; }
|
|
|
-
|
|
|
-body {
|
|
|
- box-sizing: border-box;
|
|
|
- -moz-osx-font-smoothing: grayscale;
|
|
|
- -webkit-font-smoothing: antialiased;
|
|
|
- text-rendering: optimizeLegibility;
|
|
|
- font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
|
|
|
- background-color: #F4F7FB; }
|
|
|
-
|
|
|
-*,
|
|
|
-*::before,
|
|
|
-*::after {
|
|
|
- box-sizing: inherit; }
|
|
|
-
|
|
|
-a {
|
|
|
- border: none;
|
|
|
- outline: none;
|
|
|
- text-decoration: none;
|
|
|
- -webkit-touch-callout: none;
|
|
|
- -webkit-tap-highlight-color: transparent; }
|
|
|
-
|
|
|
-.c-login {
|
|
|
- display: flex;
|
|
|
- min-height: 100%;
|
|
|
- width: 100%; }
|
|
|
- .c-login__img {
|
|
|
- flex: 1 1 400px;
|
|
|
- display: inline-block;
|
|
|
- background: url("../img/illustration.png") 50% 50%/757px 613px no-repeat; }
|
|
|
- .c-login__main {
|
|
|
- flex: 1 0 auto; }
|
|
|
-
|
|
|
-@media screen and (max-width: 900px) {
|
|
|
- .c-login__img {
|
|
|
- display: none; } }
|
|
|
-.c-login-form {
|
|
|
- display: inline-flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- padding: 40px 0 80px;
|
|
|
- background-color: #FFFFFF;
|
|
|
- overflow: auto; }
|
|
|
- .c-login-form__header {
|
|
|
- display: inline-flex;
|
|
|
- align-items: center; }
|
|
|
- .c-login-form__logo {
|
|
|
- display: inline-block;
|
|
|
- width: 142px;
|
|
|
- height: 36px;
|
|
|
- background: url("../img/logo.png") 0 0/100% 100% no-repeat; }
|
|
|
- .c-login-form__name {
|
|
|
- padding-left: 10px;
|
|
|
- color: #1C5CB0;
|
|
|
- font-size: 28px;
|
|
|
- font-weight: bold;
|
|
|
- line-height: 1; }
|
|
|
- .c-login-form__tip {
|
|
|
- padding: 20px;
|
|
|
- height: 100px; }
|
|
|
- .c-login-form__tip .success {
|
|
|
- color: #67C23A; }
|
|
|
- .c-login-form__tip .warning {
|
|
|
- color: #E6A23C; }
|
|
|
- .c-login-form__tip .error {
|
|
|
- color: #F56C6C; }
|
|
|
- .c-login-form__tip .info {
|
|
|
- color: #409EFF; }
|
|
|
- .c-login-form__wrapper {
|
|
|
- display: inline-flex;
|
|
|
- flex-direction: column;
|
|
|
- color: #C4C4C4; }
|
|
|
- .c-login-form__error {
|
|
|
- height: 30px;
|
|
|
- color: #F56C6C;
|
|
|
- font-size: 12px;
|
|
|
- line-height: 24px;
|
|
|
- white-space: nowrap; }
|
|
|
- .c-login-form__label {
|
|
|
- font-size: 24px;
|
|
|
- line-height: 1; }
|
|
|
- .c-login-form__section {
|
|
|
- display: inline-flex;
|
|
|
- align-items: center;
|
|
|
- padding: 8px 0 2px;
|
|
|
- border-bottom: 1px solid currentColor; }
|
|
|
- .c-login-form__input {
|
|
|
- width: 320px;
|
|
|
- height: 30px;
|
|
|
- font-size: 18px;
|
|
|
- line-height: 30px;
|
|
|
- border: none;
|
|
|
- outline: none; }
|
|
|
- .c-login-form__icon {
|
|
|
- display: inline-block;
|
|
|
- margin-left: 10px;
|
|
|
- width: 30px;
|
|
|
- height: 30px;
|
|
|
- background-position: 0 0;
|
|
|
- background-size: 100% 100%;
|
|
|
- background-repeat: no-repeat; }
|
|
|
- .c-login-form__icon.user {
|
|
|
- background-image: url("../img/icon_user.png"); }
|
|
|
- .c-login-form__icon.lock {
|
|
|
- background-image: url("../img/icon_lock.png"); }
|
|
|
- .c-login-form__submit {
|
|
|
- display: inline-flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- width: 360px;
|
|
|
- height: 40px;
|
|
|
- margin-top: 50px;
|
|
|
- color: #ffffff;
|
|
|
- font-size: 18px;
|
|
|
- border: none;
|
|
|
- background-color: #1C5CB0;
|
|
|
- border-radius: 8px;
|
|
|
- cursor: pointer; }
|
|
|
- .c-login-form__submit[disabled] {
|
|
|
- background-color: #C4C4C4; }
|
|
|
+* {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+
|
|
|
+html,
|
|
|
+body {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+body {
|
|
|
+ box-sizing: border-box;
|
|
|
+ -moz-osx-font-smoothing: grayscale;
|
|
|
+ -webkit-font-smoothing: antialiased;
|
|
|
+ text-rendering: optimizeLegibility;
|
|
|
+ font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
|
|
|
+ background-color: #F4F7FB;
|
|
|
+}
|
|
|
+
|
|
|
+*,
|
|
|
+*::before,
|
|
|
+*::after {
|
|
|
+ box-sizing: inherit;
|
|
|
+}
|
|
|
+
|
|
|
+a {
|
|
|
+ border: none;
|
|
|
+ outline: none;
|
|
|
+ text-decoration: none;
|
|
|
+ -webkit-touch-callout: none;
|
|
|
+ -webkit-tap-highlight-color: transparent;
|
|
|
+}
|
|
|
+
|
|
|
+.c-login {
|
|
|
+ display: flex;
|
|
|
+ min-height: 100%;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+.c-login__img {
|
|
|
+ flex: 1 1 400px;
|
|
|
+ display: inline-block;
|
|
|
+ background: url("../img/illustration.png") 50% 50%/757px 613px no-repeat;
|
|
|
+}
|
|
|
+.c-login__main {
|
|
|
+ flex: 1 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (max-width: 900px) {
|
|
|
+ .c-login__img {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+}
|
|
|
+.c-login-form {
|
|
|
+ display: inline-flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ padding: 40px 0 80px;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+.c-login-form__header {
|
|
|
+ display: inline-flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+.c-login-form__logo {
|
|
|
+ display: inline-block;
|
|
|
+ width: 142px;
|
|
|
+ height: 36px;
|
|
|
+ background: url("../img/logo.png") 0 0/100% 100% no-repeat;
|
|
|
+}
|
|
|
+.c-login-form__name {
|
|
|
+ padding-left: 10px;
|
|
|
+ color: #1C5CB0;
|
|
|
+ font-size: 28px;
|
|
|
+ font-weight: bold;
|
|
|
+ line-height: 1;
|
|
|
+}
|
|
|
+.c-login-form__tip {
|
|
|
+ padding: 20px;
|
|
|
+ height: 100px;
|
|
|
+}
|
|
|
+.c-login-form__tip .success {
|
|
|
+ color: #67C23A;
|
|
|
+}
|
|
|
+.c-login-form__tip .warning {
|
|
|
+ color: #E6A23C;
|
|
|
+}
|
|
|
+.c-login-form__tip .error {
|
|
|
+ color: #F56C6C;
|
|
|
+}
|
|
|
+.c-login-form__tip .info {
|
|
|
+ color: #409EFF;
|
|
|
+}
|
|
|
+.c-login-form__wrapper {
|
|
|
+ display: inline-flex;
|
|
|
+ flex-direction: column;
|
|
|
+ color: #C4C4C4;
|
|
|
+}
|
|
|
+.c-login-form__error {
|
|
|
+ height: 30px;
|
|
|
+ color: #F56C6C;
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 24px;
|
|
|
+ white-space: nowrap;
|
|
|
+}
|
|
|
+.c-login-form__label {
|
|
|
+ font-size: 24px;
|
|
|
+ line-height: 1;
|
|
|
+}
|
|
|
+.c-login-form__section {
|
|
|
+ display: inline-flex;
|
|
|
+ align-items: center;
|
|
|
+ padding: 8px 0 2px;
|
|
|
+ border-bottom: 1px solid currentColor;
|
|
|
+}
|
|
|
+.c-login-form__input {
|
|
|
+ width: 320px;
|
|
|
+ height: 30px;
|
|
|
+ font-size: 18px;
|
|
|
+ line-height: 30px;
|
|
|
+ border: none;
|
|
|
+ outline: none;
|
|
|
+}
|
|
|
+.c-login-form__input.password {
|
|
|
+ -webkit-text-security: disc;
|
|
|
+}
|
|
|
+.c-login-form__icon {
|
|
|
+ display: inline-block;
|
|
|
+ margin-left: 10px;
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ background-position: 0 0;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+}
|
|
|
+.c-login-form__icon.user {
|
|
|
+ background-image: url("../img/icon_user.png");
|
|
|
+}
|
|
|
+.c-login-form__icon.lock {
|
|
|
+ background-image: url("../img/icon_lock.png");
|
|
|
+}
|
|
|
+.c-login-form__submit {
|
|
|
+ display: inline-flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ width: 360px;
|
|
|
+ height: 40px;
|
|
|
+ margin-top: 50px;
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 18px;
|
|
|
+ border: none;
|
|
|
+ background-color: #1C5CB0;
|
|
|
+ border-radius: 8px;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.c-login-form__submit[disabled] {
|
|
|
+ background-color: #C4C4C4;
|
|
|
+}
|
daigang