Update visual editor and screenshots

README.md

@@ -76,6 +76,7 @@ entity: input_datetime.alarm_time
 hour_mode: 12
 layout:
   hour_mode: single
+  align_controls: right
 hide:
   name: true
 ```
@@ -89,9 +90,15 @@ type: 'custom:time-picker-card'
 entity: input_datetime.alarm_time
 layout:
   name: inside
-  align_controls: right
+  align_controls: center
 ```
 
+### Dark theme, embedded layout
+![Dark theme embedded](https://raw.githubusercontent.com/GeorgeSG/lovelace-time-picker-card/master/examples/dark_embedded.png)
+
+### Dark theme, thin layout
+![Dark theme thin layout](https://raw.githubusercontent.com/GeorgeSG/lovelace-time-picker-card/master/examples/dark_thin.png)
+
 ### With a custom lovelace theme
 
 ![Custom theme](https://raw.githubusercontent.com/GeorgeSG/lovelace-time-picker-card/master/examples/custom.png)

src/const.ts

@@ -10,7 +10,7 @@ export const ENTITY_DOMAIN = 'input_datetime';
 export const DEFAULT_HOUR_STEP = 1;
 export const DEFAULT_MINUTE_STEP = 5;
 export const DEFAULT_SECOND_STEP = 5;
-export const DEFAULT_HOUR_MODE = 12;
+export const DEFAULT_HOUR_MODE = 24;
 export const DEFAULT_LAYOUT_HOUR_MODE: Layout.HourMode = 'double';
 export const DEFAULT_LAYOUT_ALIGN_CONTROLS = Layout.AlignControls.CENTER;
 export const DEFAULT_LAYOUT_NAME = Layout.Name.HEADER;

src/editor.ts

@@ -45,7 +45,6 @@ const SCHEMA = [
       {
         name: 'hour_mode',
         type: 'select',
-        default: ['24'],
         options: [
           [12, '12'],
           [24, '24'],
@@ -62,7 +61,6 @@ const SCHEMA = [
       {
         name: 'hour_mode',
         type: 'select',
-        default: ['single'],
         options: [
           ['single', 'single'],
           ['double', 'double'],
@@ -71,7 +69,6 @@ const SCHEMA = [
       {
         name: 'align_controls',
         type: 'select',
-        default: 'center',
         options: [
           ['left', 'left'],
           ['center', 'center'],
@@ -81,7 +78,6 @@ const SCHEMA = [
       {
         name: 'name',
         type: 'select',
-        default: ['header'],
         options: [
           ['header', 'header'],
           ['inside', 'inside'],
@@ -102,7 +98,7 @@ const SCHEMA = [
         schema: [
           { name: 'name', type: 'boolean' },
           { name: 'icon', type: 'boolean' },
-          { name: 'seconds', type: 'boolean', default: true },
+          { name: 'seconds', type: 'boolean' },
         ],
       },
     ],