assess-app/pages/login/index.vue

<template>
  <view class="page-box login-box">
      <view class="login-form">
        <view class="from-title">
          <view class="title-list">
            <view class="title-text dominant-text-color sys-size-28">验证码登录</view>
            <view class="title-text sys-size-28">密码登录</view>
          </view>
          <view class="title-bg"></view>

        </view>

      </view>


  </view>
</template>
<script>
  export default {
    components: {

    },
    data() {
      return {

      }
    },
    mounted() {

    },
    methods: {
      login() {
        uni.redirectTo({
          url: '/pages/index/index'
        })
      },
    },
  }
</script>
<style lang="scss" scoped>
  @import "/static/css/login.css";
  .page-box{
    background-color: #EEF1F7;
    padding-top: 370rpx;
    .login-form{
      margin: 0 30rpx;
      height: 630rpx;
      border-radius: 50rpx;
      background-color: rgba(255,255,255,0.5);
      .from-title{
        height: 110rpx;
        position: relative;
        .title-bg{
          position: absolute;
          border-radius: 50rpx 50rpx 0 0;
          top: 0;
          left: 0;
          height:110rpx;
          width: 50%;
          background-color: #fff;
          transition: .5s ease;
          z-index: 0;
        }
        .title-list{
          display: flex;
          justify-content: space-between;
          z-index: 1;
          position: relative;
          .title-text{
            width: 50%;
            height: 110rpx;
          }
        }

      }
    }

  }
</style>