Data/hora atual: 19.04.24 10:35
1 Resultado encontrado para fontawesome
Como colocar sistema de status
Altere o código em uso para:- Código:
<style>
#serverlist div:not([class]) {
display: flex;
margin-bottom: 1em;
}
#serverlist .col {
flex: 1;
}
#serverlist .status:after {
color: white;
padding: 3px 6px;
height: 16px;
font-size: 11px!important;
text-transform: uppercase;
}
#serverlist .status.on:after {content: 'online'; background-color: #4CAF50;}
#serverlist .status.off:after {content: 'offline'; background-color: #f44336;}
#serverlist .status.manu:after { content: 'manuteção'; background-color: #e7e7e7; color: black;}
</style>
<div id="serverlist">
<!-- Servidor 1 -->
<div>
<div class="col">
Servidor 1
</div>
<div class="col">
Versão 1
</div>
<div class="col">
<span class="status off"></span>
</div>
</div>
<!-- Acaba aqui o Servidor 1 -->
<!-- Servidor 2 -->
<div>
<div class="col">
Servidor 2
</div>
<div class="col">
Versão 1
</div>
<div class="col">
<span class="status on"></span>
</div>
</div>
<!-- Acaba aqui Servidor 2 -->
</div>
tipo um icone antes do servidor 1 por exemplo.
Ícone imagem ou ícone #fontawesome ?
- em 23.06.20 18:22
- Procurar em: Questões resolvidas sobre códigos Javascript e jQuery
- Tópico: Como colocar sistema de status
- Respostas: 17
- Vistos: 1426