Orologio

Con il widget Orologio è possibile visualizzare l'ora corrente. Il fuso orario può essere configurato separatamente su ciascun widget. Se utilizzato insieme a un widget per la cronologia delle interruzioni, l'ora dell'orologio segue l'ora dell'interruzione.

Modifica del widget Orologio

Ogni widget Orologio può essere configurato con un fuso orario separato.

I fusi orari validi sono nel formato definito nel database tz o nelle abbreviazioni dei fusi orari comuni, come CET o GMT.

Colore delle cifre dell'orologio

Colore del segmento inattivo

Questo può essere fatto aggiungendo il seguente stile alla Dashboard di destinazione (per i dettagli, consultare: https://skoorag.atlassian.net/wiki/spaces/DOC/pages/494196/Dashboards+Guide#Edit-dashboard )

.widget.clock svg path {
  fill: #979ca1;
}
image-20240807-071623.pngimage-20240807-071736.png

Colore del segmento attivo

Questo può essere fatto aggiungendo il seguente stile al Dashboard di destinazione (per i dettagli controllare: Edit dashboard )

.widget.clock svg path[class*="active"] {
  fill: #ff0000;
}
image-20240807-075830.png

image-20240807-075910.png

In base al fuso orario utilizzato

image-20240807-083313.pngimage-20240807-082645.pngimage-20240807-084047.png

La soluzione confronta l'offset UTC corrente con l'offset UTC impostato sul widget Orologio. Se sono uguali, imposta la classe CSS su locale. Una regola CSS nello stile del cruscotto colora di conseguenza i percorsi attivi locali.

image-20240807-083359.png
  1. L'impostazione seguente assegna la classe CSS local all'orologio se il suo fuso orario corrisponde a "europe/zurich".

 ${moment().utcOffset() == moment().tz("europe/zurich").utcOffset() ? "local" : ""}
  1. Utilizzando lo stile seguente nell'impostazione del cruscotto, si regolerà solo il widget Orologio con la classe CSS locale

.widget.clock.local svg path[class*="active"] {
  fill: #0a87f0;
}