style:首页icon

ZhangXianQiang

2024-03-29 49b0d7cc676a7e21bb1e05e19c89058cdac5fe88

style:首页icon

 src/assets/icons/logo.png

 src/views/login.vue

@@ -3,11 +3,14 @@
    <div class="login-container">
      <div class="login-wrapper">
        <div class="info-wrapper enter-x">
          <div class="title-wrapper">
            <div class="logo">
              <img src="../assets/icons/logo.png" alt="">
            </div>
            <p class="title">自贡公安天网运维平台</p>
          </div>
          <div class="logo-wrapper">
            <img src="../assets/svg/login-box-bg.svg" alt="">
          </div>
          <div class="title-wrapper">
            <p class="title">自贡公安天网运维平台</p>
          </div>
        </div>
        <div class="form-wrapper">
@@ -268,9 +271,10 @@
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;

  .logo-wrapper {
    transform: translateX(-50px);
    transform: translateX(-80px);
    opacity: 0;
    animation: enter-x 0.3s ease forwards;

@@ -280,16 +284,19 @@
  }

  .title-wrapper {
    margin-top: 30px;
    transform: translateX(-50px);
    transform: translateX(-80px);
    opacity: 0;
    animation: enter-x 0.3s ease forwards;
    animation-delay: 0.1s;
    display: flex;
    align-items: center;
    margin-bottom: 50px;

    .title {
      text-align: left;
      font-size: 30px;
      color: #fff;
      margin-left: 10px;
    }
  }
}
@@ -303,13 +310,13 @@
  align-items: center;

  .title {
    transform: translateX(50px);
    transform: translateX(80px);
    opacity: 0;
    animation: enter-x 0.3s ease forwards;
  }

  .login-form {
    transform: translateX(50px);
    transform: translateX(80px);
    opacity: 0;
    animation: enter-x 0.3s ease forwards;
    animation-delay: 0.1s;