Iniciante - Botão Switch para habilitar manutenção do site
Boa Tarde galera,
Sou meio iniciante no assunto de programação. Eu estou com alguns problemas, estou criando uma página em HTML e PHP e no Painel Administrativo botei um botão switch. A minha ideia é que quando estiver acionado ele direciona as pessoas para a index "manutenção", ou seja, qualquer link que a pessoa tentar entrar do site vai redirecionar para a página "manutenção". E quando acabar a "manutenção" eu possa desacionar o botão para que o site volte ao normal. Lembrando que eu vou ter acesso ao Painel (não pode ser redirecionado).
Meus Problemas:
1-Manter o botão acionado durante a manutenção.
2-Redirecionar todas as pessoas quando o botão estiver acionado para a página "manutenção.html".
Botão Switch:
<div class="switch__container">
<input id="switch-shadow" class="switch switch--shadow" type="checkbox">
<label for="switch-shadow"></label>
</div>
/ Estilo iOS /
.switch__container {
margin: 30px auto;
width: 120px;
}
.switch {
visibility: hidden;
position: absolute;
margin-left: -9999px;
}
.switch + label {
display: block;
position: relative;
cursor: pointer;
outline: none;
user-select: none;
}
.switch--shadow + label {
padding: 2px;
width: 120px;
height: 60px;
background-color: #dddddd;
border-radius: 60px;
}.switch--shadow + label:before,
.switch--shadow + label:after {
display: block;
position: absolute;
top: 1px;
left: 1px;
bottom: 1px;
content: "";
}.switch--shadow + label:before {
right: 1px;
background-color: #f1f1f1;
border-radius: 60px;
transition: background 0.4s;
}.switch--shadow + label:after {
width: 62px;
background-color: #fff;
border-radius: 100%;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
transition: all 0.4s;
}.switch--shadow:checked + label:before {
background-color: #8ce196;
}.switch--shadow:checked + label:after {
transform: translateX(60px);
}Discussão (2)
Carregando comentários...