[datefield.edc] datefield widget is redesigned with ctxpopup & diskselector integrati...

Change-Id: I233f731107631e004a3b4f2df03d7f50c735009d

diff --git a/themes/groups/ctxpopup.edc b/themes/groups/ctxpopup.edc
index 2f56cda..3260f6f 100644 (file)
--- a/themes/groups/ctxpopup.edc
+++ b/themes/groups/ctxpopup.edc
@@ -2946,6 +2946,7 @@ group {
 ///////////////////////////////////////////////////////////////////////////////
 group {
        name: "elm/ctxpopup/base/extended/timepicker";
+    alias:"elm/ctxpopup/base/extended/timepicker/default";
        parts {
                part {
                        name: "ctxpopup_frame";
@@ -3115,6 +3116,7 @@ group {
 }
 ///////////////////////////////////////////////////////////////////////////////
 group { name: "elm/ctxpopup/arrow/extended/timepicker";
+        alias: "elm/ctxpopup/arrow/extended/timepicker/default";
        images {
                image: "timepicker_left_arrow.png" COMP;
                image: "timepicker_right_arrow.png" COMP;
@@ -3210,6 +3212,7 @@ group { name: "elm/ctxpopup/arrow/extended/timepicker";
 ///////////////////////////////////////////////////////////////////////////////
 group {
        name: "elm/ctxpopup/text_style_item/extended/timepicker";
+    alias: "elm/ctxpopup/text_style_item/extended/timepicker/default";
        parts {
                part {
                        name: "left_padding";

diff --git a/themes/groups/datefield.edc b/themes/groups/datefield.edc
index 8f4d880..3870cbb 100644 (file)
--- a/themes/groups/datefield.edc
+++ b/themes/groups/datefield.edc
@@ -21,8 +21,7 @@
  *
  */
 
-#define DATE_HEIGHT   52
-#define TOTAL_HEIGHT  76
+#define DATE_HEIGHT   40
 
 images {
    image: "00_picker_panel_bg.png" COMP;
@@ -42,7 +41,6 @@ group {
       part {
          name: "elm.rect.bg";
          type: RECT;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
@@ -52,36 +50,31 @@ group {
          }
       }
       part {
-         name: "elm.rect.label";
+         name: "elm.rect.date";
          type: RECT;
-         mouse_events: 0;
          scale: 1;
          description {
             state: "default" 0.0;
             visible: 0;
-            min: 0 (TOTAL_HEIGHT-DATE_HEIGHT);
-            align: 0 0;
-            fixed: 0 1;
-            rel1 { relative: 0.0 0.0; }
-            rel2 { relative: 1.0 0.0; }
+            min: 224 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 0.0 0.0; to: "elm.rect.bg"; }
+            rel2 { relative: 0.0 1.0; to: "elm.rect.bg"; }
          }
       }
       part {
-         name: "elm.image.date";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
+         name: "elm.rect.time";
+         type: RECT;
          scale: 1;
          description {
             state: "default" 0.0;
-            min: 0 DATE_HEIGHT;
             visible: 0;
-            rel1 { relative: 0.0 1.0; to_y: "elm.rect.label"; }
-            rel2 { relative: 1.0 1.0; to_y: "elm.rect.bg"; }
-            image {
-               normal: "00_picker_panel_bg.png";
-               border: 1 1 5 5;
-               border_scale: 1;
-            }
+            min: 188 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.time.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.time.pad"; }
          }
       }
       part {
@@ -91,8 +84,11 @@ group {
          description {
             state: "default" 0.0;
             visible: 0;
-            rel1 { relative: 0.0 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.019 1.0; to: "elm.image.date"; }
+            min: 10 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 0.0 0.0; to: "elm.rect.date"; }
+            rel2 { relative: 0.0 1.0; to: "elm.rect.date"; }
          }
       }
       part {
@@ -102,110 +98,79 @@ group {
          description {
             state: "default" 0.0;
             visible: 0;
-            rel1 { relative: 0.981 0.0; to: "elm.image.date"; }
-            rel2 { relative: 1.0 1.0; to: "elm.image.date"; }
+            min: 10 DATE_HEIGHT;
+            align: 1.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.time"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.time"; }
          }
       }
       part {
-         name: "elm.image.date.year.focus";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
+         name: "elm.text.date.year";
+         type: TEXT;
          scale: 1;
          description {
             state: "default" 0.0;
             rel1 { relative: 0.0 0.0; to: "elm.rect.date.year.over"; }
             rel2 { relative: 1.0 1.0; to: "elm.rect.date.year.over"; }
-            image {
-               normal: "00_timepicker_field_bg.png";
-               border: 1 1 5 5;
-               border_scale: 1;
+            color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
+            text {
+               font: "SLP:style=Roman";
+               size: 30;
+               min:  0 0;
+               align: 0.5 0.5;
+               max: 1 0;
             }
          }
-         description {
-            state: "focus" 0.0;
+         description { state: "focused" 0.0;
             inherit: "default" 0.0;
-            image.normal: "00_timepicker_field_bg_focus.png";
+            color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
          }
       }
       part {
-         name: "elm.image.date.month.focus";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
+         name: "elm.text.date.month";
+         type: TEXT;
          scale: 1;
          description {
             state: "default" 0.0;
+            align: 0.5 0.5;
             rel1 { relative: 0.0 0.0; to: "elm.rect.date.month.over"; }
             rel2 { relative: 1.0 1.0; to: "elm.rect.date.month.over"; }
-            image {
-               normal: "00_timepicker_field_bg.png";
-               border: 1 1 5 5;
-               border_scale: 1;
+            color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
+            text {
+               font: "SLP:style=Roman";
+               size: 30;
+               min:  0 0;
+               align: 0.5 0.5;
+               max: 1 0;
             }
          }
-         description {
-            state: "focus" 0.0;
+         description { state: "focused" 0.0;
             inherit: "default" 0.0;
-            image.normal: "00_timepicker_field_bg_focus.png";
+            color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
          }
       }
       part {
-         name: "elm.image.date.day.focus";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
+         name: "elm.text.date.day";
+         type: TEXT;
          scale: 1;
          description {
             state: "default" 0.0;
+            align: 0.5 0.5;
             rel1 { relative: 0.0 0.0; to: "elm.rect.date.day.over"; }
             rel2 { relative: 1.0 1.0; to: "elm.rect.date.day.over"; }
-            image {
-               normal: "00_timepicker_field_bg.png";
-               border: 1 1 5 5;
-               border_scale: 1;
+            color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
+            text {
+               font: "SLP:style=Roman";
+               size: 30;
+               min:  0 0;
+               align: 0.5 0.5;
+               max: 1 0;
             }
          }
-         description {
-            state: "focus" 0.0;
+         description { state: "focused" 0.0;
             inherit: "default" 0.0;
-            image.normal: "00_timepicker_field_bg_focus.png";
-         }
-      }
-      part {
-         name: "elm.swallow.date.year";
-         type: SWALLOW;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-             align: 0.5 0.5;
-             fixed: 1 1;
-            rel1 { relative: 0.5 0.5; to: "elm.rect.date.year.over"; }
-            rel2 { relative: 0.5 0.5; to: "elm.rect.date.year.over"; }
-         }
-      }
-      part {
-         name: "elm.swallow.date.month";
-         type: SWALLOW;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            align: 0.5 0.5;
-             fixed: 1 1;
-            rel1 { relative: 0.5 0.5; to: "elm.rect.date.month.over"; }
-            rel2 { relative: 0.5 0.5; to: "elm.rect.date.month.over"; }
-         }
-      }
-      part {
-         name: "elm.swallow.date.day";
-         type: SWALLOW;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            align: 0.5 0.5;
-             fixed: 1 1;
-            rel1 { relative: 0.5 0.5; to: "elm.rect.date.day.over"; }
-            rel2 { relative: 0.5 0.5; to: "elm.rect.date.day.over"; }
+            color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
          }
       }
       part {
@@ -215,38 +180,41 @@ group {
          description {
             state: "default" 0.0;    //mmddyy
             color: 0 0 0 0;
-            rel1 { relative: 0.340 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.502 1.0; to: "elm.image.date"; }
+            min: 80 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
          description {
             state: "yymmdd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.019 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.181 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "yyddmm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.019 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.181 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "mmyydd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.186 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.348 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "ddyymm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.173 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.335 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "ddmmyy" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.340 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.502 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
       }
       part {
@@ -256,38 +224,41 @@ group {
          description {
             state: "default" 0.0;    //mmddyy
             color: 0 0 0 0;
-            rel1 { relative: 0.019 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.165 1.0; to: "elm.image.date"; }
+            min: 60 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "mmyydd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.019 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.165 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "yymmdd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.202 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.348 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "ddmmyy" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.173 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.319 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "ddyymm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.356 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.502 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
          description {
             state: "yyddmm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.356 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.502 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
       }
       part {
@@ -297,210 +268,207 @@ group {
          description {
             state: "default" 0.0;    //mmddyy
             color: 0 0 0 0;
-            rel1 { relative: 0.186 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.319 1.0; to: "elm.image.date"; }
+            min: 40 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "ddmmyy" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.019 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.152 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "ddyymm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.019 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.152 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "yyddmm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.202 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.335 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "yymmdd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.369 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.502 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
          description {
             state: "mmyydd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.369 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.502 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
       }
       part {
-         name: "elm.text.year";
-         type: TEXT;
-         //ignore_flags: ON_HOLD;
+         name: "elm.rect.date.padding1";
+         type: RECT;
          scale: 1;
          description {
-            state: "default" 0.0;
-            text {
-               font: "SLP:style=Medium";
-               size: 18;
-               align: 0.5 0.5;
-               text: "Year";
-            }
-            rel1 { relative: 0.0 0.0; to_x: "elm.rect.date.year.over"; to_y: "elm.rect.label"; }
-            rel2 { relative: 1.0 1.0; to_x: "elm.rect.date.year.over"; to_y: "elm.rect.label"; }
-            color: 200 200 200 255;
+            state: "default" 0.0;    //mmddyy
+            visible: 0;
+            min: 20 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.month.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.month.over"; }
          }
          description {
-            state: "focus" 0.0;
+            state: "ddmmyy" 0.0;
             inherit: "default" 0.0;
-            color: 221 134 21 255;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.day.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.day.over"; }
          }
-      }
-      part {
-         name: "elm.text.month";
-         type: TEXT;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
          description {
-            state: "default" 0.0;
-            text {
-               font: "SLP:style=Medium";
-               size: 18;
-               align: 0.5 0.5;
-               text: "Month";
-            }
-            rel1 { relative: 0.0 0.0; to_x: "elm.rect.date.month.over"; to_y: "elm.rect.label"; }
-            rel2 { relative: 1.0 1.0; to_x: "elm.rect.date.month.over"; to_y: "elm.rect.label"; }
-            color: 200 200 200 255;
+            state: "ddyymm" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.day.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.day.over"; }
          }
          description {
-            state: "focus" 0.0;
+            state: "yyddmm" 0.0;
             inherit: "default" 0.0;
-            color: 221 134 21 255;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.year.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.year.over"; }
          }
-      }
-      part {
-         name: "elm.text.day";
-         type: TEXT;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
          description {
-            state: "default" 0.0;
-            text {
-               font: "SLP:style=Medium";
-               size: 18;
-               align: 0.5 0.5;
-               text: "Day";
-            }
-            rel1 { relative: 0.0 0.0; to_x: "elm.rect.date.day.over"; to_y: "elm.rect.label"; }
-            rel2 { relative: 1.0 1.0; to_x: "elm.rect.date.day.over"; to_y: "elm.rect.label"; }
-            color: 200 200 200 255;
+            state: "yymmdd" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.year.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.year.over"; }
          }
          description {
-            state: "focus" 0.0;
+            state: "mmyydd" 0.0;
             inherit: "default" 0.0;
-            color: 221 134 21 255;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.month.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.month.over"; }
          }
       }
       part {
-         name: "elm.rect.date.time.pad";
+         name: "elm.rect.date.padding2";
          type: RECT;
          scale: 1;
          description {
-            state: "default" 0.0;
-            //min: 17 0;
-            fixed: 1 1;
-            align: 0.0 0.5;
+            state: "default" 0.0;    //mmddyy
             visible: 0;
-            rel1 { relative: 0.502 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.537 1.0; to: "elm.image.date"; }
+            min: 20 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.day.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.day.over"; }
          }
-      }
-      part {
-         name: "elm.image.time.hour";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
          description {
-            state: "default" 0.0;
-            rel1 { relative: 0.0 0.0; to: "elm.rect.time.hour.over"; }
-            rel2 { relative: 1.0 1.0; to: "elm.rect.time.hour.over"; }
-            image {
-               normal: "00_timepicker_field_bg.png";
-               border: 1 1 5 5;
-               border_scale: 1;
-            }
+            state: "ddmmyy" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.month.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.month.over"; }
          }
          description {
-            state: "focus" 0.0;
+            state: "ddyymm" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.year.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.year.over"; }
+         }
+         description {
+            state: "yyddmm" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.day.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.day.over"; }
+         }
+         description {
+            state: "yymmdd" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.month.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.month.over"; }
+         }
+         description {
+            state: "mmyydd" 0.0;
             inherit: "default" 0.0;
-            image.normal: "00_timepicker_field_bg_focus.png";
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.year.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.year.over"; }
          }
       }
       part {
-         name: "elm.image.time.min";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
+         name: "elm.rect.date.time.pad";
+         type: RECT;
          scale: 1;
          description {
             state: "default" 0.0;
-            rel1 { relative: 0.0 0.0; to: "elm.rect.time.min.over"; }
-            rel2 { relative: 1.0 1.0; to: "elm.rect.time.min.over"; }
-            image {
-               normal: "00_timepicker_field_bg.png";
-               border: 1 1 5 5;
-               border_scale: 1;
-            }
-         }
-         description {
-            state: "focus" 0.0;
-            inherit: "default" 0.0;
-            image.normal: "00_timepicker_field_bg_focus.png";
+            visible: 0;
+            min: 44 0;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date"; }
          }
       }
       part {
          name: "elm.image.colon";
          type: IMAGE;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
-            rel1 { relative: 0.67 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.70 1.0; to: "elm.image.date"; }
+            min: 20 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.time.hour.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.time.hour.over"; }
             image {
                normal: "00_timepicker_colon.png";
-               border: 1 1 5 5;
+               border: 0 0 6 6;
                border_scale: 1;
             }
          }
-         description {
-            state: "noampm" 0.0;
-            inherit: "default" 0.0;
-            rel1 { relative: 0.743 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.773 1.0; to: "elm.image.date"; }
-         }
       }
       part {
-         name: "elm.swallow.time.hour";
-         type: SWALLOW;
-         //ignore_flags: ON_HOLD;
+         name: "elm.text.time.hour";
+         type: TEXT;
          scale: 1;
          description {
             state: "default" 0.0;
             align: 0.5 0.5;
-             fixed: 1 1;
-            rel1 { relative: 0.5 0.5; to: "elm.rect.time.hour.over"; }
-            rel2 { relative: 0.5 0.5; to: "elm.rect.time.hour.over"; }
+            rel1 { relative: 0.0 0.0; to: "elm.rect.time.hour.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.time.hour.over"; }
+            color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
+            text {
+               font: "SLP:style=Roman";
+               size: 30;
+               min:  0 0;
+               align: 0.5 0.5;
+               max: 1 0;
+            }
+         }
+         description { state: "focused" 0.0;
+            inherit: "default" 0.0;
+            color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
          }
       }
       part {
-         name: "elm.swallow.time.min";
-         type: SWALLOW;
+         name: "elm.text.time.min";
+         type: TEXT;
          scale: 1;
          description {
             state: "default" 0.0;
             align: 0.5 0.5;
-             fixed: 1 1;
-            rel1 { relative: 0.5 0.5; to: "elm.rect.time.min.over"; }
-            rel2 { relative: 0.5 0.5; to: "elm.rect.time.min.over"; }
+            rel1 { relative: 0.0 0.0; to: "elm.rect.time.min.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.time.min.over"; }
+            color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
+            text {
+               font: "SLP:style=Roman";
+               size: 30;
+               min:  0 0;
+               align: 0.5 0.5;
+               max: 1 0;
+            }
+         }
+         description { state: "focused" 0.0;
+            inherit: "default" 0.0;
+            color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
          }
       }
       part {
@@ -510,14 +478,11 @@ group {
          description {
             state: "default" 0.0;
             color: 0 0 0 0;
-            rel1 { relative: 0.537 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.67 1.0; to: "elm.image.date"; }
-         }
-         description {
-            state: "noampm" 0.0;
-            inherit: "default" 0.0;
-            rel1 { relative: 0.537 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.743 1.0; to: "elm.image.date"; }
+            min: 40 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 0.0 0.0; to: "elm.rect.time"; }
+            rel2 { relative: 0.0 1.0; to: "elm.rect.time"; }
          }
       }
       part {
@@ -527,14 +492,11 @@ group {
          description {
             state: "default" 0.0;
             color: 0 0 0 0;
-            rel1 { relative: 0.7 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.833 1.0; to: "elm.image.date"; }
-         }
-         description {
-            state: "noampm" 0.0;
-            inherit: "default" 0.0;
-            rel1 { relative: 0.773 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.981 1.0; to: "elm.image.date"; }
+            min: 40 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.image.colon"; }
+            rel2 { relative: 1.0 1.0; to: "elm.image.colon"; }
          }
       }
       part {
@@ -543,9 +505,9 @@ group {
          scale: 1;
          description {
             state: "default" 0.0;
-            min: 10 0;
-            fixed: 1 0;
             visible: 0;
+            min: 30 DATE_HEIGHT;
+            fixed: 1 0;
             rel1 { relative: 1.0 0.0; to: "elm.rect.time.min.over"; }
             rel2 { relative: 1.0 1.0; to: "elm.rect.time.min.over"; }
          }
@@ -558,28 +520,29 @@ group {
       part {
          name: "elm.rect.ampm";
          type: RECT;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
-            visible: 0;
-            rel1 { relative: 0.854 0.0; to: "elm.image.date";}
-            rel2 { relative: 0.981 1.0; to: "elm.image.date";}
+            color: 0 0 0 0;
+            min: 64 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.ampm.pad";}
+            rel2 { relative: 1.0 1.0; to: "elm.rect.ampm.pad";}
          }
          description {
             state: "noampm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 1.0 0.0; to: "elm.image.date";}
-            rel2 { relative: 1.0 1.0; to: "elm.image.date";}
+            min: 0 0;
          }
       }
       part {
          name: "elm.swallow.time.ampm";
          type: SWALLOW;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
+            fixed: 0 1;
             rel1 { relative: 0.0 0.5; to: "elm.rect.ampm"; }
             rel2 { relative: 1.0 0.5; to: "elm.rect.ampm"; }
          }
@@ -592,82 +555,6 @@ group {
    }
    programs {
       program {
-         name: "year_focus_in";
-         signal: "elm,state,year,focus,in";
-         source: "elm";
-         action: STATE_SET "focus" 0.0;
-         target: "elm.image.date.year.focus";
-         target: "elm.text.year";
-      }
-      program {
-         name: "year_focus_out";
-         signal: "elm,state,year,focus,out";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.image.date.year.focus";
-         target: "elm.text.year";
-      }
-      program {
-         name: "month_focus_in";
-         signal: "elm,state,month,focus,in";
-         source: "elm";
-         action: STATE_SET "focus" 0.0;
-         target: "elm.image.date.month.focus";
-         target: "elm.text.month";
-      }
-      program {
-         name: "month_focus_out";
-         signal: "elm,state,month,focus,out";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.image.date.month.focus";
-         target: "elm.text.month";
-      }
-      program {
-         name: "day_focus_in";
-         signal: "elm,state,day,focus,in";
-         source: "elm";
-         action: STATE_SET "focus" 0.0;
-         target: "elm.image.date.day.focus";
-         target: "elm.text.day";
-      }
-      program {
-         name: "day_focus_out";
-         signal: "elm,state,day,focus,out";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.image.date.day.focus";
-         target: "elm.text.day";
-      }
-      program {
-         name: "hour_focus_in";
-         signal: "elm,state,hour,focus,in";
-         source: "elm";
-         action: STATE_SET "focus" 0.0;
-         target: "elm.image.time.hour";
-      }
-      program {
-         name: "hour_focus_out";
-         signal: "elm,state,hour,focus,out";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.image.time.hour";
-      }
-      program {
-         name: "min_focus_in";
-         signal: "elm,state,min,focus,in";
-         source: "elm";
-         action: STATE_SET "focus" 0.0;
-         target: "elm.image.time.min";
-      }
-      program {
-         name: "min_focus_out";
-         signal: "elm,state,min,focus,out";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.image.time.min";
-      }
-      program {
          name: "format_yyddmm";
          signal: "elm,state,format,yyddmm";
          source: "elm";
@@ -675,6 +562,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "format_yymmdd";
@@ -684,6 +573,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "format_mmyydd";
@@ -693,6 +584,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "format_ddyymm";
@@ -702,6 +595,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "format_mmddyy";
@@ -711,6 +606,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "format_ddmmyy";
@@ -720,6 +617,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "24h_mode";
@@ -729,9 +628,6 @@ group {
          target: "elm.rect.ampm.pad";
          target: "elm.rect.ampm";
          target: "elm.swallow.time.ampm";
-         target: "elm.rect.time.hour.over";
-         target: "elm.rect.time.min.over";
-         target: "elm.image.colon";
       }
       program {
          name: "12h_mode";
@@ -741,9 +637,76 @@ group {
          target: "elm.rect.ampm.pad";
          target: "elm.rect.ampm";
          target: "elm.swallow.time.ampm";
-         target: "elm.rect.time.hour.over";
-         target: "elm.rect.time.min.over";
-         target: "elm.image.colon";
+      }
+      program {
+         name: "day_focused";
+         signal: "elm,state,day,focus,in";
+         source: "elm";
+         action: STATE_SET "focused" 0.0;
+         target: "elm.text.date.day";
+      }
+      program {
+         name: "day_unfocused";
+         signal: "elm,state,day,focus,out";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "elm.text.date.day";
+      }
+      program {
+         name: "month_focused";
+         signal: "elm,state,month,focus,in";
+         source: "elm";
+         action: STATE_SET "focused" 0.0;
+         target: "elm.text.date.month";
+      }
+      program {
+         name: "month_unfocused";
+         signal: "elm,state,month,focus,out";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "elm.text.date.month";
+      }
+      program {
+         name: "year_focused";
+         signal: "elm,state,year,focus,in";
+         source: "elm";
+         action: STATE_SET "focused" 0.0;
+         target: "elm.text.date.year";
+      }
+      program {
+         name: "year_unfocused";
+         signal: "elm,state,year,focus,out";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "elm.text.date.year";
+      }
+      program {
+         name: "hour_focused";
+         signal: "elm,state,hour,focus,in";
+         source: "elm";
+         action: STATE_SET "focused" 0.0;
+         target: "elm.text.time.hour";
+      }
+      program {
+         name: "min_focused";
+         signal: "elm,state,min,focus,in";
+         source: "elm";
+         action: STATE_SET "focused" 0.0;
+         target: "elm.text.time.min";
+      }
+      program {
+         name: "hour_unfocused";
+         signal: "elm,state,hour,focus,out";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "elm.text.time.hour";
+      }
+      program {
+         name: "min_unfocused";
+         signal: "elm,state,min,focus,out";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "elm.text.time.min";
       }
    }
 }
@@ -756,48 +719,25 @@ group {
       part {
          name: "elm.rect.bg";
          type: RECT;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
             visible: 0;
-            //min: 0 TOTAL_HEIGHT;
             rel1 { relative: 0.0 0.0; }
             rel2 { relative: 1.0 1.0; }
          }
       }
       part {
-         name: "elm.rect.label";
+         name: "elm.rect.time";
          type: RECT;
-         mouse_events: 0;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            visible: 0;
-            min: 0 (TOTAL_HEIGHT-DATE_HEIGHT);
-            align: 0 0;
-            fixed: 0 1;
-            rel1 { relative: 0.0 0.0; }
-            rel2 { relative: 1.0 0.0; }
-         }
-      }
-      part {
-         name: "elm.image.time";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
             visible: 0;
-            min: 0 DATE_HEIGHT;
-            align: 0 0;
-            rel1 { relative: 0.0 1.0; to_y: "elm.rect.label";}
-            rel2 { relative: 1.0 1.0; to_y: "elm.rect.bg";}
-            image {
-               normal: "00_picker_panel_bg.png";
-               border: 1 1 5 5;
-               border_scale: 1;
-            }
+            align: 0.5 0.5;
+            min: 170 DATE_HEIGHT;
+            rel1 { relative: 0.0 0.0; to: "elm.rect.bg";}
+            rel2 { relative: 1.0 1.0; to: "elm.rect.bg";}
          }
       }
       part {
@@ -808,92 +748,74 @@ group {
             state: "default" 0.0;
             align: 0.0 0.5;
             visible: 0;
-            rel1 { relative: 0.0 0.0; to: "elm.image.time"; }
-            rel2 { relative: 0.214 1.0; to: "elm.image.time"; }
-         }
-      }
-      part {
-         name: "elm.image.time.hour";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            rel1 { relative: 0.0 0.0; to: "elm.rect.time.hour.over"; }
-            rel2 { relative: 1.0 1.0; to: "elm.rect.time.hour.over"; }
-            image {
-               normal: "00_timepicker_field_bg.png";
-               border: 1 1 10 10;
-               border_scale: 1;
-            }
-         }
-         description {
-            state: "focus" 0.0;
-            inherit: "default" 0.0;
-            image.normal: "00_timepicker_field_bg_focus.png";
-         }
-      }
-      part {
-         name: "elm.image.time.min";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            rel1 { relative: 0.0 0.0; to: "elm.rect.time.min.over"; }
-            rel2 { relative: 1.0 1.0; to: "elm.rect.time.min.over"; }
-            image {
-               normal: "00_timepicker_field_bg.png";
-               border: 1 1 10 10;
-               border_scale: 1;
-            }
-         }
-         description {
-            state: "focus" 0.0;
-            inherit: "default" 0.0;
-            image.normal: "00_timepicker_field_bg_focus.png";
+            min: 20 DATE_HEIGHT;
+            fixed: 1 0;
+            rel1 { relative: 0.0 0.0; to: "elm.rect.time"; }
+            rel2 { relative: 0.0 1.0; to: "elm.rect.time"; }
          }
       }
       part {
          name: "elm.image.colon";
          type: IMAGE;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
+            min: 20 DATE_HEIGHT;
+            align: 0.0 0.5;
             fixed: 1 0;
             rel1 { relative: 1.0 0.0; to: "elm.rect.time.hour.over"; }
-            rel2 { relative: 0.0 1.0; to: "elm.rect.time.min.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.time.hour.over"; }
             image {
                normal: "00_timepicker_colon.png";
-               border: 1 1 10 10;
+               border: 0 0 6 6;
                border_scale: 1;
             }
          }
       }
       part {
-         name: "elm.swallow.time.hour";
-         type: SWALLOW;
-         //ignore_flags: ON_HOLD;
+         name: "elm.text.time.hour";
+         type: TEXT;
          scale: 1;
          description {
             state: "default" 0.0;
             align: 0.5 0.5;
-             fixed: 1 1;
-            rel1 { relative: 0.5 0.5; to: "elm.rect.time.hour.over"; }
-            rel2 { relative: 0.5 0.5; to: "elm.rect.time.hour.over"; }
+            rel1 { relative: 0.0 0.0; to: "elm.rect.time.hour.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.time.hour.over"; }
+            color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
+            text {
+               font: "SLP:style=Roman";
+               size: 30;
+               min:  0 0;
+               align: 0.5 0.5;
+               max: 1 0;
+            }
+         }
+         description { state: "focused" 0.0;
+            inherit: "default" 0.0;
+            color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
          }
       }
       part {
-         name: "elm.swallow.time.min";
-         type: SWALLOW;
+         name: "elm.text.time.min";
+         type: TEXT;
          scale: 1;
          description {
             state: "default" 0.0;
             align: 0.5 0.5;
-             fixed: 1 1;
-            rel1 { relative: 0.5 0.5; to: "elm.rect.time.min.over"; }
-            rel2 { relative: 0.5 0.5; to: "elm.rect.time.min.over"; }
+            rel1 { relative: 0.0 0.0; to: "elm.rect.time.min.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.time.min.over"; }
+            color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
+            text {
+               font: "SLP:style=Roman";
+               size: 30;
+               min:  0 0;
+               align: 0.5 0.5;
+               max: 1 0;
+            }
+         }
+         description { state: "focused" 0.0;
+            inherit: "default" 0.0;
+            color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
          }
       }
       part {
@@ -903,14 +825,11 @@ group {
          description {
             state: "default" 0.0;
             color: 0 0 0 0;
-            rel1 { relative: 0.214 0.0; to: "elm.image.time"; }
-            rel2 { relative: 0.398 1.0; to: "elm.image.time"; }
-         }
-         description {
-            state: "hidden" 0.0;
-            inherit: "default" 0.0;
-            rel1 { relative: 0.214 0.0; to: "elm.image.time"; }
-            rel2 { relative: 0.48 1.0; to: "elm.image.time"; }
+            min: 40 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.left.pad"; }
          }
       }
       part {
@@ -919,61 +838,12 @@ group {
          scale: 1;
          description {
             state: "default" 0.0;
-            color: 0 0 0 0;
-            rel1 { relative: 0.437 0.0; to: "elm.image.time"; }
-            rel2 { relative: 0.62 1.0; to: "elm.image.time"; }
-         }
-         description {
-            state: "hidden" 0.0;
-            inherit: "default" 0.0;
-            rel1 { relative: 0.5 0.0; to: "elm.image.time"; }
-            rel2 { relative: 0.785 1.0; to: "elm.image.time"; }
-         }
-      }
-      part {
-         name: "elm.text.hour";
-         type: TEXT;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            text {
-               font: "SLP:style=Medium";
-               size: 18;
-               align: 0.5 0.5;
-               text: "Hour";
-            }
-            rel1 { relative: 0.0 0.0; to_x: "elm.rect.time.hour.over"; to_y: "elm.rect.label"; }
-            rel2 { relative: 1.0 1.0; to_x: "elm.rect.time.hour.over"; to_y: "elm.rect.label"; }
-            color: 200 200 200 255;
-         }
-         description {
-            state: "focus" 0.0;
-            inherit: "default" 0.0;
-            color: 221 134 21 255;
-         }
-      }
-      part {
-         name: "elm.text.min";
-         type: TEXT;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            text {
-               font: "SLP:style=Medium";
-               size: 18;
-               align: 0.5 0.5;
-               text: "Minute";
-            }
-            rel1 { relative: 0.0 0.0; to_x: "elm.rect.time.min.over"; to_y: "elm.rect.label"; }
-            rel2 { relative: 1.0 1.0; to_x: "elm.rect.time.min.over"; to_y: "elm.rect.label"; }
-            color: 200 200 200 255;
-         }
-         description {
-            state: "focus" 0.0;
-            inherit: "default" 0.0;
-            color: 221 134 21 255;
+            color: 0 0 0 0;;
+            min: 40 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.image.colon"; }
+            rel2 { relative: 1.0 1.0; to: "elm.image.colon"; }
          }
       }
       part {
@@ -982,15 +852,15 @@ group {
          scale: 1;
          description {
             state: "default" 0.0;
-            min: 18 0;
-            fixed: 1 1;
-            align: 0.0 0.5;
             visible: 0;
+            min: 30 DATE_HEIGHT;
+            fixed: 1 0;
+            align: 0.0 0.5;
             rel1 { relative: 1.0 0.0; to: "elm.rect.time.min.over"; }
             rel2 { relative: 1.0 1.0; to: "elm.rect.time.min.over"; }
          }
          description {
-            state: "hidden" 0.0;
+            state: "noampm" 0.0;
             inherit: "default" 0.0;
             min: 0 0;
          }
@@ -998,27 +868,35 @@ group {
       part {
          name: "elm.rect.ampm";
          type: RECT;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
-            visible: 0;
+            color: 0 0 0 0;
+            min: 64 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
             rel1 { relative: 1.0 0.0; to: "elm.rect.ampm.pad"; }
-            rel2 { relative: 0.0 1.0; to: "elm.rect.right.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.ampm.pad"; }
+         }
+         description {
+            state: "noampm" 0.0;
+            inherit: "default" 0.0;
+            min: 0 0;
          }
       }
       part {
          name: "elm.swallow.time.ampm";
          type: SWALLOW;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
-            rel1 { relative: 0.0 0.5; to: "elm.rect.ampm"; }
-            rel2 { relative: 1.0 0.5; to: "elm.rect.ampm"; }
+            fixed: 1 1;
+            min: 64 DATE_HEIGHT;
+            rel1 { relative: 0.5 0.5; to: "elm.rect.ampm"; }
+            rel2 { relative: 0.5 0.5; to: "elm.rect.ampm"; }
          }
          description {
-            state: "hidden" 0.0;
+            state: "noampm" 0.0;
             inherit: "default" 0.0;
             visible: 0;
          }
@@ -1031,63 +909,60 @@ group {
             state: "default" 0.0;
             align: 0.0 0.5;
             visible: 0;
-            rel1 { relative: 0.785 0.0; to: "elm.image.time"; }
-            rel2 { relative: 1.0 1.0; to: "elm.image.time"; }
+            min: 20 DATE_HEIGHT;
+            fixed: 1 0;
+            color: 0 0 255 255;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.ampm"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.ampm"; }
          }
       }
    }
    programs {
       program {
-         name: "hour_focus_in";
-         signal: "elm,state,hour,focus,in";
+         name: "24h_mode";
+         signal: "elm,state,mode,24h";
          source: "elm";
-         action: STATE_SET "focus" 0.0;
-         target: "elm.image.time.hour";
-         target: "elm.text.hour";
+         action: STATE_SET "noampm" 0.0;
+         target: "elm.rect.ampm.pad";
+         target: "elm.rect.ampm";
+         target: "elm.swallow.time.ampm";
       }
       program {
-         name: "hour_focus_out";
-         signal: "elm,state,hour,focus,out";
+         name: "12h_mode";
+         signal: "elm,state,mode,12h";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.image.time.hour";
-         target: "elm.text.hour";
+         target: "elm.rect.ampm.pad";
+         target: "elm.rect.ampm";
+         target: "elm.swallow.time.ampm";
+      }
+      program {
+         name: "hour_focused";
+         signal: "elm,state,hour,focus,in";
+         source: "elm";
+         action: STATE_SET "focused" 0.0;
+         target: "elm.text.time.hour";
       }
       program {
-         name: "min_focus_in";
+         name: "min_focused";
          signal: "elm,state,min,focus,in";
          source: "elm";
-         action: STATE_SET "focus" 0.0;
-         target: "elm.image.time.min";
-         target: "elm.text.min";
+         action: STATE_SET "focused" 0.0;
+         target: "elm.text.time.min";
       }
       program {
-         name: "min_focus_out";
-         signal: "elm,state,min,focus,out";
+         name: "hour_unfocused";
+         signal: "elm,state,hour,focus,out";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.image.time.min";
-         target: "elm.text.min";
-      }
-      program {
-         name: "24h_mode";
-         signal: "elm,state,mode,24h";
-         source: "elm";
-         action: STATE_SET "hidden" 0.0;
-         target: "elm.rect.ampm.pad";
-         target: "elm.swallow.time.ampm";
-         target: "elm.rect.time.hour.over";
-         target: "elm.rect.time.min.over";
+         target: "elm.text.time.hour";
       }
       program {
-         name: "12h_mode";
-         signal: "elm,state,mode,12h";
+         name: "min_unfocused";
+         signal: "elm,state,min,focus,out";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.rect.ampm.pad";
-         target: "elm.swallow.time.ampm";
-         target: "elm.rect.time.hour.over";
-         target: "elm.rect.time.min.over";
+         target: "elm.text.time.min";
       }
    }
 }
@@ -1100,7 +975,6 @@ group {
       part {
          name: "elm.rect.bg";
          type: RECT;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
@@ -1110,36 +984,16 @@ group {
          }
       }
       part {
-         name: "elm.rect.label";
-         type: RECT;
-         mouse_events: 0;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            visible: 0;
-            min: 0 (TOTAL_HEIGHT-DATE_HEIGHT);
-            align: 0 0;
-            fixed: 0 1;
-            rel1 { relative: 0.0 0.0; }
-            rel2 { relative: 1.0 0.0; }
-         }
-      }
-      part {
-         name: "elm.image.date";
+         name: "elm.rect.date";
          type: IMAGE;
-         //ignore_flags: ON_HOLD;
          scale: 1;
          description {
             state: "default" 0.0;
             visible: 0;
-            min: 0 DATE_HEIGHT;
-            rel1 { relative: 0.0 1.0; to_y: "elm.rect.label"; }
-            rel2 { relative: 1.0 1.0; to_y: "elm.rect.bg"; }
-            image {
-               normal: "00_picker_panel_bg.png";
-               border: 1 1 5 5;
-               border_scale: 1;
-            }
+            min: 254 DATE_HEIGHT;
+            align: 0.5 0.5;
+            rel1 { relative: 0.0 0.0; to: "elm.rect.bg"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.bg"; }
          }
       }
       part {
@@ -1149,121 +1003,74 @@ group {
          description {
             state: "default" 0.0;
             visible: 0;
-            rel1 { relative: 0.0 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.167 1.0; to: "elm.image.date"; }
-         }
-      }
-      part {
-         name: "elm.rect.date.right.pad";
-         type: RECT;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            visible: 0;
-            rel1 { relative: 0.833 0.0; to: "elm.image.date"; }
-            rel2 { relative: 1.0 1.0; to: "elm.image.date"; }
+            min: 20 DATE_HEIGHT;
+            fixed: 1 0;
+            rel1 { relative: 0.0 0.0; to: "elm.rect.date"; }
+            rel2 { relative: 0.0 1.0; to: "elm.rect.date"; }
          }
       }
       part {
-         name: "elm.image.date.year";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
+         name: "elm.text.date.year";
+         type: TEXT;
          scale: 1;
          description {
             state: "default" 0.0;
+             align: 0.5 0.5;
             rel1 { relative: 0.0 0.0; to: "elm.rect.date.year.over"; }
             rel2 { relative: 1.0 1.0; to: "elm.rect.date.year.over"; }
-            image {
-               normal: "00_timepicker_field_bg.png";
-               border: 1 1 10 10;
-               border_scale: 1;
+            color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
+            text {
+               font: "SLP:style=Roman";
+               size: 30;
+               min: 0 0;
+               max: 1 0;
             }
          }
-         description {
-            state: "focus" 0.0;
+         description { state: "focused" 0.0;
             inherit: "default" 0.0;
-            image.normal: "00_timepicker_field_bg_focus.png";
+            color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
          }
       }
       part {
-         name: "elm.image.date.month";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
+         name: "elm.text.date.month";
+         type: TEXT;
          scale: 1;
          description {
             state: "default" 0.0;
             rel1 { relative: 0.0 0.0; to: "elm.rect.date.month.over"; }
             rel2 { relative: 1.0 1.0; to: "elm.rect.date.month.over"; }
-            image {
-               normal: "00_timepicker_field_bg.png";
-               border: 1 1 10 10;
-               border_scale: 1;
+            color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
+            text {
+               font: "SLP:style=Roman";
+               size: 30;
+               min: 0 0;
+               max: 1 0;
             }
          }
-         description {
-            state: "focus" 0.0;
+         description { state: "focused" 0.0;
             inherit: "default" 0.0;
-            image.normal: "00_timepicker_field_bg_focus.png";
+            color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
          }
       }
       part {
-         name: "elm.image.date.day";
-         type: IMAGE;
-         //ignore_flags: ON_HOLD;
+         name: "elm.text.date.day";
+         type: TEXT;
          scale: 1;
          description {
             state: "default" 0.0;
             rel1 { relative: 0.0 0.0; to: "elm.rect.date.day.over"; }
             rel2 { relative: 1.0 1.0; to: "elm.rect.date.day.over"; }
-            image {
-               normal: "00_timepicker_field_bg.png";
-               border: 1 1 10 10;
-               border_scale: 1;
+            color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
+            text {
+               font: "SLP:style=Roman";
+               size: 30;
+               min: 0 0;
+               max: 1 0;
             }
          }
-         description {
-            state: "focus" 0.0;
+         description { state: "focused" 0.0;
             inherit: "default" 0.0;
-            image.normal: "00_timepicker_field_bg_focus.png";
-         }
-      }
-      part {
-         name: "elm.swallow.date.year";
-         type: SWALLOW;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-             align: 0.5 0.5;
-             fixed: 1 1;
-            rel1 { relative: 0.5 0.5; to: "elm.rect.date.year.over"; }
-            rel2 { relative: 0.5 0.5; to: "elm.rect.date.year.over"; }
-         }
-      }
-      part {
-         name: "elm.swallow.date.month";
-         type: SWALLOW;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            align: 0.5 0.5;
-             fixed: 1 1;
-            rel1 { relative: 0.5 0.5; to: "elm.rect.date.month.over"; }
-            rel2 { relative: 0.5 0.5; to: "elm.rect.date.month.over"; }
-         }
-      }
-      part {
-         name: "elm.swallow.date.day";
-         type: SWALLOW;
-         //ignore_flags: ON_HOLD;
-         scale: 1;
-         description {
-            state: "default" 0.0;
-            align: 0.5 0.5;
-             fixed: 1 1;
-            rel1 { relative: 0.5 0.5; to: "elm.rect.date.day.over"; }
-            rel2 { relative: 0.5 0.5; to: "elm.rect.date.day.over"; }
+            color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
          }
       }
       part {
@@ -1273,38 +1080,41 @@ group {
          description {
             state: "default" 0.0;    //mmddyy
             color: 0 0 0 0;
-            rel1 { relative: 0.613 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.833 1.0; to: "elm.image.date"; }
+            min: 84 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
          description {
             state: "yymmdd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.167 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.387 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "yyddmm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.167 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.387 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "mmyydd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.4 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.62 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "ddyymm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.38 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.6 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "ddmmyy" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.613 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.833 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
       }
       part {
@@ -1314,38 +1124,41 @@ group {
          description {
             state: "default" 0.0;    //mmddyy
             color: 0 0 0 0;
-            rel1 { relative: 0.167 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.367 1.0; to: "elm.image.date"; }
+            min: 64 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "mmyydd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.167 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.367 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "yymmdd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.42 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.62 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "ddmmyy" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.38 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.58 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "ddyymm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.633 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.833 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
          description {
             state: "yyddmm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.633 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.833 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
       }
       part {
@@ -1355,160 +1168,148 @@ group {
          description {
             state: "default" 0.0;    //mmddyy
             color: 0 0 0 0;
-            rel1 { relative: 0.4 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.58 1.0; to: "elm.image.date"; }
+            min: 40 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "ddmmyy" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.167 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.247 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "ddyymm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.167 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.247 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.left.pad"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.left.pad"; }
          }
          description {
             state: "yyddmm" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.42 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.60 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding1"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding1"; }
          }
          description {
             state: "yymmdd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.653 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.833 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
          description {
             state: "mmyydd" 0.0;
             inherit: "default" 0.0;
-            rel1 { relative: 0.653 0.0; to: "elm.image.date"; }
-            rel2 { relative: 0.833 1.0; to: "elm.image.date"; }
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.padding2"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.padding2"; }
          }
       }
       part {
-         name: "elm.text.year";
-         type: TEXT;
-         //ignore_flags: ON_HOLD;
+         name: "elm.rect.date.padding1";
+         type: RECT;
          scale: 1;
          description {
-            state: "default" 0.0;
-            text {
-               font: "SLP:style=Medium";
-               size: 18;
-               align: 0.5 0.5;
-               text: "Year";
-            }
-            rel1 { relative: 0.0 0.0; to_x: "elm.rect.date.year.over"; to_y: "elm.rect.label"; }
-            rel2 { relative: 1.0 1.0; to_x: "elm.rect.date.year.over"; to_y: "elm.rect.label"; }
-            color: 200 200 200 255;
+            state: "default" 0.0;    //mmddyy
+            visible: 0;
+            min: 20 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.month.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.month.over"; }
          }
          description {
-            state: "focus" 0.0;
+            state: "ddmmyy" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.day.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.day.over"; }
+         }
+         description {
+            state: "ddyymm" 0.0;
             inherit: "default" 0.0;
-            color: 221 134 21 255;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.day.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.day.over"; }
+         }
+         description {
+            state: "yyddmm" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.year.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.year.over"; }
+         }
+         description {
+            state: "yymmdd" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.year.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.year.over"; }
+         }
+         description {
+            state: "mmyydd" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.month.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.month.over"; }
          }
       }
       part {
-         name: "elm.text.month";
-         type: TEXT;
-         //ignore_flags: ON_HOLD;
+         name: "elm.rect.date.padding2";
+         type: RECT;
          scale: 1;
          description {
-            state: "default" 0.0;
-            text {
-               font: "SLP:style=Medium";
-               size: 18;
-               align: 0.5 0.5;
-               text: "Month";
-            }
-            rel1 { relative: 0.0 0.0; to_x: "elm.rect.date.month.over"; to_y: "elm.rect.label"; }
-            rel2 { relative: 1.0 1.0; to_x: "elm.rect.date.month.over"; to_y: "elm.rect.label"; }
-            color: 200 200 200 255;
+            state: "default" 0.0;    //mmddyy
+            visible: 0;
+            min: 20 DATE_HEIGHT;
+            align: 0.0 0.5;
+            fixed: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.day.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.day.over"; }
          }
          description {
-            state: "focus" 0.0;
+            state: "ddmmyy" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.month.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.month.over"; }
+         }
+         description {
+            state: "ddyymm" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.year.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.year.over"; }
+         }
+         description {
+            state: "yyddmm" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.day.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.day.over"; }
+         }
+         description {
+            state: "yymmdd" 0.0;
+            inherit: "default" 0.0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.month.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.month.over"; }
+         }
+         description {
+            state: "mmyydd" 0.0;
             inherit: "default" 0.0;
-            color: 221 134 21 255;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date.year.over"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date.year.over"; }
          }
       }
       part {
-         name: "elm.text.day";
-         type: TEXT;
-         //ignore_flags: ON_HOLD;
+         name: "elm.rect.date.right.pad";
+         type: RECT;
          scale: 1;
          description {
             state: "default" 0.0;
-            text {
-               font: "SLP:style=Medium";
-               size: 18;
-               align: 0.5 0.5;
-               text: "Day";
-            }
-            rel1 { relative: 0.0 0.0; to_x: "elm.rect.date.day.over"; to_y: "elm.rect.label"; }
-            rel2 { relative: 1.0 1.0; to_x: "elm.rect.date.day.over"; to_y: "elm.rect.label"; }
-            color: 200 200 200 255;
-         }
-         description {
-            state: "focus" 0.0;
-            inherit: "default" 0.0;
-            color: 221 134 21 255;
+            visible: 0;
+            min: 20 DATE_HEIGHT;
+            fixed: 1 0;
+            align: 1 0;
+            rel1 { relative: 1.0 0.0; to: "elm.rect.date"; }
+            rel2 { relative: 1.0 1.0; to: "elm.rect.date"; }
          }
       }
    }
    programs {
       program {
-         name: "year_focus_in";
-         signal: "elm,state,year,focus,in";
-         source: "elm";
-         action: STATE_SET "focus" 0.0;
-         target: "elm.image.date.year";
-         target: "elm.text.year";
-      }
-      program {
-         name: "year_focus_out";
-         signal: "elm,state,year,focus,out";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.image.date.year";
-         target: "elm.text.year";
-      }
-      program {
-         name: "month_focus_in";
-         signal: "elm,state,month,focus,in";
-         source: "elm";
-         action: STATE_SET "focus" 0.0;
-         target: "elm.image.date.month";
-         target: "elm.text.month";
-      }
-      program {
-         name: "month_focus_out";
-         signal: "elm,state,month,focus,out";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.image.date.month";
-         target: "elm.text.month";
-      }
-      program {
-         name: "day_focus_in";
-         signal: "elm,state,day,focus,in";
-         source: "elm";
-         action: STATE_SET "focus" 0.0;
-         target: "elm.image.date.day";
-         target: "elm.text.day";
-      }
-      program {
-         name: "day_focus_out";
-         signal: "elm,state,day,focus,out";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.image.date.day";
-         target: "elm.text.day";
-      }
-      program {
          name: "format_yyddmm";
          signal: "elm,state,format,yyddmm";
          source: "elm";
@@ -1516,6 +1317,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "format_yymmdd";
@@ -1525,6 +1328,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "format_mmyydd";
@@ -1534,6 +1339,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "format_ddyymm";
@@ -1543,6 +1350,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "format_mmddyy";
@@ -1552,6 +1361,8 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
       }
       program {
          name: "format_ddmmyy";
@@ -1561,6 +1372,50 @@ group {
          target: "elm.rect.date.year.over";
          target: "elm.rect.date.month.over";
          target: "elm.rect.date.day.over";
+         target: "elm.rect.date.padding1";
+         target: "elm.rect.date.padding2";
+      }
+      program {
+         name: "day_focused";
+         signal: "elm,state,day,focus,in";
+         source: "elm";
+         action: STATE_SET "focused" 0.0;
+         target: "elm.text.date.day";
+      }
+      program {
+         name: "day_unfocused";
+         signal: "elm,state,day,focus,out";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "elm.text.date.day";
+      }
+      program {
+         name: "month_focused";
+         signal: "elm,state,month,focus,in";
+         source: "elm";
+         action: STATE_SET "focused" 0.0;
+         target: "elm.text.date.month";
+      }
+      program {
+         name: "month_unfocused";
+         signal: "elm,state,month,focus,out";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "elm.text.date.month";
+      }
+      program {
+         name: "year_focused";
+         signal: "elm,state,year,focus,in";
+         source: "elm";
+         action: STATE_SET "focused" 0.0;
+         target: "elm.text.date.year";
+      }
+      program {
+         name: "year_unfocused";
+         signal: "elm,state,year,focus,out";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         target: "elm.text.date.year";
       }
    }
 }
@@ -1733,7 +1588,7 @@ group {
 ///////////////////////////////////////////////////////////////////////////////////////
    group { name: "elm/button/base/datefield.ampm/default";
       images {
-         image: "00_timepicker_field_bg.png" COMP;
+         image: "00_button_01_normal.png" COMP;
       }
       script {
          public button_state = 0; //0:enabled, 1: disabled
@@ -1743,23 +1598,23 @@ group {
             mouse_events: 1;
             scale: 1;
             description { state: "default" 0.0;
-               min: 16 50;
+               min: 16 DATE_HEIGHT;
                image {
-                  normal: "00_timepicker_field_bg.png";
-                  border: 1 1 1 1;
+                  normal: "00_button_01_normal.png";
+                  border: 2 2 10 10;
                   border_scale: 1;
                }
             }
             description { state: "clicked" 0.0;
                inherit: "default" 0.0;
-               image.normal: "00_timepicker_field_bg.png";
+               image.normal: "00_button_01_normal.png";
             }
             description { state: "disabled" 0.0;
                inherit:  "default" 0.0;
             }
             description { state: "focused" 0.0;
                inherit: "default" 0.0;
-               image.normal: "00_timepicker_field_bg.png";
+               image.normal: "00_button_01_normal.png";
             }
          }
          part {
@@ -1773,7 +1628,7 @@ group {
                rel2.relative: 0.0 1.0;
                min: 5 5;
                fixed: 1 0;
-               color: 0 0 0 0;
+               visible: 0;
             }
          }
          part {
@@ -1787,7 +1642,7 @@ group {
                rel2.relative: 1.0 1.0;
                min: 5 5;
                fixed: 1 0;
-               color: 0 0 0 0;
+               visible: 0;
             }
          }
          part {
@@ -1801,7 +1656,7 @@ group {
                rel2.relative: 1.0 0.0;
                min: 5 5;
                fixed: 0 1;
-               color: 0 0 0 0;
+               visible: 0;
             }
          }
          part {
@@ -1815,22 +1670,7 @@ group {
                rel2.relative: 1.0 1.0;
                min: 5 5;
                fixed: 0 1;
-               color: 0 0 0 0;
-            }
-         }
-         part {
-            name: "icon_rect";
-            type: RECT;
-            scale: 1;
-            mouse_events: 0;
-            description { state: "default" 0.0;
-               visible: 1;
-               min: 0 40;
-               fixed: 1 0;
-               rel1 {relative: 0.0 1.0; to_x: "elm.swallow.content"; to_y: "padding_top"; }
-               rel2 {relative: 1.0 0.0; to_x: "elm.swallow.content"; to_y: "padding_bottom"; }
-               align: 0.0 0.5;
-               color: 0 0 0 0;
+               visible: 0;
             }
          }
          part {
@@ -1840,22 +1680,22 @@ group {
             mouse_events: 0;
             description { state: "default" 0.0; //when only icon or no icon is there
                align: 0.0 0.0;
-               rel1 { relative: 1.0 0.0; to: "icon_rect"; }
-               rel2 { relative: 1.0 1.0; to: "icon_rect"; }
+               rel1 { relative: 1.0 0.0; to: "elm.swallow.content"; }
+               rel2 { relative: 1.0 1.0; to: "elm.swallow.content"; }
                fixed: 1 0;
                min: 0 0;
-               color: 0 0 0 0;
+               visible: 0;
             }
             description { state: "icononly" 0.0;
                inherit: "default" 0.0;
             }
             description { state: "visible" 0.0; //when icon is visible
                align: 0.0 0.0;
-               rel1 { relative: 1.0 0.0; to: "icon_rect"; }
-               rel2 { relative: 1.0 1.0; to: "icon_rect"; }
+               rel1 { relative: 1.0 0.0; to: "elm.swallow.content"; }
+               rel2 { relative: 1.0 1.0; to: "elm.swallow.content"; }
                fixed: 1 0;
                min: 5 0;
-               color: 0 0 0 0;
+               visible: 0;
             }
          }
          part { name: "elm.swallow.content";
@@ -1882,7 +1722,6 @@ group {
                min: 40 40;
                rel1 {relative: 1.0 1.0; to_x: "padding_left"; to_y: "padding_top"; }
                rel2 {relative: 0.0 0.0; to_x: "padding_right"; to_y: "padding_bottom"; }
-               align: 0.5 0.5;
                aspect: 1.0 1.0;
                aspect_preference: VERTICAL;
             }
@@ -1896,28 +1735,25 @@ group {
                visible: 0;
                rel1 { relative: 1.0 1.0; to_x: "padding_icon_text"; to_y: "padding_top"; }
                rel2 { relative: 0.0 0.0; to_x: "padding_right"; to_y:"padding_bottom"; }
-               align: 0.5 0.5;
-               color: 0 0 0 255;
+               color: DATEFIELD_TEXT_NORMAL_COLOR_INC;
                color2: 255 255 255 255;
                text {
                   font: "SLP:style=Roman";
                   size: 24;
                   min:  0 0;
-                  align: 0.5 0.5;
                   max: 1 0;
                }
             }
             description { state: "visible" 0.0;
                inherit: "default" 0.0;
                visible: 1;
-               min: 90 40;
+               min: 64 30;
             }
             description { state: "clicked" 0.0;
                inherit: "default" 0.0;
                visible: 1;
                min: 0 0;
-               color: 221 134 21 255;
-               color2: 0 0 0 102;
+               color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
             }
             description { state: "disabled" 0.0;
                inherit: "default" 0.0;
@@ -1929,14 +1765,13 @@ group {
                color: 0 0 0 128;
                color3: 0 0 0 0;
                visible: 1;
-               min: 90 40;
+               min: 64 30;
             }
             description { state: "focused" 0.0;
                inherit: "default" 0.0;
                visible: 1;
                min: 0 0;
-               color: 221 134 21 255;
-               color2: 0 0 0 102;
+               color: DATEFIELD_TEXT_SELECTED_COLOR_INC;
             }
          }
          part { name: "over2";

diff --git a/themes/groups/diskselector.edc b/themes/groups/diskselector.edc
index 140809e..1ffff6a 100644 (file)
--- a/themes/groups/diskselector.edc
+++ b/themes/groups/diskselector.edc
@@ -62,8 +62,8 @@ group { name: "elm/diskselector/item/extended/timepicker";
                        scale: 1;
                        description {
                                state: "default" 0.0;
-                               min: 32 66;
-                               max: 32 66;
+                                min: 40 66;
+                                max: 40 66;
                                fixed: 1 1;
                                align: 0 0;
                                color: DISKSELECTOR_TP_FONT_COLOR_INC;
@@ -71,15 +71,16 @@ group { name: "elm/diskselector/item/extended/timepicker";
                                text {
                                        font: FONT_ROM;
                                        size: 24;
-                                       align: 0.5 0.5;
+                                        fit: 1 0;
+                                        size_range: 10 24;
                                        min: 0 1;
                                }
                        }
 
                        description {
                                state: "selected" 0.0;
-                               min: 32 66;
-                               max: 32 66;
+                                min: 40 66;
+                                max: 40 66;
                                fixed: 1 1;
                                align: 0 0;
                                color: 255 255 255 255;
@@ -87,7 +88,8 @@ group { name: "elm/diskselector/item/extended/timepicker";
                                text {
                                        font: FONT_ROM;
                                        size: 24;
-                                       align: 0.5 0.5;
+                                        fit: 1 0;
+                                        size_range: 10 24;
                                        min: 0 1;
                                }
                        }

diff --git a/themes/inc/nbeat-black-inc.edc b/themes/inc/nbeat-black-inc.edc
index 9d93f98..945045e 100755 (executable)
--- a/themes/inc/nbeat-black-inc.edc
+++ b/themes/inc/nbeat-black-inc.edc
@@ -280,3 +280,6 @@
 #define SLIDER_INDICATOR_TEXT_COLOR_INC      42 109 140 255
 
 #define TICKER_NOTI_TEXT_COLOR_INC      213 129 31 255
+
+#define DATEFIELD_TEXT_NORMAL_COLOR_INC         255 255 255 255
+#define DATEFIELD_TEXT_SELECTED_COLOR_INC       224 134 21 255

diff --git a/themes/inc/nbeat-inc.edc b/themes/inc/nbeat-inc.edc
index 3bd8cfb..2e035e5 100755 (executable)
--- a/themes/inc/nbeat-inc.edc
+++ b/themes/inc/nbeat-inc.edc
@@ -304,3 +304,6 @@
 #define SLIDER_INDICATOR_TEXT_COLOR_INC      217 147 26 255
 
 #define TICKER_NOTI_TEXT_COLOR_INC      213 129 31 255
+
+#define DATEFIELD_TEXT_NORMAL_COLOR_INC         0 0 0 255
+#define DATEFIELD_TEXT_SELECTED_COLOR_INC       224 134 21 255