.login { width: 100%; height: 100%; display: flex; overflow: hidden; .bg-gradient-primary { background: linear-gradient(135deg, #165DFF 0%, #0FC6C2 100%); } &-left { width: 50%; height: 100%; img { width: 100%; height: 100%; object-fit: cover; } } &-right { width: 40%; display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; &-content { width: 50%; &-title { margin-bottom: 30px; &-text { font-size: 24px; color: var(--primary); border-bottom: 2px solid var(--primary); background: linear-gradient(to bottom, #FFFFFF 50%, #D3DCF6 50%); } } } &-copyright { width: 100%; font-size: 12px; color: #C0C3CC; display: flex; justify-content: center; position: absolute; bottom: 20px; left: 0; } } // Ensure the password eye (antd suffix) sits at the far right } .password-input { position: relative; width: 100%; // target antd suffix inside this input wrapper .ant-input-affix-wrapper { position: relative; } .ant-input-suffix { position: absolute; right: 10px; // keep a small gap from right edge top: 50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; z-index: 2; pointer-events: auto; } } .yzm_input{ max-width: 100% !important; width: 100%; height: 100%; } input[type="number"], input[type="text"], input[type="password"] { min-height: 0px; }