Skip to content

Instantly share code, notes, and snippets.

@yozzi
Created June 7, 2025 15:03
Show Gist options
  • Select an option

  • Save yozzi/0ab7ca424ba34e476a7888639310e680 to your computer and use it in GitHub Desktop.

Select an option

Save yozzi/0ab7ca424ba34e476a7888639310e680 to your computer and use it in GitHub Desktop.
Clock beta
type: sidebar
path: "0"
cards:
- type: custom:bubble-card
card_type: button
button_type: switch
modules:
- default
show_icon: false
scrolling_effect: false
entity: sensor.time
show_name: false
show_state: true
styles: |-
.bubble-container {
position: relative;
!width: 100%;
!width: 460px;
height: 150px !important;
background-color: black;
border-radius: var(--bubble-card-type-border-radius, var(--bubble-border-radius, calc(var(--row-height,56px)/2)));
box-shadow: var(--bubble-card-type-box-shadow, var(--bubble-box-shadow, none));
overflow: scroll;
touch-action: pan-y;
border: var(--bubble-card-type-border, var(--bubble-border, none));
box-sizing: border-box;
margin-top: 60px;
}
bubble-buttons-container {
}
.bubble-background {
background: rgba(0,0,0,1);
border-radius: 0 !important;
}
.bubble-state {
font-size: 180px !important;
line-height: 280px !important;
text-align: left;
}
button_action:
tap_action:
action: navigate
navigation_path: /dashboard-clock/media
double_tap_action:
action: none
hold_action:
action: none
tap_action:
action: none
double_tap_action:
action: none
hold_action:
action: none
- type: custom:clock-weather-card
entity: weather.forecast_maison
title: null
sun_entity: sun.sun
temperature_sensor: null
humidity_sensor: null
weather_icon_type: fill
animated_icon: true
forecast_rows: 3
locale: fr-CA
time_pattern: HH:mm
time_format: 24
date_pattern: ccc, d.MM.yy
hide_today_section: false
hide_forecast_section: true
show_humidity: true
hide_clock: true
hide_date: true
hourly_forecast: false
use_browser_time: false
time_zone: null
show_decimal: false
apparent_sensor: null
aqi_sensor: null
card_mod:
style: |
clock-weather-card-today-right-wrap-top {
display: none !important;
}
clock-weather-card-today-right-wrap-center {
font-size: 60px !important;
font-weight: 300 !important;
}
clock-weather-card-today-left {
height: 80px;
display: flex;
width: 80px !important;
}
clock-weather-card-today-right{
width: 150px !important;
}
ha-card {
background: #000000 !important;
}
view_layout:
position: main
- type: custom:button-card
entity: lock.porte
size: 48px
show_name: false
tap_action: none
hold_action: none
double_tap_action: none
view_layout:
position: sidebar
styles:
card:
- height: 80px
state:
- value: locked
color: teal
icon: mdi:lock
- value: unlocked
color: red
icon: mdi:lock-open
card_mod:
style: |
ha-card {
background: #000000 !important;
}
ha-state-icon {
background: #000000;
}
- type: custom:button-card
entity: alarm_control_panel.home_alarm
size: 48px
show_name: false
tap_action: none
hold_action: none
double_tap_action: none
view_layout:
position: sidebar
state:
- value: armed_home
color: teal
icon: mdi:shield-home
- value: armed_away
color: teal
icon: mdi:shield-lock
- value: disarmed
color: red
icon: mdi:shield-off
- value: arming
color: orange
icon: mdi:shield
styles:
card:
- animation: blink 2s ease infinite
styles:
card:
- height: 80px
card_mod:
style: |
ha-card {
background: #000000 !important;
}
ha-icon {
height: 48px;
display: inline-block;
}
- type: custom:button-card
entity: input_button.bouton_vide
icon: mdi:leaf
color: orange
size: 48px
show_name: false
tap_action: none
hold_action: none
double_tap_action: none
view_layout:
position: sidebar
visibility:
- condition: or
conditions:
- condition: numeric_state
entity: sensor.capteur_hibiscus_humidite_du_sol
below: 70
- condition: numeric_state
entity: sensor.capteur_crassula_humidite_du_sol
below: 55
- condition: numeric_state
entity: sensor.capteur_dracaena_humidite_du_sol
below: 75
- condition: numeric_state
entity: sensor.capteur_palmier_de_montagne_humidite_du_sol
below: 85
styles:
card:
- height: 80px
card_mod:
style: |
ha-card {
background: #000000 !important;
}
ha-icon {
height: 48px;
display: inline-block;
}
- event_grouping: true
drop_todayevents_from: "15:00:00"
next_days: 1
pattern:
- icon: mdi:flower
color: lime
type: organic
- icon: mdi:newspaper
color: blue
type: paper
- icon: mdi:recycle
color: orange
type: recycle
pattern: Recyclage
pattern_exact: true
- icon: mdi:trash-can
color: orange
type: waste
pattern: Poubelle
pattern_exact: true
- icon: mdi:dump-truck
color: purple
type: others
day_style: custom
day_style_format: " "
alignment_style: left
color_mode: icon
items_per_row: 1
refresh_rate: 60
with_label: false
layout: vertical
type: custom:trash-card
entities:
- calendar.matieres_residuelles
hide_time_range: true
only_all_day_events: true
grid_options:
columns: 3
rows: 2
view_layout:
position: sidebar
icon_size: 48
full_size: false
card_mod:
style: |
.badge {
display: none !important;
}
ha-tile-icon {
--mdc-icon-size: 48px;
margin: 6px !important
}
ha-tile-info {
display: none !important;
}
ha-card {
background: #000000 !important;
}
background:
opacity: 100
alignment: center
size: cover
repeat: repeat
attachment: fixed
image: /api/image/serve/e41cbcf8d96e38cf4646002310a0c3b4/original
theme: ios-dark-mode-blue-red-alternative
title: Clock
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment