He creado una página web de login y register (inicio de sesión y registro) para un futuro proyecto. De momento solo es HTML, CSS y muy poco de JS.
Me gustaría que la revisen, que la prueben, miren el código fuente de los archivos HTML y el CSS, y me digan qué puedo o debo modificar, y si es posible, cómo hacer que el botón que está para cambiar de modo claro a oscuro quede centrado en la página de registro.
const theme_btn = document.querySelector('#btn-toggle');
const body = document.querySelector("body");
theme_btn.addEventListener('click', () => {
body.classList.toggle('dark-theme')
});
.social-icon {
height: 46px;
width: 46px;
display: flex;
justify-content: center;
align-items: center;
margin: 0 0.45rem;
color: #ccc;
border-radius: 50%;
border: 1px solid #ccc;
text-decoration: none;
font-size: 1.1rem;
transition: 0.3s;
}
.social-icon:hover {
color: #80aeff;
border-color: #90b9ff;
}
<body class="dark-theme">
<div class="dark">
<a href="#" class="social-icon" id="btn-toggle">
<i class="fas fa-moon"></i>
</a>
</div>
</body>
Muchas gracias.