dage-web-tools/packages/backend-cli/template/src/pages/Login/index.scss

.login {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  background-image: url("./images/bg.jpg");
  background-size: cover;

  &::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1;
  }
  .icon-account,
  .icon-password {
    margin-right: 24px;
    width: 26px;
  }

  &-logo {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 17.5vh;
    left: 15vw;
    z-index: 1;

    &__txt {
      display: flex;
      justify-content: space-between;
      margin-top: 23px;
      font-size: 24px;
      color: #ffffff;
      opacity: 0.6;
    }
  }

  &-form {
    position: absolute;
    top: 52%;
    right: 12vw;
    width: 550px;
    height: 646px;
    padding: 66px 75px;
    background: rgba(176, 161, 121, 0.2);
    box-shadow: inset 0px 4px 4px 0px rgba(255, 255, 255, 0.25);
    border-radius: 3px;
    transform: translateY(-50%);
    z-index: 2;

    &__title {
      margin-bottom: 20px;
      font-size: 40px;
      font-family: Source Han Serif CN-Bold;
      font-weight: bold;
      color: white;
    }

    &__input {
      $inputHeight: 85px;
      display: flex;
      flex-direction: column;

      .ant-input {
        width: 100%;
        height: $inputHeight;
        color: #ffffff;
        background-color: transparent;

        &::-webkit-input-placeholder {
          color: #ffffff;
          opacity: 0.6;
        }
        &:-webkit-autofill {
          transition-delay: 99999s;
        }
        &:-webkit-autofill::first-line {
          font-size: 24px;
        }
      }
      .ant-input-affix-wrapper {
        padding: 0 11px;
        width: 100%;
        height: $inputHeight;
        border: none;
        color: #ffffff;
        font-size: 24px;
        border-bottom: 1px solid #ffffff;
        border-radius: 0;
        background-color: transparent;
      }
      .ant-input-password-icon {
        color: #ffffff !important;
        opacity: 0.6;
      }
    }

    &__btn {
      margin-top: 85px;

      .ant-btn {
        font-size: 24px;
        width: 100%;
        height: 66px;
        border-radius: 3px;
        border: 0;
        background: var(--second-color);
      }
    }
  }
}