miniProgram/componets/authorized-login-dialog/authorizedLoginDialog.wxss

/* componets/authorized-login-dialog/authorizedLoginDialog.wxss */

.dialog-bg {
    width: 100vw;
    min-height: 730rpx;
    height: 730rpx;
    background: #F7F7F7;
    border-radius: 32rpx 32rpx 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.close-btn {
    position: absolute;
    right: 0;
    top: 0;
    width: 128rpx;
    height: 128rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.title-box {
    width: 100%;
    margin-top: 40rpx;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.logo {
    width: 48rpx;
    margin-left: 40rpx;
    height: 48rpx;
}

.title {
    margin-left: 16rpx;
    color: #333333;
    font-size: 32rpx;
}

.desc {
    margin: 20rpx 40rpx 0;
    color: #666666;
    font-size: 24rpx;
}

.avatar-wrapper {
    width: 128rpx;
    padding: 0;
    display: block;
    border-radius: 100%;
    border: 0;
    overflow: hidden;
    height: 128rpx;
    margin: 20rpx auto 0;
}

.avatar {
    width: 128rpx;
    height: 128rpx;
    display: block;
}

button::after {
    border: 0;
}

.nickname-input {
    width: calc(100% - 120rpx);
    height: 80rpx;
    padding: 0 30rpx;
    margin-top: 40rpx;
    background: #EEEEEE;
    color: #333333;
    border-radius: 80rpx;
    font-size: 28rpx;
}

.custom-input-button {
    width: calc(100% - 80rpx);
    height: 80rpx;
    margin-top: 40rpx;
    line-height: 80rpx;
    text-align: left;
    background: #EEEEEE;
    color: #888888;
    border-radius: 80rpx;
    font-size: 28rpx !important;
}

.auth-button {
    width: calc(100% - 80rpx);
    line-height: 80rpx;
    margin-top: 40rpx;
    font-size: 32rpx;
    border-radius: 80rpx;
    height: 80rpx;
    background: linear-gradient(315deg, #0ABCA4 0%, rgba(11, 195, 170, 0.8) 100%);
    color: #FFFFFF;
}


button[disabled] {
    color: #FFFFFF;
    background: linear-gradient(315deg, #0ABCA4 0%, rgba(11, 195, 170, 0.8) 100%);
    opacity: 0.6;
}

.mask-content {
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 32rpx 32rpx 0 0;
}

.custom-loading {
    display: block;
    margin-top: 350rpx;
}