0x1998 - MANAGER
Düzenlenen Dosya: debug.css
.login { display: flex; justify-content: center; padding-top: 10%; background: #1f293a; height: 50vh; } .login .container { position: relative; width: 14rem; height: 20rem; display: flex; justify-content: center; align-items: center; } .login .container span { position: absolute; left: 0; width: 26px; height: 5px; background: #2c4766; border-radius: 8px; transform-origin: 114px; transform: scale(2.2) rotate(calc(var(--i) * (360deg / 50))); animation: animateBlink 3s linear infinite; animation-delay: calc(var(--i) * (3s / 50)); } @keyframes animateBlink { 0% { background: #0ef; } 25% { background: #2c4766; } } .login .login-box { position: absolute; width: 280px; padding-right: 1rem; } .login .login-box form { width: 100%; padding-bottom: 2rem; } h2 { font-size: 2em; color: #0ef; text-align: center; margin: 0px; } .login .input-box { position: relative; margin: 25px 0; } .login .input-box input { width: 100%; height: 50px; background: transparent; border: 2px solid #2c4766; outline: none; border-radius: 40px; font-size: 1em; color: #fff; padding: 0 20px; transition: .5s ease; } .login .input-box input:focus, .login .input-box input:valid { border-color: #0ef; } .login .input-box label { position: absolute; top: 50%; left: 20px; transform: translateY(-50%); font-size: 1em; color: #fff; pointer-events: none; transition: .5s ease; } .login .input-box input:focus ~ label, .login .input-box input:valid ~ label { top: 1px; font-size: .8em; background: #1f293a; padding: 0 6px; color: #0ef; } .login .forgot-pass { margin: -15px 0 10px; text-align: center; } .login .forgot-pass a { font-size: .75em; color: #fff; text-decoration: none; } .login .forgot-pass a:hover { text-decoration: underline; } .login .btn { width: 100%; height: 45px; background: #0ef; border: none; outline: none; border-radius: 40px; cursor: pointer; font-size: 1em; color: #1f293a; font-weight: 600; } .login .signup-link { margin: 20px 0 10px; text-align: center; } .login .signup-link a { font-size: 1em; color: #0ef; text-decoration: none; font-weight: 600; } .login .signup-link a:hover { text-decoration: underline; } .login p { color: #fff; font-size: .75rem; } /*----------------------------- test accordion */ .debug__accordion .btn-check { padding: 5px; max-height: 27px; width: 10rem; color: #579627; border: 1px solid rgba(142, 213, 87, 0.8); border-radius: 5px; display: flex; align-items: center; justify-content: center; } .debug__accordion .license__accordion-content-head { display: flex; align-items: center; justify-content: space-between; } .dd-div { background: #121212; padding: 1% 2%; border-radius: 1rem; margin: 0.8rem; direction: ltr; text-align: left; } .dd-title { color: #ffffff; display: inline-block; } .dd-key { color: #0087ff; display: inline-block; } .dd-value { color: #9ad114; display: inline-block; } .debug-connection { cursor: pointer; }
geri dön