@utogether/udp-core 1.0.1-beta.16 → 1.0.1-beta.18

package/src/style/login.css

@@ -1,336 +1,336 @@
-.wave {
-  position: fixed;
-  height: 100%;
-  left: 0;
-  bottom: 0;
-  z-index: -1;
-}
-
-.login-container {
-  width: 100vw;
-  height: 100vh;
-  display: flex;
-  justify-content: flex-end;
-  background-color: #2a5f97;
-  /* background: url('../assets/login/default-bg.png') no-repeat center; */
-  background-repeat: no-repeat;
-  background-position: center;
-  /* display: grid; */
-  /* grid-template-columns: repeat(2, 1fr); */
-  /* grid-gap: 18rem; */
-  background-size: cover;
-  /* padding: 0 2rem; */
-}
-
-.img {
-  display: flex;
-  justify-content: flex-end;
-  align-items: center;
-}
-
-.img img {
-  width: 800px;
-}
-
-.login-box {
-  display: flex;
-  align-items: center;
-  text-align: center;
-  padding-right: 60px;
-}
-
-.login-form {
-  width: 360px;
-  padding: 20px;
-  background: url('../assets/images/login.png') no-repeat center;
-}
-
-.avatar {
-  width: 350px;
-  height: 80px;
-}
-
-.login-form h2 {
-  text-transform: uppercase;
-  margin: 15px 0;
-  color: #fff;
-  font:
-    bold 200% Consolas,
-    Monaco,
-    monospace;
-}
-
-.input-group {
-  position: relative;
-  display: grid;
-  grid-template-columns: 7% 93%;
-  margin: 25px 0;
-  padding: 5px 0;
-  border-bottom: 2px solid #d9d9d9;
-}
-
-.input-group:nth-child(1) {
-  margin-bottom: 4px;
-}
-
-.input-group::before,
-.input-group::after {
-  content: '';
-  position: absolute;
-  bottom: -2px;
-  width: 0;
-  height: 2px;
-  background-color: #c5d3f7;
-  transition: 0.5s;
-}
-
-.input-group::after {
-  right: 50%;
-}
-
-.input-group::before {
-  left: 50%;
-}
-
-.icon {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  color: #fff;
-}
-
-.icon svg {
-  color: #fff;
-  transition: 0.5s;
-  height: 20px;
-  width: 20px;
-}
-
-.input-group > div {
-  position: relative;
-  height: 45px;
-}
-
-.input-group > div > h5 {
-  position: absolute;
-  left: 10px;
-  top: 50%;
-  transform: translateY(-50%);
-  color: #fff;
-  font-size: 18px;
-  transition: 0.3s;
-  margin: 0;
-  padding: 0;
-}
-
-.input-group.focus .icon svg {
-  color: #fff;
-  height: 20px;
-  width: 20px;
-}
-
-.input-group.focus div h5 {
-  top: -5px;
-  font-size: 15px;
-}
-
-.input-group.focus::after,
-.input-group.focus::before {
-  width: 50%;
-}
-
-.input {
-  position: absolute;
-  width: 100%;
-  /* height: 100%; */
-  top: 0;
-  left: 0;
-  border: none;
-  outline: none;
-  /* background: none; */
-  padding: 0.5rem 0.7rem;
-  font-size: 16px;
-  /* color: #fff; */
-  font-family: 'Roboto', sans-serif;
-
-  height: 36px;
-  border-radius: 5px;
-  top: 5px;
-  margin-left: 5px;
-  background-color: #fff;
-  color: #000;
-}
-
-.input-group.focus.input {
-  height: 36px;
-  border-radius: 5px;
-  top: 5px;
-  margin-left: 5px;
-  /* width: calc(100%-10px); */
-  background-color: #fff;
-  color: #000;
-}
-
-a {
-  display: block;
-  text-align: right;
-  text-decoration: none;
-  color: #999;
-  font-size: 0.9rem;
-  transition: 0.3s;
-}
-
-a:hover {
-  color: #5392f0;
-}
-
-/* .btn, */
-/* .btn::before {
-  display: block;
-  width: 100%;
-  height: 40px;
-  border-radius: 10px;
-  margin: 1rem 0;
-  font-size: 1.2rem;
-  outline: none;
-  border: none;
-  background-image: linear-gradient(to right, #567dbe, #5392f0, #567dbe);
-  cursor: pointer;
-  color: #fff;
-  text-transform: uppercase;
-  font-family: 'Roboto', sans-serif;
-  background-size: 200%;
-  transition: 0.5s;
-} */
-
-.btn:hover {
-  background-position: right;
-}
-
-.btn,
-.btn::before {
-  display: block;
-  width: 100%;
-  height: 40px;
-  line-height: 40px;
-  text-align: center;
-  border-radius: 10px;
-  font-size: 1.2rem;
-  outline: none;
-  border: none;
-  background-image: linear-gradient(to right, #567dbe, #5392f0, #567dbe);
-  cursor: pointer;
-  color: #fff;
-  text-transform: uppercase;
-  font-family: 'Roboto', sans-serif;
-  background-size: 200%;
-  transition: 0.5s;
-}
-.btn {
-  position: relative;
-  /* background: #5ad; */
-  /* color: #fff; */
-  cursor: pointer;
-}
-.btn::before {
-  content: '正在登录,请稍后...';
-  position: absolute;
-  display: none;
-  z-index: 2;
-  top: 0;
-  left: 0;
-  color: #fff;
-  text-shadow: rgba(100, 0, 0, 1) 0 0 3px;
-  background: linear-gradient(
-    45deg,
-    /* #fc0 0%,
-    #fc0 20%,
-    #fa0 20%,
-    #fa0 45%,
-    #fc0 45%,
-    #fc0 70%,
-    #fa0 70%,
-    #fa0 95%,
-    #fc0 95%,
-    #fc0 100% */
-      #4169e1 0%,
-    #4169e1 20%,
-    #5a7de7 20%,
-    #5a7de7 45%,
-    #4169e1 45%,
-    #4169e1 70%,
-    #5a7de7 70%,
-    #5a7de7 95%,
-    #4169e1 95%,
-    #4169e1 100%
-  );
-  background-size: 40px 40px;
-  background-position: 0 0;
-  animation: loading 1s infinite linear;
-}
-.btn.loading::before {
-  display: block;
-}
-@keyframes loading {
-  0% {
-    background-position: 0 0;
-  }
-  100% {
-    background-position: 40px 0;
-  }
-}
-
-.copyright {
-  position: absolute;
-  width: 100%;
-  height: 50px;
-  bottom: 2px;
-  color: #5392f0;
-  text-align: center;
-  font-size: 18px;
-  font-family: 'Roboto', sans-serif;
-}
-
-@media screen and (max-width: 1080px) {
-  .login-container {
-    grid-gap: 9rem;
-  }
-}
-
-@media screen and (max-width: 1024px) {
-  .login-form {
-    width: 290px;
-  }
-
-  .login-form h2 {
-    font-size: 2.4rem;
-    margin: 8px 0;
-  }
-
-  .img img {
-    width: 360px;
-  }
-
-  .avatar {
-    width: 280px;
-    height: 80px;
-  }
-}
-
-@media screen and (max-width: 768px) {
-  .wave {
-    display: none;
-  }
-
-  .img {
-    display: none;
-  }
-
-  .login-container {
-    grid-template-columns: 1fr;
-  }
-
-  .login-box {
-    justify-content: center;
-  }
-}
+.wave {
+  position: fixed;
+  height: 100%;
+  left: 0;
+  bottom: 0;
+  z-index: -1;
+}
+
+.login-container {
+  width: 100vw;
+  height: 100vh;
+  display: flex;
+  justify-content: flex-end;
+  background-color: #2a5f97;
+  /* background: url('../assets/login/default-bg.png') no-repeat center; */
+  background-repeat: no-repeat;
+  background-position: center;
+  /* display: grid; */
+  /* grid-template-columns: repeat(2, 1fr); */
+  /* grid-gap: 18rem; */
+  background-size: cover;
+  /* padding: 0 2rem; */
+}
+
+.img {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+}
+
+.img img {
+  width: 800px;
+}
+
+.login-box {
+  display: flex;
+  align-items: center;
+  text-align: center;
+  padding-right: 60px;
+}
+
+.login-form {
+  width: 360px;
+  padding: 20px;
+  background: url('../assets/images/login.png') no-repeat center;
+}
+
+.avatar {
+  width: 350px;
+  height: 80px;
+}
+
+.login-form h2 {
+  text-transform: uppercase;
+  margin: 15px 0;
+  color: #fff;
+  font:
+    bold 200% Consolas,
+    Monaco,
+    monospace;
+}
+
+.input-group {
+  position: relative;
+  display: grid;
+  grid-template-columns: 7% 93%;
+  margin: 25px 0;
+  padding: 5px 0;
+  border-bottom: 2px solid #d9d9d9;
+}
+
+.input-group:nth-child(1) {
+  margin-bottom: 4px;
+}
+
+.input-group::before,
+.input-group::after {
+  content: '';
+  position: absolute;
+  bottom: -2px;
+  width: 0;
+  height: 2px;
+  background-color: #c5d3f7;
+  transition: 0.5s;
+}
+
+.input-group::after {
+  right: 50%;
+}
+
+.input-group::before {
+  left: 50%;
+}
+
+.icon {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #fff;
+}
+
+.icon svg {
+  color: #fff;
+  transition: 0.5s;
+  height: 20px;
+  width: 20px;
+}
+
+.input-group > div {
+  position: relative;
+  height: 45px;
+}
+
+.input-group > div > h5 {
+  position: absolute;
+  left: 10px;
+  top: 50%;
+  transform: translateY(-50%);
+  color: #fff;
+  font-size: 18px;
+  transition: 0.3s;
+  margin: 0;
+  padding: 0;
+}
+
+.input-group.focus .icon svg {
+  color: #fff;
+  height: 20px;
+  width: 20px;
+}
+
+.input-group.focus div h5 {
+  top: -5px;
+  font-size: 15px;
+}
+
+.input-group.focus::after,
+.input-group.focus::before {
+  width: 50%;
+}
+
+.input {
+  position: absolute;
+  width: 100%;
+  /* height: 100%; */
+  top: 0;
+  left: 0;
+  border: none;
+  outline: none;
+  /* background: none; */
+  padding: 0.5rem 0.7rem;
+  font-size: 16px;
+  /* color: #fff; */
+  font-family: 'Roboto', sans-serif;
+
+  height: 36px;
+  border-radius: 5px;
+  top: 5px;
+  margin-left: 5px;
+  background-color: #fff;
+  color: #000;
+}
+
+.input-group.focus.input {
+  height: 36px;
+  border-radius: 5px;
+  top: 5px;
+  margin-left: 5px;
+  /* width: calc(100%-10px); */
+  background-color: #fff;
+  color: #000;
+}
+
+a {
+  display: block;
+  text-align: right;
+  text-decoration: none;
+  color: #999;
+  font-size: 0.9rem;
+  transition: 0.3s;
+}
+
+a:hover {
+  color: #5392f0;
+}
+
+/* .btn, */
+/* .btn::before {
+  display: block;
+  width: 100%;
+  height: 40px;
+  border-radius: 10px;
+  margin: 1rem 0;
+  font-size: 1.2rem;
+  outline: none;
+  border: none;
+  background-image: linear-gradient(to right, #567dbe, #5392f0, #567dbe);
+  cursor: pointer;
+  color: #fff;
+  text-transform: uppercase;
+  font-family: 'Roboto', sans-serif;
+  background-size: 200%;
+  transition: 0.5s;
+} */
+
+.btn:hover {
+  background-position: right;
+}
+
+.btn,
+.btn::before {
+  display: block;
+  width: 100%;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  border-radius: 10px;
+  font-size: 1.2rem;
+  outline: none;
+  border: none;
+  background-image: linear-gradient(to right, #567dbe, #5392f0, #567dbe);
+  cursor: pointer;
+  color: #fff;
+  text-transform: uppercase;
+  font-family: 'Roboto', sans-serif;
+  background-size: 200%;
+  transition: 0.5s;
+}
+.btn {
+  position: relative;
+  /* background: #5ad; */
+  /* color: #fff; */
+  cursor: pointer;
+}
+.btn::before {
+  content: '正在登录,请稍后...';
+  position: absolute;
+  display: none;
+  z-index: 2;
+  top: 0;
+  left: 0;
+  color: #fff;
+  text-shadow: rgba(100, 0, 0, 1) 0 0 3px;
+  background: linear-gradient(
+    45deg,
+    /* #fc0 0%,
+    #fc0 20%,
+    #fa0 20%,
+    #fa0 45%,
+    #fc0 45%,
+    #fc0 70%,
+    #fa0 70%,
+    #fa0 95%,
+    #fc0 95%,
+    #fc0 100% */
+      #4169e1 0%,
+    #4169e1 20%,
+    #5a7de7 20%,
+    #5a7de7 45%,
+    #4169e1 45%,
+    #4169e1 70%,
+    #5a7de7 70%,
+    #5a7de7 95%,
+    #4169e1 95%,
+    #4169e1 100%
+  );
+  background-size: 40px 40px;
+  background-position: 0 0;
+  animation: loading 1s infinite linear;
+}
+.btn.loading::before {
+  display: block;
+}
+@keyframes loading {
+  0% {
+    background-position: 0 0;
+  }
+  100% {
+    background-position: 40px 0;
+  }
+}
+
+.copyright {
+  position: absolute;
+  width: 100%;
+  height: 50px;
+  bottom: 2px;
+  color: #5392f0;
+  text-align: center;
+  font-size: 18px;
+  font-family: 'Roboto', sans-serif;
+}
+
+@media screen and (max-width: 1080px) {
+  .login-container {
+    grid-gap: 9rem;
+  }
+}
+
+@media screen and (max-width: 1024px) {
+  .login-form {
+    width: 290px;
+  }
+
+  .login-form h2 {
+    font-size: 2.4rem;
+    margin: 8px 0;
+  }
+
+  .img img {
+    width: 360px;
+  }
+
+  .avatar {
+    width: 280px;
+    height: 80px;
+  }
+}
+
+@media screen and (max-width: 768px) {
+  .wave {
+    display: none;
+  }
+
+  .img {
+    display: none;
+  }
+
+  .login-container {
+    grid-template-columns: 1fr;
+  }
+
+  .login-box {
+    justify-content: center;
+  }
+}