diff --git a/source/_dashboards/clock.markdown b/source/_dashboards/clock.markdown new file mode 100644 index 00000000000..64de1b579ec --- /dev/null +++ b/source/_dashboards/clock.markdown @@ -0,0 +1,78 @@ +--- +type: card +title: "Clock card" +sidebar_label: Clock +description: "The Clock card shows the current time in a variety of formats and sizes." +related: + - docs: /docs/frontend/#user--or-browser-dependent-settings + title: Setup your time format and timezone +--- + +The Clock card shows the current time in a variety of formats and sizes. + +

+Screenshot of the clock card +Screenshot of the clock card +

+ +{% include dashboard/edit_dashboard.md %} + +All options for this card can be configured via the user interface. + + +## Card settings + +{% configuration_basic %} +Clock Size: + description: Adjusts the size of the text allowing a wider range of use with different types of dashboards. Defaults to small. +Display Seconds: + description: Shows seconds alongside the clock, providing the time format is in a 12-hour format. +Time Format: + description: Allows the time format to be changed on a per-card level. Defaults to the user profile setting. +{% endconfiguration_basic %} + +### Examples + +Basic example: + +```yaml +type: clock +``` + +Clock card with no configuration + +

+Screenshot of the basic clock card +Screenshot of the basic clock card +

+ +```yaml +type: clock +clock_size: large +time_format: "12" +show_seconds: true +grid_options: + columns: 12 + rows: 2 +``` + +Example of a larger clock card for tablet dashboards: + +

+Screenshot of a large sized, 12 hour clock card showing am/pm and seconds +Screenshot of a large sized, 12 hour clock card showing am/pm and seconds +

+ +A medium-sized clock card better suited for desktop dashboards: + +```yaml +type: clock +clock_size: medium +time_format: "12" +show_seconds: false +``` + +

+Screenshot of a medium sized, 12 hour clock showing am/pm +Screenshot of a medium sized, 12 hour clock showing am/pm +

\ No newline at end of file diff --git a/source/images/dashboards/clock_card_default.png b/source/images/dashboards/clock_card_default.png new file mode 100644 index 00000000000..c06dfe08e6d Binary files /dev/null and b/source/images/dashboards/clock_card_default.png differ diff --git a/source/images/dashboards/clock_card_large.png b/source/images/dashboards/clock_card_large.png new file mode 100644 index 00000000000..f0875574af6 Binary files /dev/null and b/source/images/dashboards/clock_card_large.png differ diff --git a/source/images/dashboards/clock_card_medium.png b/source/images/dashboards/clock_card_medium.png new file mode 100644 index 00000000000..c93c28c0405 Binary files /dev/null and b/source/images/dashboards/clock_card_medium.png differ