Fix theme breakage exposed with updated EFL
[profile/ivi/efl-theme-tizen.git] / themes / widgets / popup.edc
index 5575d58..f1f2946 100644 (file)
  *
  */
 
-/*popup widgext styles*/
+#define POPUP_ITEM_STATE_ENABLED  0
+#define POPUP_ITEM_STATE_DISABLED 1
+
+/*popup widget specific notify style style*/
+group { name: "elm/notify/center/popup";
+   parts {
+       part { name: "base";
+           type: RECT;
+           scale : 1;
+           mouse_events: 0;
+           repeat_events: 1;
+           description { state: "default" 0.0;
+               color: 0 0 0 0;
+               rel1.relative: 0.0 0.0;
+               rel2.relative: 1.0 1.0;
+           }
+       }
+      part { name: "persp";
+        type: RECT;
+        description { state: "default" 0.0;
+           min: 32 32;
+           max: 32 32;
+           align: 0.5 0.5;
+           color: 0 0 0 0;
+           visible: 1;
+           perspective {
+              zplane: -200;
+              focal: 1000;
+           }
+        }
+     }
+     part { name: "persp1";
+        type: RECT;
+        description { state: "default" 0.0;
+           min: 32 32;
+           max: 32 32;
+           align: 0.5 0.5;
+           visible: 1;
+           color: 0 0 0 0;
+           perspective {
+              zplane: 0;
+              focal: 1000;
+           }
+        }
+     }
+       part { name: "pop";
+           scale : 1;
+           mouse_events: 1;
+           description { state: "default" 0.0;
+               rel1.to: "elm.swallow.content";
+               rel2.to: "elm.swallow.content";
+               image {
+                     middle: DEFAULT;
+                     border_scale: 0;
+               }
+           }
+       }
+       part { name: "elm.swallow.content";
+           type: SWALLOW;
+           scale : 1;
+           description { state: "default" 0.0;
+               rel1.to: "base";
+               rel2.to: "base";
+               map {
+                  on: 1;
+                  backface_cull: 1;
+                  perspective: "persp";
+               }
+           }
+           description { state: "visible" 0.0;
+               rel1.to: "base";
+               rel2.to: "base";
+               map {
+                  on: 1;
+                  backface_cull: 1;
+                  perspective: "persp1";
+               }
+           }
+           description { state: "end" 0.0;
+               rel1.to: "base";
+               rel2.to: "base";
+               map {
+                  on: 0;
+               }
+           }
+       }
+   }
+   programs {
+       program { name: "show";
+           signal: "elm,action,show";
+           source: "elm";
+           action: STATE_SET "default" 0.0;
+           target: "elm.swallow.content";
+       }
+       program { name: "show_2";
+            signal: "show";
+            action: STATE_SET "visible" 0.0;
+            target: "elm.swallow.content";
+            transition: LINEAR 0.2;
+            after: "end";
+       }
+       program { name: "end";
+           action: STATE_SET "end" 0.0;
+           target: "elm.swallow.content";
+       }
+       program { name: "hide";
+           signal: "elm,action,hide";
+           source: "elm";
+           action: STATE_SET "default" 0.0;
+           target: "elm.swallow.content";
+       }
+   }
+}
+
 group { name: "elm/notify/block_events/popup";
    parts {
       part { name: "block_events";
          type: RECT;
-         mouse_events:  1;
-         repeat_events: 0;
          description { state: "default" 0.0;
             color: POPUP_DIM_BG_COLOR_INC;
          }
@@ -32,16 +143,14 @@ group { name: "elm/notify/block_events/popup";
       }
    }
    programs {
-      program {
-         name: "block_clicked";
+      program { name: "block_clicked";
          signal: "mouse,clicked,1";
          source: "block_events";
-         action: SIGNAL_EMIT "elm,action,clicked" "elm";
+         action: SIGNAL_EMIT "elm,action,click" "elm";
          after: "deeper_block_color";
       }
       program {
          name: "deeper_block_color";
-         signal: "elm,state,block_events,clicked";
          action: STATE_SET "clicked" 0.0;
          target: "block_events";
          transition: LINEAR 0.2;
@@ -49,7 +158,6 @@ group { name: "elm/notify/block_events/popup";
       }
       program {
          name: "default_block_color";
-         signal: "elm,state,block_events,default";
          action: STATE_SET "default" 0.0;
          target: "block_events";
          transition: LINEAR 0.2;
@@ -61,8 +169,6 @@ group { name: "elm/notify/block_events/transparent";
    parts {
       part { name: "block_events";
          type: RECT;
-         mouse_events:  1;
-         repeat_events: 0;
          description { state: "default" 0.0;
             color: POPUP_DIM_BG_TRANS_COLOR_INC;
          }
@@ -72,16 +178,14 @@ group { name: "elm/notify/block_events/transparent";
       }
    }
    programs {
-      program {
-         name: "block_clicked";
+      program { name: "block_clicked";
          signal: "mouse,clicked,1";
          source: "block_events";
-         action: SIGNAL_EMIT "elm,action,clicked" "elm";
+         action: SIGNAL_EMIT "elm,action,click" "elm";
          after: "deeper_block_color";
       }
       program {
          name: "deeper_block_color";
-         signal: "elm,state,block_events,clicked";
          action: STATE_SET "clicked" 0.0;
          target: "block_events";
          transition: LINEAR 0.2;
@@ -89,7 +193,6 @@ group { name: "elm/notify/block_events/transparent";
       }
       program {
          name: "default_block_color";
-         signal: "elm,state,block_events,default";
          action: STATE_SET "default" 0.0;
          target: "block_events";
          transition: LINEAR 0.2;
@@ -97,16 +200,15 @@ group { name: "elm/notify/block_events/transparent";
    }
 }
 
-group { name: "elm/label/base/popup_description/default";
-   alias: "elm/label/base/popup_description/verticalbuttonstyle";
+group { name: "elm/label/base/popup/default";
+   alias: "elm/label/base/popup/verticalbuttonstyle";
+   alias: "elm/label/base/popup/content_expand";
    styles
      {
         style { name: "popup_desc_style";
-           base: "font=SLP:style=Roman font_size="POPUP_DESCRIPTION_DEFAULT_TEXT_FONT_SIZE_INC" align=center color="POPUP_DEFAULT_DESCRIPTION_TEXT_COLOR_INC" wrap=mixed";
+           base: "font=SLP:style=Roman font_size="POPUP_DESCRIPTION_DEFAULT_TEXT_FONT_SIZE_INC" align=center color="POPUP_DEFAULT_DESCRIPTION_TEXT_COLOR_INC" text_class=slp_roman wrap=mixed ellipsis=1";
            tag:  "br" "\n";
            tag:  "ps" "ps";
-           tag:  "hilight" "+ font=SLP:style=Bold";
-           tag:  "b" "+ font=SLP:style=Bold";
            tag:  "whitecolor" "+ color=#ffffff";
            tag:  "tab" "\t";
         }
@@ -115,14 +217,13 @@ group { name: "elm/label/base/popup_description/default";
       part { name: "elm.text";
          type: TEXTBLOCK;
          mouse_events: 0;
-         effect: SHADOW;
          scale: 1;
          description { state: "default" 0.0;
-            align: 0.5 0.5;
             min: POPUP_DESCRIPTION_DEFAULT_TEXT_MIN_INC;
+            max: POPUP_DESCRIPTION_DEFAULT_TEXT_MIN_INC;
             text {
                style: "popup_desc_style";
-               min: 0 1;
+               min: 0 0;
             }
          }
       }
@@ -130,51 +231,34 @@ group { name: "elm/label/base/popup_description/default";
 }
 
 group { name: "elm/popup/base/default";
+   images {
+      image: "00_popup_title_bg.png" COMP;
+      image: "00_popup_bottom_bg.png" COMP;
+      image: "00_popup_bg.png" COMP;
+   }
+   styles {
+      style { name: "popup_title_style";
+         base: "font=SLP:style=Medium font_size="POPUP_BASE_DEFAULT_TEXT_FONT_SIZE_INC" align=center color=#ffffff wrap=mixed ellipsis=1.0 text_class=slp_medium";
+         tag:  "br" "\n";
+         tag:  "tab" "\t";
+      }
+   }
    parts {
-      images {
-         image: "00_popup_title_bg.png" COMP;
-         image: "00_popup_bottom_bg.png" COMP;
-         image: "00_popup_bg.png" COMP;
-      }
-      styles
-        {
-           style { name: "popup_title_style";
-              base: "font=SLP:style=Medium font_size="POPUP_BASE_DEFAULT_TEXT_FONT_SIZE_INC" align=center color=#ffffff wrap=mixed ellipsis=1.0";
-              tag:  "br" "\n";
-              tag:  "ps" "ps";
-              tag:  "whitecolor" "+ color=#ffffff";
-              tag:  "tab" "\t";
-           }
-        }
-
       part { name: "base";
-         type: RECT;
+         type: IMAGE;
          scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
          description { state: "default" 0.0;
             min: POPUP_BASE_DEFAULT_BASE_DEFAULT_MIN_INC;
             max: POPUP_BASE_DEFAULT_BASE_DEFAULT_MAX_INC;
-            color: 0 0 0 0;
-            rel1.relative: 0.0 0.0;
-            rel2.relative: 1.0 1.0;
-            align: 0.0 0.0;
-         }
-      }
-      part { name: "background";
-         scale : 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            rel1.to: "base";
-            rel2.to: "base";
             image {
                normal: "00_popup_bg.png";
                border: POPUP_BASE_DEFAULT_BG_DEFAULT_IMAGE_BORDER_INC;
                border_scale: 1;
             }
+            align: 0.0 0.0;
          }
       }
-      part { name: "elm.rect.title";
+      part { name: "elm.bg.title";
          type: IMAGE;
          scale : 1;
          description { state: "default" 0.0;
@@ -194,33 +278,33 @@ group { name: "elm/popup/base/default";
                to: "base";
             }
          }
-         description { state: "show_title" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
       }
       part { name: "left_pad";
          type: RECT;
-         scale : 1;
+         scale: 1;
          description { state: "default" 0.0;
             min: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
             max: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
-            fixed : 1 1;
+            fixed: 1 1;
             align: 0.0 0.0;
             visible: 0;
-            rel1.to: "elm.rect.title";
+            rel1.to: "elm.bg.title";
          }
       }
       part { name: "right_pad";
          type: RECT;
-         scale : 1;
+         scale: 1;
          description { state: "default" 0.0;
             min: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
             max: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
-            fixed : 1 1;
+            fixed: 1 1;
             align: 1.0 1.0;
             visible: 0;
-            rel2.to: "elm.rect.title";
+            rel2.to: "elm.bg.title";
          }
       }
       part { name: "elm.swallow.title.icon";
@@ -231,39 +315,44 @@ group { name: "elm/popup/base/default";
             max: POPUP_BASE_DEFAULT_TITLE_ICON_DEFAULT_MIN_MAX_INC;
             fixed: 1 1;
             align: 0.0 0.5;
-            rel1 { relative: 1.0 0.0; to: "left_pad"; }
-            rel2 { relative: 0.0 1.0; to: "right_pad"; }
+            rel1 {
+               to: "left_pad";
+               relative: 1.0 0.0;
+            }
+            rel2 {
+               to: "right_pad";
+               relative: 0.0 1.0;
+            }
             visible: 0;
          }
-         description { state: "show_title_icon" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
       }
-      part {
-         name: "elm.swallow.title";
+      part { name: "elm.text.title";
          type: TEXTBLOCK;
          scale:1;
-         description {
-            state: "default" 0.0;
+         description { state: "default" 0.0;
             fixed: 1 1;
-            text
-              {
-                 style: "popup_title_style";
-                 min: 0 0;
-                 max: 0 1;
-                 align: 0.5 0.0;
-              }
-              color: POPUP_DEFAULT_TITLE_TEXT_COLOR_INC;
+            text {
+              style: "popup_title_style";
+              min: 0 0;
+              max: 0 1;
+              align: 0.5 0.0;
+            }
+            color: POPUP_DEFAULT_TITLE_TEXT_COLOR_INC;
             visible:0;
-            rel1 { relative: 1.0 0.0; to: "left_pad"; }
-            rel2 { relative: 0.0 1.0; to: "right_pad"; }
-         }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+            rel1 {
+               relative: 1.0 0.0;
+               to: "left_pad";
+            }
+            rel2 {
+               relative: 0.0 1.0;
+               to: "right_pad";
+            }
          }
-         description { state: "show_title_icon" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
@@ -273,7 +362,7 @@ group { name: "elm/popup/base/default";
          scale : 1;
          description { state: "default" 0.0;
             min: POPUP_BASE_DEFAULT_CONTENT_DEFAULT_MIN_MAX_INC;
-            align: 0.5 0.5;
+            max: POPUP_BASE_DEFAULT_CONTENT_DEFAULT_MIN_MAX_INC;
             fixed: 1 0;
             rel1 {
                relative: 0.5 0.0;
@@ -284,33 +373,33 @@ group { name: "elm/popup/base/default";
                to: "base";
             }
          }
-         description { state: "show_title" 0.0;
+         description { state: "show_title_area" 0.0;
             inherit: "default" 0.0;
             rel1 {
                relative: 0.5 1.0;
-               to: "elm.rect.title";
+               to: "elm.bg.title";
             }
          }
-         description { state: "show_button_area" 0.0;
+         description { state: "show_action_area" 0.0;
             inherit: "default" 0.0;
             rel2 {
                relative: 0.5 0.0;
-               to: "elm.swallow.buttonArea.Background";
+               to: "elm.bg.action_area";
             }
          }
-         description { state: "show_button_title_area" 0.0;
+         description { state: "show_action_title_area" 0.0;
             inherit: "default" 0.0;
             rel1 {
                relative: 0.5 1.0;
-               to: "elm.rect.title";
+               to: "elm.bg.title";
             }
             rel2 {
                relative: 0.5 0.0;
-               to: "elm.swallow.buttonArea.Background";
+               to: "elm.bg.action_area";
             }
          }
       }
-      part { name: "elm.swallow.buttonArea.Background";
+      part { name: "elm.bg.action_area";
          type: IMAGE;
          scale : 1;
          description { state: "default" 0.0;
@@ -325,101 +414,105 @@ group { name: "elm/popup/base/default";
                relative: 0.0 1.0;
                to: "base";
             }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "base";
-            }
+            rel2.to: "base";
          }
-         description { state: "show_button_area" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
       }
-      part { name: "elm.swallow.buttonArea";
+      part { name: "elm.swallow.action_area";
          type: SWALLOW;
          scale : 1;
          description { state: "default" 0.0;
             align: 0.0 0.0;
-            visible: 0;
-            rel1 {
-               relative: 0.0 0.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+            rel1.to: "elm.bg.action_area";
+            rel2.to: "elm.bg.action_area";
          }
       }
    }
    programs {
-      program { name: show_title;
-         signal: "elm,state,title,visible";
-         source: "elm";
-         action: STATE_SET "show_title" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content";
-         target: "base";
-      }
-      program { name: hide_title;
-         signal: "elm,state,title,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content";
-         target: "base";
-      }
       program { name: show_title_icon;
          signal: "elm,state,title,icon,visible";
          source: "elm";
-         action: STATE_SET "show_title_icon" 0.0;
-         target: "elm.swallow.title";
+         action: STATE_SET "visible" 0.0;
          target: "elm.swallow.title.icon";
       }
       program { name: hide_title_icon;
          signal: "elm,state,title,icon,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
          target: "elm.swallow.title.icon";
       }
-      program { name: show_button_area;
-         signal: "elm,state,button,visible";
+      program { name: show_title_text;
+         signal: "elm,state,title,text,visible";
          source: "elm";
-         action: STATE_SET "show_button_area" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background";
-         target: "base";
+         action: STATE_SET "visible" 0.0;
+         target: "elm.text.title";
       }
-      program { name: hide_button_area;
-         signal: "elm,state,button,hidden";
+      program { name: hide_title_text;
+         signal: "elm,state,title,text,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background";
-         target: "base";
+         target: "elm.text.title";
       }
-      program { name: show_button_title_area;
-         signal: "elm,state,button,title,visible";
+      program { name: show_title_area;
+         signal: "elm,state,title_area,visible";
          source: "elm";
-         action: STATE_SET "show_button_title_area" 0.0;
-         target: "elm.swallow.content";
-         target: "base";
-      }
-      program { name: hide_button_title_area;
-         signal: "elm,state,button,title,hidden";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.action_area", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "show_title_area", 0.0);
+            set_state(PART:"elm.bg.title", "visible", 0.0);
+         }
+      }
+      program { name: hide_title_area;
+         signal: "elm,state,title_area,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.content";
-         target: "base";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.action_area", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "default", 0.0);
+            set_state(PART:"elm.bg.title", "default", 0.0);
+         }
+      }
+      program { name: show_action_area;
+         signal: "elm,state,action_area,visible";
+         source: "elm";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.bg.title", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "show_action_area", 0.0);
+            set_state(PART:"elm.bg.action_area", "visible", 0.0);
+         }
+      }
+      program { name: hide_action_area;
+         signal: "elm,state,action_area,hidden";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.bg.title", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "default", 0.0);
+            set_state(PART:"elm.bg.action_area", "default", 0.0);
+         }
       }
    } /* end of programs */
 }
@@ -430,17 +523,18 @@ group { name: "elm/popup/content/default";
          type: RECT;
          scale : 1;
          mouse_events: 0;
-         repeat_events: 1;
          description { state: "default" 0.0;
             align: 0.5 0.0;
             min: POPUP_CONTENT_DEFAULT_PADDING_TOP_MIN_INC;
             fixed: 0 1;
-            color: 0 0 0 0;
+            visible: 0;
             rel1 {
-               relative: 1.0 0.0;to_x: "pad_l";
+               relative: 1.0 0.0;
+               to_x: "pad_l";
             }
             rel2 {
-               relative: 0.0 0.0;to_x: "pad_r";
+               relative: 0.0 0.0;
+               to_x: "pad_r";
             }
          }
       }
@@ -450,13 +544,8 @@ group { name: "elm/popup/content/default";
          description { state: "default" 0.0;
             min : POPUP_CONTENT_DEFAULT_PADDING_LEFT_MIN_INC;
             fixed: 1 0;
-            rel1 {
-               relative: 0.0 0.0; 
-            }
-            rel2 {
-               relative: 0.0 1.0;
-            }
-            color: 0 0 0 0;
+            rel2.relative: 0.0 1.0;
+            visible: 0;
             align: 0.0 0.0;
          }
       }
@@ -466,22 +555,16 @@ group { name: "elm/popup/content/default";
          description { state: "default" 0.0;
             min : POPUP_CONTENT_DEFAULT_PADDING_RIGHT_MIN_INC;
             fixed: 1 0;
-            rel1 {
-               relative: 1.0 0.0;
-            }
-            rel2 {
-               relative: 1.0 1.0;
-            }
-            color: 0 0 0 0;
+            rel1.relative: 1.0 0.0;
+            visible: 0;
             align: 1.0 0.0;
          }
-      } 
+      }
       part{ name:"elm.swallow.content";
          type: SWALLOW;
          scale : 1;
          description { state: "default" 0.0;
             min: POPUP_CONTENT_DEFAULT_CONTENT_DEFAULT_MIN_INC;
-            align: 0.5 0.5;
             fixed: 1 0;
             rel1 {
                relative: 0.5 1.0;
@@ -497,264 +580,571 @@ group { name: "elm/popup/content/default";
          type: RECT;
          scale : 1;
          mouse_events: 0;
-         repeat_events: 1;
          description { state: "default" 0.0;
             align: 0.5 1.0;
             min: POPUP_CONTENT_DEFAULT_PADDING_BOTTOM_MIN_INC;
             fixed: 0 1;
-            color: 0 0 0 0;
+            visible: 0;
             rel1 {
-               relative: 0.0 1.0;to_x: "pad_l";
-            }
-            rel2 {
-               relative: 1.0 1.0;to_x: "pad_r";
+               relative: 0.0 1.0;
+               to_x: "pad_l";
             }
+            rel2.to_x: "pad_r";
          }
       }
    }
 }
 
-group { name: "elm/popup/base/verticalbuttonstyle";
+///////////////////////////////////////////////////////////////////////////////
+group {
+   name: "elm/popup/item/default";
+   script {
+      public item_state = POPUP_ITEM_STATE_ENABLED;
+   }
    parts {
-      images {
-         image: "00_popup_title_bg.png" COMP;
-         image: "00_popup_bottom_bg.png" COMP;
-         image: "00_popup_bg.png" COMP;
-      }
-      part { name: "base";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
+      part { name: "event_blocker";
          description { state: "default" 0.0;
-            min: POPUP_BASE_VERTICAL_BUTTON_BASE_MIN_INC;
-            max: POPUP_BASE_VERTICAL_BUTTON_BASE_MAX_INC;
-            color: 0 0 0 0;
-            rel1.relative: 0.0 0.0;
-            rel2.relative: 1.0 1.0;
-            align: 0.0 0.0;
          }
       }
-      part { name: "background";
-         scale : 1;
+      part { name: "bg";
          mouse_events: 0;
+         type: RECT;
          description { state: "default" 0.0;
-            rel1.to: "base";
-            rel2.to: "base";
-            image {
-               normal: "00_popup_bg.png";
-               border: POPUP_BASE_VERTICAL_BUTTON_BG_IMAGE_BORDER_INC;
-               border_scale: 1;
-            }
+            color: 240 240 240 255;
+            min: 0 71;
+            align: 0.5 0.0;
+         }
+         description { state: "clicked" 0.0;
+            color: 190 170 150 255;
          }
       }
-      part { name: "elm.rect.title";
-         type: IMAGE;
-         scale : 1;
+      part { name: "padding_left_top";
+         type: RECT;
+         scale: 1;
+         mouse_events: 0;
          description { state: "default" 0.0;
-            min: POPUP_BASE_VERTICAL_BUTTON_TITLE_DEFAULT_MIN_INC;
-            fixed : 1 1;
-            align: 0.5 0.0;
+            align: 0.0 0.0;
+            rel2.relative: 0.0 0.0;
+            min: 10 10;
+            fixed: 1 1;
             visible: 0;
-            image.normal: "00_popup_title_bg.png";
-            image.border: POPUP_BASE_VERTICAL_BUTTON_TITLE_IMAGE_BORDER_MIN_INC;
-            image.border_scale: 1;
-            rel1 {
-               relative: 0.5 0.0;
-               to: "base";
-            }
-            rel2 {
-               relative: 0.5 0.0;
-               to: "base";
-            }
-         }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
          }
       }
-      part { name: "elm.swallow.title.icon";
-         type: SWALLOW;
+      part { name: "padding_right_bottom";
+         type: RECT;
          scale: 1;
+         mouse_events: 0;
          description { state: "default" 0.0;
-            min: POPUP_BASE_VERTICAL_BUTTON_TITLE_ICON_MIN_MAX_INC;
-            max: POPUP_BASE_VERTICAL_BUTTON_TITLE_ICON_MIN_MAX_INC;
+            align: 1.0 1.0;
+            rel1.relative: 1.0 1.0;
+            min: 10 10;
             fixed: 1 1;
-            align: 0.0 0.5;
-            rel1 {
-               to: "elm.rect.title";
-               relative: 0.0 0.0;
-            }
-            rel2 {
-               to: "elm.rect.title";
-               relative: 1.0 1.0;
-            }
             visible: 0;
          }
-         description { state: "show_title_icon" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+      }
+      part { name: "separator";
+         mouse_events: 0;
+         type: RECT;
+         scale: 1;
+         description { state: "dafault" 0.0;
+            color: 180 180 180 255;
+            align: 0.5 1.0;
+            min: 0 1;
+            max: 999999 1;
          }
       }
-      part {
-         name: "elm.swallow.title";
-         type: TEXTBLOCK;
-         scale:1;
-         description {
-            state: "default" 0.0;
-            text
-              {
-                 style: "popup_title_style";
-                 min: 0 0;
-                 max: 0 1;
-              }
-            color: POPUP_DEFAULT_TITLE_TEXT_COLOR_INC;
-            visible:0;
-            rel1 { relative: 0.0 0.0; to: "elm.rect.title"; }
-            rel2 { relative: 1.0 1.0; to: "elm.rect.title"; }
-            align: 0.5 0.5;
+      part { name: "padding_icon_text";
+         type: RECT;
+         scale: 1;
+         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: "elm.swallow.content";
+            }
+            rel2.to: "elm.swallow.content";
+            fixed: 1 0;
+            min: 0 0;
+            visible: 0;
          }
-         description { state: "show_title" 0.0;
+         description { state: "visible" 0.0; //when icon is visible
             inherit: "default" 0.0;
-            visible: 1;
+            min: 10 0;
          }
-         description { state: "show_title_icon" 0.0;
+         description { state: "icononly" 0.0;
             inherit: "default" 0.0;
-            visible: 1;
          }
       }
       part { name: "elm.swallow.content";
          type: SWALLOW;
-         scale : 1;
+         scale: 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_VERTICAL_BUTTON_CONTENT_DEFAULT_MIN_INC;
-            align: 0.5 0.5;
-            fixed: 1 0;
+            visible: 0;
+            align: 0.0 0.5;
             rel1 {
-               relative: 0.5 0.0;
-               to: "base";
+               relative: 1.0 1.0;
+               to: "padding_left_top";
             }
             rel2 {
-               relative: 0.5 1.0;
-               to: "base";
+               relative: 1.0 0.0;
+               to_x: "padding_left_top";
+               to_y: "padding_right_bottom";
             }
+            fixed: 1 0;
          }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
+         description { state: "visible" 0.0;
+            fixed: 1 0;
+            min: 40 40;
+            max: 40 40;
+            align: 0.0 0.5;
             rel1 {
-               relative: 0.5 1.0;
-               to: "elm.rect.title";
+               relative: 1.0 1.0;
+               to: "padding_left_top";
             }
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
             rel2 {
-               relative: 0.5 0.0;
-               to: ""elm.swallow.buttonArea"";
+               relative: 1.0 0.0;
+               to_x: "padding_left_top";
+               to_y: "padding_right_bottom";
             }
+            aspect: 1.0 1.0;
+            aspect_preference: VERTICAL;
          }
-         description { state: "show_button_title_area" 0.0;
-            inherit: "default" 0.0;
+         description { state: "icononly" 0.0;
+            min: 40 40;
+            max: 40 40;
             rel1 {
-               relative: 0.5 1.0;
-               to: "elm.rect.title";
+               relative: 1.0 1.0;
+               to: "padding_left_top";
             }
             rel2 {
-               relative: 0.5 0.0;
-               to: ""elm.swallow.buttonArea"";
+               relative: 0.0 0.0;
+               to: "padding_right_bottom";
             }
+            aspect: 1.0 1.0;
+            aspect_preference: VERTICAL;
          }
       }
-      part { name: "elm.swallow.buttonArea";
-         type: SWALLOW;
-         scale : 1;
+      part { name: "elm.text";
+         type: TEXT;
+         mouse_events: 0;
+         scale: 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_VERTICAL_BUTTON_BUTTONAREA_DEFAULT_MIN_INC;
-            fixed : 1 1;
-            align: 0.5 1.0;
             visible: 0;
             rel1 {
-               relative: 0.0 1.0;
-               to: "base";
+               relative: 1.0 1.0;
+               to_x: "padding_icon_text";
+               to_y: "padding_left_top";
             }
             rel2 {
-               relative: 1.0 1.0;
-               to: "base";
+               relative: 0.0 0.0;
+               to:"padding_right_bottom";
             }
+            align: 0.0 0.5;
+            color: 0 0 0 255;
+            text {
+               font: "SLP:style=Bold";
+               size: 20;
+               min:  0 0;
+               align: 0.0 0.5;
+               text: "slp";
+            }
+         }
+         description { state: "visible" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
+            min: 90 40;
+         }
+         description { state: "clicked" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
+            min: 0 0;
+            color: 255 255 255 255;
+         }
+         description { state: "disabled" 0.0;
+            inherit: "default" 0.0;
+            color: 128 128 128 255;
          }
-         description { state: "show_button_area" 0.0;
+         description { state: "disabled_visible" 0.0;
             inherit: "default" 0.0;
+            color: 128 128 128 255;
             visible: 1;
+            min: 90 40;
+         }
+      }
+      part { name: "over1";
+         repeat_events: 1;
+         ignore_flags: ON_HOLD;
+         description { state: "default" 0.0;
+         }
+      }
+      part { name: "over2";
+         repeat_events: 1;
+         description { state: "default" 0.0;
+         }
+      }
+      part { name: "disclip";
+         type: RECT;
+         description { state: "default" 0.0;
+            visible: 0;
+         }
+         description { state: "disabled" 0.0;
+            color: 87 87 87 128;
          }
       }
    }
    programs {
-      program { name: show_title;
-         signal: "elm,state,title,visible";
+      program { name: "item_unclick";
+         signal: "mouse,up,1";
+         source: "over1";
+         action: SIGNAL_EMIT "elm,action,click" "";
+      }
+      program { name: "disable";
+         signal: "elm,state,item,disabled";
          source: "elm";
-         action: STATE_SET "show_title" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content";
-         target: "base";
+         action: STATE_SET "disabled" 0.0;
+         target: "disclip";
+         after: "disable_text";
       }
-      program { name: hide_title;
-         signal: "elm,state,title,hidden";
+      program { name: "enable";
+         signal: "elm,state,item,enabled";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
+         target: "disclip";
+         after: "enable_text";
+      }
+      program { name: "item_click2";
+         signal: "mouse,down,1";
+         source: "over2";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.text", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.text", "clicked", 0.0);
+            set_state(PART:"bg", "clicked", 0.0);
+         }
+      }
+      program { name: "item_unclick2";
+         signal: "mouse,up,1";
+         source: "over2";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.text", st, 30, vl);
+            if (!strcmp(st, "clicked"))
+              set_state(PART:"elm.text", "visible", 0.0);
+            set_state(PART:"bg", "default", 0.0);
+         }
+      }
+      program { name: "disable_text";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.text", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.text", "disabled_visible", 0.0);
+            else
+              set_state(PART:"elm.text", "disabled", 0.0);
+            set_int(item_state, POPUP_ITEM_STATE_DISABLED);
+         }
+      }
+      program { name: "enable_text";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.text", st, 30, vl);
+            if (!strcmp(st, "disabled_visible"))
+              set_state(PART:"elm.text", "visible", 0.0);
+            else
+              set_state(PART:"elm.text", "default", 0.0);
+            set_int(item_state, POPUP_ITEM_STATE_ENABLED);
+         }
+      }
+      program { name: "text_show";
+         signal: "elm,state,item,text,visible";
+         source: "elm";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.content", st, 30, vl);
+            if (!strcmp(st, "icononly")) {
+               set_state(PART:"elm.swallow.content", "visible", 0.0);
+               set_state(PART:"padding_icon_text", "visible", 0.0);
+            }
+            if(get_int(item_state) != POPUP_ITEM_STATE_DISABLED)
+              set_state(PART:"elm.text", "visible", 0.0);
+            else
+              set_state(PART:"elm.text", "disabled_visible", 0.0);
+         }
+      }
+      program { name: "text_hide";
+         signal: "elm,state,item,text,hidden";
+         source: "elm";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.content", st, 30, vl);
+            if (!strcmp(st, "visible")) {
+               set_state(PART:"elm.swallow.content", "icononly", 0.0);
+               set_state(PART:"padding_icon_text", "icononly", 0.0);
+            }
+            set_state(PART:"elm.text", "default", 0.0);
+         }
+      }
+      program { name: "icon_show";
+         signal: "elm,state,item,icon,visible";
+         source: "elm";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.text", st, 30, vl);
+            if (!strcmp(st, "visible")) {
+               set_state(PART:"elm.swallow.content", "visible", 0.0);
+               set_state(PART:"padding_icon_text", "visible", 0.0);
+            }
+            else {
+               set_state(PART:"elm.swallow.content", "icononly", 0.0);
+               set_state(PART:"padding_icon_text", "icononly", 0.0);
+            }
+         }
+      }
+      program { name: "icon_hide";
+         signal: "elm,state,item,icon,hidden";
+         source: "elm";
+         action:  STATE_SET "default" 0.0;
          target: "elm.swallow.content";
-         target: "base";
       }
+   }
+}
+
+group { name: "elm/popup/base/verticalbuttonstyle";
+   images {
+      image: "00_popup_title_bg.png" COMP;
+      image: "00_popup_bottom_bg.png" COMP;
+      image: "00_popup_bg.png" COMP;
+   }
+   parts {
+      part { name: "base";
+         type: IMAGE;
+         scale : 1;
+         description { state: "default" 0.0;
+            min: POPUP_BASE_VERTICAL_BUTTON_BASE_MIN_INC;
+            max: POPUP_BASE_VERTICAL_BUTTON_BASE_MAX_INC;
+            image {
+               normal: "00_popup_bg.png";
+               border: POPUP_BASE_VERTICAL_BUTTON_BG_IMAGE_BORDER_INC;
+               border_scale: 1;
+            }
+            align: 0.0 0.0;
+         }
+      }
+      part { name: "elm.bg.title";
+         type: IMAGE;
+         scale : 1;
+         description { state: "default" 0.0;
+            min: POPUP_BASE_VERTICAL_BUTTON_TITLE_DEFAULT_MIN_INC;
+            fixed : 1 1;
+            align: 0.5 0.0;
+            visible: 0;
+            image.normal: "00_popup_title_bg.png";
+            image.border: POPUP_BASE_VERTICAL_BUTTON_TITLE_IMAGE_BORDER_MIN_INC;
+            image.border_scale: 1;
+            rel1 {
+               relative: 0.5 0.0;
+               to: "base";
+            }
+            rel2 {
+               relative: 0.5 0.0;
+               to: "base";
+            }
+         }
+         description { state: "visible" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
+         }
+      }
+      part { name: "elm.swallow.title.icon";
+         type: SWALLOW;
+         scale: 1;
+         description { state: "default" 0.0;
+            min: POPUP_BASE_VERTICAL_BUTTON_TITLE_ICON_MIN_MAX_INC;
+            max: POPUP_BASE_VERTICAL_BUTTON_TITLE_ICON_MIN_MAX_INC;
+            fixed: 1 1;
+            align: 0.0 0.5;
+            rel1.to: "elm.bg.title";
+            rel2.to: "elm.bg.title";
+            visible: 0;
+         }
+         description { state: "visible" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
+         }
+      }
+      part { name: "elm.text.title";
+         type: TEXTBLOCK;
+         scale:1;
+         description { state: "default" 0.0;
+            text {
+              style: "popup_title_style";
+              min: 0 0;
+              max: 0 1;
+              align: 0.5 0.0;
+            }
+            color: POPUP_DEFAULT_TITLE_TEXT_COLOR_INC;
+            visible:0;
+            rel1.to:"elm.bg.title";
+            rel2.to: "elm.bg.title";
+         }
+         description { state: "visible" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
+         }
+      }
+      part { name: "elm.swallow.content";
+         type: SWALLOW;
+         scale : 1;
+         description { state: "default" 0.0;
+            min: POPUP_BASE_VERTICAL_BUTTON_CONTENT_DEFAULT_MIN_INC;
+            max: POPUP_BASE_VERTICAL_BUTTON_CONTENT_DEFAULT_MIN_INC;
+            fixed: 1 0;
+            rel1 {
+               relative: 0.5 0.0;
+               to: "base";
+            }
+            rel2 {
+               relative: 0.5 1.0;
+               to: "base";
+            }
+         }
+         description { state: "show_title_area" 0.0;
+            inherit: "default" 0.0;
+            rel1 {
+               relative: 0.5 1.0;
+               to: "elm.bg.title";
+            }
+         }
+         description { state: "show_action_area" 0.0;
+            inherit: "default" 0.0;
+            rel2 {
+               relative: 0.5 0.0;
+               to: "elm.swallow.action_area";
+            }
+         }
+         description { state: "show_action_title_area" 0.0;
+            inherit: "default" 0.0;
+            rel1 {
+               relative: 0.5 1.0;
+               to: "elm.bg.title";
+            }
+            rel2 {
+               relative: 0.5 0.0;
+               to: "elm.swallow.action_area";
+            }
+         }
+      }
+      part { name: "elm.swallow.action_area";
+         type: SWALLOW;
+         scale : 1;
+         description { state: "default" 0.0;
+            align: 0.5 1.0;
+            fixed: 0 1;
+            min: POPUP_BASE_VERTICAL_BUTTON_BUTTONAREA_DEFAULT_MIN_INC;
+            visible: 1;
+            rel1 {
+               relative: 0.0 1.0;
+               to: "base";
+            }
+            rel2.to: "base";
+         }
+      }
+   }
+   programs {
       program { name: show_title_icon;
          signal: "elm,state,title,icon,visible";
          source: "elm";
-         action: STATE_SET "show_title_icon" 0.0;
-         target: "elm.swallow.title";
+         action: STATE_SET "visible" 0.0;
          target: "elm.swallow.title.icon";
       }
       program { name: hide_title_icon;
          signal: "elm,state,title,icon,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
          target: "elm.swallow.title.icon";
       }
-      program { name: show_button_area;
-         signal: "elm,state,button,visible";
+      program { name: show_title_text;
+         signal: "elm,state,title,text,visible";
          source: "elm";
-         action: STATE_SET "show_button_area" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "base";
+         action: STATE_SET "visible" 0.0;
+         target: "elm.text.title";
       }
-      program { name: hide_button_area;
-         signal: "elm,state,button,hidden";
+      program { name: hide_title_text;
+         signal: "elm,state,title,text,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "base";
+         target: "elm.text.title";
       }
-      program { name: show_button_title_area;
-         signal: "elm,state,button,title,visible";
+      program { name: show_title_area;
+         signal: "elm,state,title_area,visible";
          source: "elm";
-         action: STATE_SET "show_button_title_area" 0.0;
-         target: "elm.swallow.content";
-         target: "base";
-      }
-      program { name: hide_button_title_area;
-         signal: "elm,state,button,title,hidden";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.action_area", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "show_title_area", 0.0);
+            set_state(PART:"elm.bg.title", "visible", 0.0);
+         }
+      }
+      program { name: hide_title_area;
+         signal: "elm,state,title_area,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.content";
-         target: "base";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.action_area", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "default", 0.0);
+            set_state(PART:"elm.bg.title", "default", 0.0);
+         }
+      }
+      program { name: show_action_area;
+         signal: "elm,state,action_area,visible";
+         source: "elm";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.bg.title", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "show_action_area", 0.0);
+         }
+      }
+      program { name: hide_action_area;
+         signal: "elm,state,action_area,hidden";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.bg.title", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "default", 0.0);
+         }
       }
    } /* end of programs */
 }
 
 group { name: "elm/popup/buttons3/verticalbuttonstyle";
+   data.item: "action_area_height" POPUP_BUTTON_VERTICAL_ACTION_AREA_HEIGHT;
    parts{
       part { name: "elm.swallow.buttonArea.Background";
          type: IMAGE;
@@ -885,6 +1275,7 @@ group { name: "elm/popup/content/menustyle";
          scale : 1;
          description { state: "default" 0.0;
             min: POPUP_CONTENT_LISTSTYLE_CONTENT_DEFAULT_MIN_INC;
+            max: POPUP_CONTENT_LISTSTYLE_CONTENT_DEFAULT_MIN_INC;
             align: 0.5 0.5;
             fixed: 1 0;
             rel1 {
@@ -988,6 +1379,7 @@ group { name: "elm/popup/content/liststyle";
          scale : 1;
          description { state: "default" 0.0;
             min: POPUP_CONTENT_LISTSTYLE_CONTENT_DEFAULT_MIN_INC;
+            max: POPUP_CONTENT_LISTSTYLE_CONTENT_DEFAULT_MIN_INC;
             align: 0.5 0.5;
             fixed: 1 0;
             rel1 {
@@ -1069,52 +1461,33 @@ group { name: "elm/popup/content/min_liststyle";
 }
 
 group { name: "elm/popup/base/customstyle";
+   images {
+      image: "00_popup_bottom_bg.png" COMP;
+      image: "00_popup_bg.png" COMP;
+   }
+   styles {
+      style { name: "popup_title_custom_style";
+         base: "font=SLP:style=Medium font_size="POPUP_BASE_CUSTOMSTYLE_TEXT_FONT_SIZE_INC" align=center color=#ffffff wrap=mixed ellipsis=1.0 text_class=slp_medium";
+         tag:  "br" "\n";
+         tag:  "tab" "\t";
+      }
+   }
    parts {
-      images {
-         image: "00_popup_bottom_bg.png" COMP;
-         image: "00_popup_bg02.png" COMP;
-      }
-      styles
-        {
-           style { name: "popup_title_custom_style";
-              base: "font=SLP:style=Medium font_size="POPUP_BASE_CUSTOMSTYLE_TEXT_FONT_SIZE_INC" align=center color=#ffffff wrap=mixed ellipsis=1.0";
-              tag:  "br" "\n";
-              tag:  "ps" "ps";
-              tag:  "hilight" "+ font=SLP:style=Bold";
-              tag:  "b" "+ font=SLP:style=Bold";
-              tag:  "whitecolor" "+ color=#ffffff";
-              tag:  "tab" "\t";
-           }
-        }
-
       part { name: "base";
-         type: RECT;
+         type: IMAGE;
          scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
          description { state: "default" 0.0;
             min: POPUP_BASE_CUSTOMSTYLE_BASE_DEFAULT_MIN_INC;
             max: POPUP_BASE_CUSTOMSTYLE_BASE_DEFAULT_MAX_INC;
-            color: 0 0 0 0;
-            rel1.relative: 0.0 0.0;
-            rel2.relative: 1.0 1.0;
-            align: 0.0 0.0;
-         }
-      }
-      part { name: "background";
-         scale : 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            rel1.to: "base";
-            rel2.to: "base";
             image {
-               normal: "00_popup_bg02.png";
+               normal: "00_popup_bg.png";
                border: POPUP_BASE_CUSTOMSTYLE_BG_DEFAULT_IMAGE_BORDER_INC;
                border_scale: 1;
             }
+            align: 0.0 0.0;
          }
       }
-      part { name: "elm.rect.title";
+      part { name: "elm.bg.title";
          type: IMAGE;
          scale : 1;
          description { state: "default" 0.0;
@@ -1131,7 +1504,7 @@ group { name: "elm/popup/base/customstyle";
                to: "base";
             }
          }
-         description { state: "show_title" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
@@ -1140,20 +1513,20 @@ group { name: "elm/popup/base/customstyle";
          type: RECT;
          description { state: "default" 0.0;
             min: POPUP_BASE_CUSTOMSTYLE_TITLE_BOTTOM_LINE_MIN_INC;
-            fixed : 1 1;
+            fixed : 0 1;
             align: 0.5 0.0;
             visible: 0;
             color: POPUP_CUSTOMSTYLE_TITLE_BOTTOM_LINE_COLOR_INC;
             rel1 {
                relative: 0.0 1.0;
-               to: "elm.rect.title";
+               to: "elm.bg.title";
             }
             rel2 {
-               relative: 1.0 1.0;
-               to: "elm.rect.title";
+               to: "elm.bg.title";
+               offset: 0 1;
             }
          }
-         description { state: "show_title" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
@@ -1166,44 +1539,31 @@ group { name: "elm/popup/base/customstyle";
             max: POPUP_BASE_CUSTOMSTYLE_TITLE_ICON_DEFAULT_MIN_MAX_INC;
             fixed: 1 1;
             align: 0.0 0.5;
-            rel1 {
-               to: "elm.rect.title";
-               relative: 0.0 0.0;
-            }
-            rel2 {
-               to: "elm.rect.title";
-               relative: 1.0 1.0;
-            }
+            rel1.to: "elm.bg.title";
+            rel2.to: "elm.bg.title";
             visible: 0;
          }
-         description { state: "show_title_icon" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
       }
-      part {
-         name: "elm.swallow.title";
+      part { name: "elm.text.title";
          type: TEXTBLOCK;
          scale:1;
-         description {
-            state: "default" 0.0;
-            text
-              {
-                 style: "popup_title_custom_style";
-                 min: 0 0;
-                 max: 0 1;
-              }
+         description { state: "default" 0.0;
+            text {
+              style: "popup_title_custom_style";
+              min: 0 0;
+              max: 0 1;
+              align: 0.5 0.0;
+            }
             color: POPUP_CUSTOMSTYLE_TITLE_TEXT_COLOR_INC;
             visible:0;
-            rel1 { relative: 0.0 0.0; to: "elm.rect.title"; }
-            rel2 { relative: 1.0 1.0; to: "elm.rect.title"; }
-            align: 0.5 0.5;
+            rel1.to: "elm.bg.title";
+            rel2.to: "elm.bg.title";
          }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-         description { state: "show_title_icon" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
@@ -1213,7 +1573,7 @@ group { name: "elm/popup/base/customstyle";
          scale : 1;
          description { state: "default" 0.0;
             min: POPUP_BASE_CUSTOMSTYLE_CONTENT_DEFAULT_MIN_INC;
-            align: 0.5 0.5;
+            max: POPUP_BASE_CUSTOMSTYLE_CONTENT_DEFAULT_MIN_INC;
             fixed: 1 0;
             rel1 {
                relative: 0.5 0.0;
@@ -1224,21 +1584,21 @@ group { name: "elm/popup/base/customstyle";
                to: "base";
             }
          }
-         description { state: "show_title" 0.0;
+         description { state: "show_title_area" 0.0;
             inherit: "default" 0.0;
             rel1 {
                relative: 0.5 1.0;
                to: "elm.rect.title.bottom.line";
             }
          }
-         description { state: "show_button_area" 0.0;
+         description { state: "show_action_area" 0.0;
             inherit: "default" 0.0;
             rel2 {
                relative: 0.5 0.0;
-               to: "elm.swallow.buttonArea.Background";
+               to: "elm.swallow.action_area";
             }
          }
-         description { state: "show_button_title_area" 0.0;
+         description { state: "show_action_title_area" 0.0;
             inherit: "default" 0.0;
             rel1 {
                relative: 0.5 1.0;
@@ -1246,11 +1606,11 @@ group { name: "elm/popup/base/customstyle";
             }
             rel2 {
                relative: 0.5 0.0;
-               to: "elm.swallow.buttonArea.Background";
+               to: "elm.bg.action_area";
             }
          }
       }
-      part { name: "elm.swallow.buttonArea.Background";
+      part { name: "elm.bg.action_area";
          type: IMAGE;
          scale : 1;
          description { state: "default" 0.0;
@@ -1265,103 +1625,108 @@ group { name: "elm/popup/base/customstyle";
                relative: 0.0 1.0;
                to: "base";
             }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "base";
-            }
+            rel2.to: "base";
          }
-         description { state: "show_button_area" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
       }
-      part { name: "elm.swallow.buttonArea";
+      part { name: "elm.swallow.action_area";
          type: SWALLOW;
          scale : 1;
          description { state: "default" 0.0;
             align: 0.0 0.0;
-            visible: 0;
-            rel1 {
-               relative: 0.0 0.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+            rel1.to: "elm.bg.action_area";
+            rel2.to: "elm.bg.action_area";
          }
       }
    }
    programs {
-      program { name: show_title;
-         signal: "elm,state,title,visible";
-         source: "elm";
-         action: STATE_SET "show_title" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.rect.title.bottom.line";
-         target: "elm.swallow.content";
-         target: "base";
-      }
-      program { name: hide_title;
-         signal: "elm,state,title,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.rect.title.bottom.line";
-         target: "elm.swallow.content";
-         target: "base";
-      }
       program { name: show_title_icon;
          signal: "elm,state,title,icon,visible";
          source: "elm";
-         action: STATE_SET "show_title_icon" 0.0;
-         target: "elm.swallow.title";
+         action: STATE_SET "visible" 0.0;
          target: "elm.swallow.title.icon";
       }
       program { name: hide_title_icon;
          signal: "elm,state,title,icon,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
          target: "elm.swallow.title.icon";
       }
-      program { name: show_button_area;
-         signal: "elm,state,button,visible";
+      program { name: show_title_text;
+         signal: "elm,state,title,text,visible";
          source: "elm";
-         action: STATE_SET "show_button_area" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background";
-         target: "base";
+         action: STATE_SET "visible" 0.0;
+         target: "elm.text.title";
       }
-      program { name: hide_button_area;
-         signal: "elm,state,button,hidden";
+      program { name: hide_title_text;
+         signal: "elm,state,title,text,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background";
-         target: "base";
+         target: "elm.text.title";
       }
-      program { name: show_button_title_area;
-         signal: "elm,state,button,title,visible";
+      program { name: show_title_area;
+         signal: "elm,state,title_area,visible";
          source: "elm";
-         action: STATE_SET "show_button_title_area" 0.0;
-         target: "elm.swallow.content";
-         target: "base";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.action_area", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "show_title_area", 0.0);
+            set_state(PART:"elm.bg.title", "visible", 0.0);
+            set_state(PART:"elm.rect.title.bottom.line", "visible", 0.0);
+
+         }
       }
-      program { name: hide_button_title_area;
-         signal: "elm,state,button,title,hidden";
+      program { name: hide_title_area;
+         signal: "elm,state,title_area,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.content";
-         target: "base";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.action_area", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "default", 0.0);
+            set_state(PART:"elm.bg.title", "default", 0.0);
+            set_state(PART:"elm.rect.title.bottom.line", "default", 0.0);
+         }
+      }
+      program { name: show_action_area;
+         signal: "elm,state,action_area,visible";
+         source: "elm";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.bg.title", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "show_action_area", 0.0);
+            set_state(PART:"elm.bg.action_area", "visible", 0.0);
+         }
+      }
+      program { name: hide_action_area;
+         signal: "elm,state,action_area,hidden";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.bg.title", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "default", 0.0);
+            set_state(PART:"elm.bg.action_area", "default", 0.0);
+         }
       }
    } /* end of programs */
 }
@@ -1373,20 +1738,13 @@ group { name: "elm/popup/content/customstyle";
          scale : 1;
          description { state: "default" 0.0;
             min: POPUP_CONTENT_CUSTOMSTYLE_DEFAULT_MIN_INC;
-            align: 0.0 0.0;
-            fixed: 1 0;
-            rel1 {
-               relative: 0.0 0.0;
-            }
-            rel2 {
-               relative: 1.0 1.0;
-            }
          }
       }
    }
 }
 
 group { name: "elm/popup/buttons1/default";
+   data.item: "action_area_height" POPUP_BUTTON_DEFAULT_ACTION_AREA_HEIGHT;
    parts{
       part{ name:"actionbtn1";
          type: SWALLOW;
@@ -1395,19 +1753,15 @@ group { name: "elm/popup/buttons1/default";
             min: POPUP_BUTTON1_DEFAULT_BUTTON1_DEFAULT_MIN_MAX_INC;
             max: POPUP_BUTTON1_DEFAULT_BUTTON1_DEFAULT_MIN_MAX_INC;
             fixed : 1 1;
-            align: 0.5 0.5;
-            rel1 {
-               relative: 0.5 0.0;
-            }
-            rel2 {
-               relative: 0.5 1.0;
-            }            
+            rel1.relative: 0.5 0.0;
+            rel2.relative: 0.5 1.0;
          }
       }
    }
 }
 
 group { name: "elm/popup/buttons2/default";
+   data.item: "action_area_height" POPUP_BUTTON_DEFAULT_ACTION_AREA_HEIGHT;
    parts{
       part{ name:"actionbtn1";
          type: SWALLOW;
@@ -1417,10 +1771,7 @@ group { name: "elm/popup/buttons2/default";
             max: POPUP_BUTTON2_DEFAULT_BUTTON_DEFAULT_MIN_MAX_INC;
             fixed : 1 1;
             align: 1.0 0.5;
-            rel1 {
-               relative: 0.0 0.0;
-               to: "elm.rect.pad_btn";
-            }
+            rel1.to: "elm.rect.pad_btn";
             rel2 {
                relative: 0.0 1.0;
                to: "elm.rect.pad_btn";
@@ -1434,14 +1785,9 @@ group { name: "elm/popup/buttons2/default";
             min: POPUP_BUTTON2_DEFAULT_PADDING_BUTTON_MIN_MAX_INC;
             max: POPUP_BUTTON2_DEFAULT_PADDING_BUTTON_MIN_MAX_INC;
             fixed : 1 1;
-            align: 0.5 0.5;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 0.5 0.0;
-            }
-            rel2 {
-               relative: 0.5 1.0;
-            }
+            visible: 0;
+            rel1.relative: 0.5 0.0;
+            rel2.relative: 0.5 1.0;
          }
       }
       part{ name:"actionbtn2";
@@ -1456,17 +1802,15 @@ group { name: "elm/popup/buttons2/default";
                relative: 1.0 0.0;
                to: "elm.rect.pad_btn";
             }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "elm.rect.pad_btn";
-            }
+            rel2.to: "elm.rect.pad_btn";
          }
       }
    }
 }
 
 group { name: "elm/popup/buttons3/default";
-      alias: "elm/popup/buttons3/menustyle";
+   alias: "elm/popup/buttons3/menustyle";
+   data.item: "action_area_height" POPUP_BUTTON_DEFAULT_ACTION_AREA_HEIGHT;
    parts{
       part{ name:"actionbtn1";
          type: SWALLOW;
@@ -1476,10 +1820,7 @@ group { name: "elm/popup/buttons3/default";
             max: POPUP_BUTTON3_DEFAULT_BUTTON_DEFAULT_MIN_MAX_INC;
             fixed : 1 1;
             align: 1.0 0.5;
-            rel1 {
-               relative: 0.0 0.0;
-               to: "elm.rect.pad_btn";
-            }
+            rel1.to: "elm.rect.pad_btn";
             rel2 {
                relative: 0.0 1.0;
                to: "elm.rect.pad_btn";
@@ -1493,12 +1834,8 @@ group { name: "elm/popup/buttons3/default";
             min: POPUP_BUTTON3_DEFAULT_PADDING_BUTTON_MIN_MAX_INC;
             max: POPUP_BUTTON3_DEFAULT_PADDING_BUTTON_MIN_MAX_INC;
             fixed : 1 1;
-            align: 0.5 0.5;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 0.0 0.0;
-               to: "actionbtn2";
-            }
+            visible: 0;
+            rel1.to: "actionbtn2";
             rel2 {
                relative: 0.0 1.0;
                to: "actionbtn2";
@@ -1512,13 +1849,8 @@ group { name: "elm/popup/buttons3/default";
             min: POPUP_BUTTON3_DEFAULT_BUTTON_DEFAULT_MIN_MAX_INC;
             max: POPUP_BUTTON3_DEFAULT_BUTTON_DEFAULT_MIN_MAX_INC;
             fixed : 1 1;
-            align: 0.5 0.5;
-            rel1 {
-               relative: 0.5 0.0;
-            }
-            rel2 {
-               relative: 0.5 1.0;
-            }
+            rel1.relative: 0.5 0.0;
+            rel2.relative: 0.5 1.0;
          }
       }
       part { name: "elm.rect.pad_btn2";
@@ -1528,16 +1860,12 @@ group { name: "elm/popup/buttons3/default";
             min: POPUP_BUTTON3_DEFAULT_PADDING_BUTTON_MIN_MAX_INC;
             max: POPUP_BUTTON3_DEFAULT_PADDING_BUTTON_MIN_MAX_INC;
             fixed : 1 1;
-            align: 0.5 0.5;
-            color: 0 0 0 0;
+            visible: 0;
             rel1 {
                relative: 1.0 0.0;
                to: "actionbtn2";
             }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "actionbtn2";
-            }
+            rel2.to: "actionbtn2";
          }
       }
       part{ name:"actionbtn3";
@@ -1552,71 +1880,44 @@ group { name: "elm/popup/buttons3/default";
                relative: 1.0 0.0;
                to: "elm.rect.pad_btn2";
             }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "elm.rect.pad_btn2";
-            }
+            rel2.to: "elm.rect.pad_btn2";
          }
       }
    }
 }
 
 group { name: "elm/popup/base/volumebarstyle";
+   images {
+      image: "00_popup_title_bg.png" COMP;
+      image: "00_popup_bottom_bg.png" COMP;
+      image: "00_popup_bg.png" COMP;
+   }
    parts {
-      images {
-         image: "00_volume_popup_bg.png" COMP;
-      }
-      styles
-        {
-           style { name: "popup_title_volumebarstyle";
-              base: "font=SLP:style=Medium font_size="POPUP_BASE_VOLUMEBAR_STYLE_TEXT_FONT_SIZE_INC" align=center color=#ffffff wrap=mixed ellipsis=1.0";
-              tag:  "br" "\n";
-              tag:  "ps" "ps";
-              tag:  "hilight" "+ font=SLP:style=Bold";
-              tag:  "b" "+ font=SLP:style=Bold";
-              tag:  "whitecolor" "+ color=#ffffff";
-              tag:  "tab" "\t";
-           }
-        }
-
       part { name: "base";
-         type: RECT;
+         type: IMAGE;
          scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
          description { state: "default" 0.0;
             min: POPUP_BASE_VOLUMEBAR_STYLE_BASE_DEFAULT_MIN_INC;
             max: POPUP_BASE_VOLUMEBAR_STYLE_BASE_DEFAULT_MAX_INC;
-            color: 0 0 0 0;
-            rel1.relative: 0.0 0.0;
-            rel2.relative: 1.0 1.0;
-            align: 0.0 0.0;
-         }
-      }
-      part { name: "background";
-         scale : 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            rel1.to: "base";
-            rel2.to: "base";
             image {
-               normal: "00_volume_popup_bg.png";
-               border: POPUP_BASE_VOLUMEBAR_STYLE_BG_IMAGE_BORDER_INC;
-               middle: DEFAULT;
+               normal: "00_popup_bg.png";
+               border: POPUP_BASE_DEFAULT_BG_DEFAULT_IMAGE_BORDER_INC;
                border_scale: 1;
             }
+            align: 0.0 0.0;
          }
       }
-      part { name: "elm.rect.title";
-         type: RECT;
+      part { name: "elm.bg.title";
+         type: IMAGE;
          scale : 1;
          description { state: "default" 0.0;
-            color: 0 0 0 0;
-            min: POPUP_BASE_VOLUMEBAR_STYLE_TITLE_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BASE_VOLUMEBAR_STYLE_TITLE_DEFAULT_MIN_MAX_INC;
+            min: POPUP_BASE_DEFAULT_TITLE_VOLUMEBAR_MIN_INC;
             fixed : 1 1;
             align: 0.5 0.0;
             visible: 0;
+            image.normal: "00_popup_title_bg.png";
+            image.border: POPUP_BASE_VOLUMEBAR_STYLE_TITLE_DEFAULT_IMAGE_BORDER_INC;
+            image.border_scale: 1;
             rel1 {
                relative: 0.5 0.0;
                to: "base";
@@ -1626,59 +1927,80 @@ group { name: "elm/popup/base/volumebarstyle";
                to: "base";
             }
          }
-         description { state: "show_title" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
       }
-      part {
-         name: "elm.swallow.title";
-         type: TEXTBLOCK;
-         effect: SHADOW;
-         scale:1;
-         description {
-            state: "default" 0.0;
-            text
-              {
-                 style: "popup_title_volumebarstyle";
-                 min: 0 0;
-                 max: 0 1;
-              }
-            color: POPUP_DEFAULT_TITLE_TEXT_COLOR_INC;
-            visible:0;
-            color2: 0 0 0 255;
-            rel1 { relative: 0.0 0.0; to: "elm.rect.title"; }
-            rel2 { relative: 1.0 1.0; to: "elm.rect.title"; }
-            align: 0.5 0.2;
-         }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+      part { name: "left_pad";
+         type: RECT;
+         scale: 1;
+         description { state: "default" 0.0;
+            min: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
+            max: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
+            fixed: 1 1;
+            align: 0.0 0.0;
+            visible: 0;
+            rel1.to: "elm.bg.title";
          }
-         description { state: "show_title_icon" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+      }
+      part { name: "right_pad";
+         type: RECT;
+         scale: 1;
+         description { state: "default" 0.0;
+            min: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
+            max: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
+            fixed: 1 1;
+            align: 1.0 1.0;
+            visible: 0;
+            rel2.to: "elm.bg.title";
          }
       }
       part { name: "elm.swallow.title.icon";
          type: SWALLOW;
          scale: 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_VOLUMEBAR_STYLE_TITLE_ICON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BASE_VOLUMEBAR_STYLE_TITLE_ICON_DEFAULT_MIN_MAX_INC;
+            min: POPUP_BASE_DEFAULT_TITLE_ICON_DEFAULT_MIN_MAX_INC;
+            max: POPUP_BASE_DEFAULT_TITLE_ICON_DEFAULT_MIN_MAX_INC;
             fixed: 1 1;
-            align: 0.5 0.9;
+            align: 0.0 0.5;
             rel1 {
-               to: "elm.rect.title";
-               relative: 0.0 0.0;
+               to: "left_pad";
+               relative: 1.0 0.0;
             }
             rel2 {
-               to: "elm.rect.title";
-               relative: 1.0 1.0;
+               to: "right_pad";
+               relative: 0.0 1.0;
             }
             visible: 0;
          }
-         description { state: "show_title_icon" 0.0;
+         description { state: "visible" 0.0;
+            inherit: "default" 0.0;
+            visible: 1;
+         }
+      }
+      part { name: "elm.text.title";
+         type: TEXTBLOCK;
+         scale:1;
+         description { state: "default" 0.0;
+            text {
+              style: "popup_title_style";
+              min: 0 0;
+              max: 0 1;
+              align: 0.5 0.0;
+            }
+            color: POPUP_DEFAULT_TITLE_TEXT_COLOR_INC;
+            visible:0;
+            rel1 {
+               relative: 1.0 0.0;
+               to: "left_pad";
+            }
+            rel2 {
+               relative: 0.0 1.0;
+               to: "right_pad";
+            }
+         }
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
@@ -1688,174 +2010,156 @@ group { name: "elm/popup/base/volumebarstyle";
          scale : 1;
          description { state: "default" 0.0;
             min: POPUP_BASE_VOLUMEBAR_STYLE_CONTENT_DEFAULT_MIN_INC;
-            align: 0.5 0.5;
             fixed: 1 0;
             rel1 {
                relative: 0.5 0.0;
                to: "base";
             }
             rel2 {
-               relative: 0.5 0.0;
-               to: "pad_b_button";
+               relative: 0.5 1.0;
+               to: "base";
             }
          }
-         description { state: "show_title" 0.0;
+         description { state: "show_title_area" 0.0;
             inherit: "default" 0.0;
             rel1 {
                relative: 0.5 1.0;
-               to: "elm.rect.title";
+               to: "elm.bg.title";
             }
          }
-         description { state: "show_button_area" 0.0;
+         description { state: "show_action_area" 0.0;
             inherit: "default" 0.0;
             rel2 {
                relative: 0.5 0.0;
-               to: "elm.swallow.buttonArea.Background";
+               to: "elm.bg.action_area";
             }
          }
-         description { state: "show_button_title_area" 0.0;
+         description { state: "show_action_title_area" 0.0;
             inherit: "default" 0.0;
             rel1 {
                relative: 0.5 1.0;
-               to: "elm.rect.title";
+               to: "elm.bg.title";
             }
             rel2 {
                relative: 0.5 0.0;
-               to: "elm.swallow.buttonArea.Background";
+               to: "elm.bg.action_area";
             }
          }
       }
-      part { name: "elm.swallow.buttonArea.Background";
-         type: RECT;
+      part { name: "elm.bg.action_area";
+         type: IMAGE;
          scale : 1;
          description { state: "default" 0.0;
             min: POPUP_BASE_VOLUMEBAR_STYLE_BUTTONAREA_BG_DEFAULT_MIN_INC;
             fixed : 1 1;
             align: 0.5 1.0;
-            color: 0 0 0 0;
             visible: 0;
+            image.normal: "00_popup_bottom_bg.png";
+            image.border: POPUP_BASE_DEFAULT_BUTTON_BG_IMAGE_BORDER_INC;
+            image.border_scale: 1;
             rel1 {
-               relative: 0.5 0.0;
-               to: "pad_b_button";
-            }
-            rel2 {
-               relative: 0.5 0.0;
-               to: "pad_b_button";
+               relative: 0.0 1.0;
+               to: "base";
             }
+            rel2.to: "base";
          }
-         description { state: "show_button_area" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
       }
-      part { name: "elm.swallow.buttonArea";
+      part { name: "elm.swallow.action_area";
          type: SWALLOW;
          scale : 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_VOLUMEBAR_STYLE_BUTTONAREA_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BASE_VOLUMEBAR_STYLE_BUTTONAREA_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 0.5 0.5;
-            visible: 0;
-            rel1 {
-               relative: 0.0 0.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-      part { name: "pad_b_button";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            align: 0.5 1.0;
-            min: POPUP_BASE_VOLUMEBAR_STYLE_PADDING_BOTTOM_MIN_INC;
-            fixed: 0 1;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 0.0 1.0;
-               to: "base";
-            }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "base";
-            }
+            align: 0.0 0.0;
+            rel1.to: "elm.bg.action_area";
+            rel2.to: "elm.bg.action_area";
          }
       }
    }
    programs {
-      program { name: show_title;
-         signal: "elm,state,title,visible";
-         source: "elm";
-         action: STATE_SET "show_title" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content";
-         target: "base";
-      }
-      program { name: hide_title;
-         signal: "elm,state,title,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content";
-         target: "base";
-      }
       program { name: show_title_icon;
          signal: "elm,state,title,icon,visible";
          source: "elm";
-         action: STATE_SET "show_title_icon" 0.0;
-         target: "elm.swallow.title";
+         action: STATE_SET "visible" 0.0;
          target: "elm.swallow.title.icon";
       }
       program { name: hide_title_icon;
          signal: "elm,state,title,icon,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
          target: "elm.swallow.title.icon";
       }
-      program { name: show_button_area;
-         signal: "elm,state,button,visible";
+      program { name: show_title_text;
+         signal: "elm,state,title,text,visible";
          source: "elm";
-         action: STATE_SET "show_button_area" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background";
-         target: "base";
+         action: STATE_SET "visible" 0.0;
+         target: "elm.text.title";
       }
-      program { name: hide_button_area;
-         signal: "elm,state,button,hidden";
+      program { name: hide_title_text;
+         signal: "elm,state,title,text,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background";
-         target: "base";
+         target: "elm.text.title";
       }
-      program { name: show_button_title_area;
-         signal: "elm,state,button,title,visible";
+      program { name: show_title_area;
+         signal: "elm,state,title_area,visible";
          source: "elm";
-         action: STATE_SET "show_button_title_area" 0.0;
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-      program { name: hide_button_title_area;
-         signal: "elm,state,button,title,hidden";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.action_area", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "show_title_area", 0.0);
+            set_state(PART:"elm.bg.title", "visible", 0.0);
+         }
+      }
+      program { name: hide_title_area;
+         signal: "elm,state,title_area,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.content";
-         target: "base";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.action_area", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "default", 0.0);
+            set_state(PART:"elm.bg.title", "default", 0.0);
+         }
+      }
+      program { name: show_action_area;
+         signal: "elm,state,action_area,visible";
+         source: "elm";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.bg.title", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "show_action_area", 0.0);
+            set_state(PART:"elm.bg.action_area", "visible", 0.0);
+         }
+      }
+      program { name: hide_action_area;
+         signal: "elm,state,action_area,hidden";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.bg.title", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "default", 0.0);
+            set_state(PART:"elm.bg.action_area", "default", 0.0);
+         }
       }
    } /* end of programs */
 }
@@ -1903,7 +2207,7 @@ group { name: "elm/popup/content/volumebarstyle";
             min : POPUP_CONTENT_VOLUMEBAR_STYLE_PADDING_RIGHT_MIN_INC;
             fixed: 1 0;
             rel1 {
-               relative: 1.0 0.0; 
+               relative: 1.0 0.0;
             }
             rel2 {
                relative: 1.0 1.0;
@@ -1917,6 +2221,7 @@ group { name: "elm/popup/content/volumebarstyle";
          scale : 1;
          description { state: "default" 0.0;
             min: POPUP_CONTENT_VOLUMEBAR_STYLE_CONTENT_DEFAULT_MIN_INC;
+            max: POPUP_CONTENT_VOLUMEBAR_STYLE_CONTENT_DEFAULT_MIN_INC;
             align: 0.5 0.5;
             fixed: 1 0;
             rel1 {
@@ -1950,1071 +2255,291 @@ group { name: "elm/popup/content/volumebarstyle";
    }
 }
 
-group { name: "elm/popup/buttons2/volumebarstyle";
+group { name: "elm/layout/popup/entrypasswordview";
+   images {
+      image : "00_search_input_field_bg.png" COMP;
+   }
    parts{
-      part{ name:"actionbtn1";
-         type: SWALLOW;
-         scale : 1;
+      part { name: "base";
+         scale: 1;
          description { state: "default" 0.0;
-            min: POPUP_BUTTON2_VOLUMEBAR_STYLE_BUTTON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BUTTON2_VOLUMEBAR_STYLE_BUTTON_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 1.0 1.0;
+            min: POPUP_BASE_CUSTOMSTYLE_CONTENT_WIDTH_INC POPUP_BASE_CUSTOMSTYLE_CONTENT_HEIGHT_INC;
+            fixed: 1 0;
+            align: 0.5 0.5;
+            rel1 { relative: 0.0 0.0; }
+            rel2 { relative: 1.0 1.0; }
+         }
+      }
+      part { name: "pad_l";
+         scale: 1;
+         description { state: "default" 0.0;
+            min : POPUP_BASE_CUSTOMSTYLE_CONTENT_SIDE_PADDING_INC 0;
+            fixed: 1 0;
             rel1 {
-               relative: 0.0 0.0;
-               to: "elm.rect.pad_btn";
+               relative: 0.0 0.0; to: "base";
             }
             rel2 {
-               relative: 0.0 1.0;
-               to: "elm.rect.pad_btn";
+               relative: 0.0 1.0; to: "base";
             }
+            align: 0.0 0.0;
          }
       }
-      part { name: "elm.rect.pad_btn";
-         type: RECT;
-         scale : 1;
+      part { name: "elm.image1";
+         type: IMAGE;
+         scale: 1;
          description { state: "default" 0.0;
-            min: POPUP_BUTTON2_VOLUMEBAR_STYLE_PADDING_BUTTON_MIN_MAX_INC;
-            max: POPUP_BUTTON2_VOLUMEBAR_STYLE_PADDING_BUTTON_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 0.5 1.0;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 0.5 0.0;
-            }
-            rel2 {
-               relative: 0.5 1.0;
+            min: POPUP_BASE_CUSTOMSTYLE_CONTENT_ENTRY_MIN_INC;
+            max: POPUP_BASE_CUSTOMSTYLE_CONTENT_ENTRY_MIN_INC;
+            fixed: 1 1;
+            align: 0.0 0.5;
+            rel1 { relative: 1.0 0.0; to_x: "pad_l"; to_y: "base"; }
+            rel2 { relative: 1.0 1.0; to: "base"; }
+            image { normal: "00_search_input_field_bg.png";
+               border: 3 3 3 3;
+               border_scale: 1;
             }
          }
       }
-      part{ name:"actionbtn2";
+      part { name: "elm.entry1";
          type: SWALLOW;
-         scale : 1;
+         scale: 1;
          description { state: "default" 0.0;
-            min: POPUP_BUTTON2_VOLUMEBAR_STYLE_BUTTON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BUTTON2_VOLUMEBAR_STYLE_BUTTON_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 0.0 1.0;
+             rel1.to: "elm.image1";
+             rel2.to: "elm.image1";
+         }
+      }
+      part { name: "pad_n";
+         scale: 1;
+         description { state: "default" 0.0;
+            min : POPUP_BASE_CUSTOMSTYLE_CONTENT_CENTER_PADDING_MIN_INC 0;
+            max: POPUP_BASE_CUSTOMSTYLE_CONTENT_CENTER_PADDING_MIN_INC 9999;
+            fixed: 1 0;
             rel1 {
-               relative: 1.0 0.0;
-               to: "elm.rect.pad_btn";
+               relative: 1.0 0.0; to_x: "elm.image1"; to_y: "base";
             }
             rel2 {
-               relative: 1.0 1.0;
-               to: "elm.rect.pad_btn";
+               relative: 1.0 1.0; to: "base";
             }
+            align: 0.0 0.0;
          }
       }
-   }
-}
-
-group { name: "elm/popup/buttons1/volumebarstyle";
-   parts{
-      part{ name:"actionbtn1";
-         type: SWALLOW;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_BUTTON1_VOLUMEBAR_STYLE_BUTTON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BUTTON1_VOLUMEBAR_STYLE_BUTTON_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 0.5 1.0;
-                rel1 {
-                   relative: 0.5 0.0;
-                }
-            rel2 {
-               relative: 0.5 1.0;
-            }
-         }
-      }
-   }
-}
-
-group { name: "elm/popup/base/image_scroll";
-   parts {
-      images {
-         image: "00_popup_title_middle.png" COMP;
-         image: "00_popup_bottom.png" COMP;
-      }
-      styles
-        {
-           style { name: "popup_image_title_style";
-              base: "font=SLP:style=Medium font_size="POPUP_BASE_IMAGE_SCROLL_TEXT_FONT_SIZE_INC" align=center color=#ffffff wrap=mixed ellipsis=1.0";
-              tag:  "br" "\n";
-              tag:  "ps" "ps";
-              tag:  "hilight" "+ font=SLP:style=Bold";
-              tag:  "b" "+ font=SLP:style=Bold";
-              tag:  "whitecolor" "+ color=#ffffff";
-              tag:  "tab" "\t";
-           }
-        }
-        part { name: "bg";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_SCROLL_BG_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BASE_IMAGE_SCROLL_BG_DEFAULT_MIN_MAX_INC;
-            visible: 0;
-            rel1.relative: 0.0 0.0;
-            rel2.relative: 1.0 1.0;
-            align: 0.0 0.0;
-         }
-      }
-      part { name: "base";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
+      part { name: "elm.image2";
+         type: IMAGE;
+         scale: 1;
          description { state: "default" 0.0;
-            fixed: 1 1;
-            color: 255 0 0 0;
-            rel1 {
-               relative: 0.042 0.6; to: "bg";
-            }
-            rel2 {
-               relative: 0.88 0.94; to: "bg";}
-            align: 0.0 0.0;
-         }
-      }
-      part { name: "elm.rect.title";
-         type: IMAGE;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_SCROLL_TITLE_DEFAULT_MIN_INC;
-            fixed : 1 1;
-            align: 0.5 0.0;
-            visible: 0;
-            image.normal: "00_popup_title_middle.png";
-            image.border: POPUP_BASE_IMAGE_SCROLL_TITLE_IMAGE_BORDER_INC;
-            image.border_scale: 1;
-            rel1 {
-               relative: 0.0 0.0; to: "base";
-            }
-            rel2 {
-               relative: 1.0 0.0; to: "base";
-            }
-         }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-      part { name: "background";
-         scale : 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_SCROLL_BACKGROUND_DEFAULT_MIN_INC;
-            rel1.to: "elm.rect.title";
-            rel2.to: "base";
-            rel1.relative: 0.0 1.0;
-            rel2.relative: 1.0 1.0;
-            image {
-               normal: "00_popup_bottom.png";
-               border: POPUP_BASE_IMAGE_SCROLL_BACKGROUND_IMAGE_BORDER_INC;
-               middle: DEFAULT;
-               border_scale: 1;
-            }
-         }
-      }
-      part { name: "elm.swallow.title.icon";
-         type: SWALLOW;
-         scale: 1;
-         description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_SCROLL_TITLE_ICON_MIN_MAX_INC;
-            max: POPUP_BASE_IMAGE_SCROLL_TITLE_ICON_MIN_MAX_INC;
+            min: POPUP_BASE_CUSTOMSTYLE_CONTENT_ENTRY_MIN_INC;
+            max: POPUP_BASE_CUSTOMSTYLE_CONTENT_ENTRY_MIN_INC;
             fixed: 1 1;
             align: 0.0 0.5;
-            rel1 {
-               to: "elm.rect.title";
-               relative: 0.0 0.0;
-            }
-            rel2 {
-               to: "elm.rect.title";
-               relative: 1.0 1.0;
-            }   
-            visible: 0;
-         }
-         description { state: "show_title_icon" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-      part {
-         name: "elm.swallow.title";
-         type: TEXTBLOCK;
-         effect: SHADOW;
-         scale:1;
-         description {
-            state: "default" 0.0;
-            text
-              {                 
-                 style: "popup_image_title_style";
-                 min: 0 0;
-                 max: 0 1;
-              }
-            color: POPUP_DEFAULT_TITLE_TEXT_COLOR_INC;
-            visible:0;
-            color2: 0 0 0 255;
-            rel1 { relative: 0.0 0.0; to: "elm.rect.title"; }  
-            rel2 { relative: 1.0 1.0; to: "elm.rect.title"; }
-            align: 0.5 0.5;
-         }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-         description { state: "show_title_icon" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-      part { name: "elm.swallow.content";
-         type: SWALLOW;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_SCROLL_CONTENT_DEFAULT_MIN_INC;
-            align: 0.0 0.0;
-            fixed: 1 0;
-            rel1 {
-               relative: 0.05 0.05;
-               to: "background";
-            }
-            rel2 {
-               relative: 0.95 0.98;
-               to: "background";
-            }
-         }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            rel1 {
-               relative: 0.05 1.05;
-               to: "elm.rect.title";
-            }
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
-         }
-         description { state: "show_button_title_area" 0.0;
-            inherit: "default" 0.0;
-            rel1 {
-               relative: 0.05 1.05;
-               to: "elm.rect.title";
-            }
-            rel2 {
-               relative: 0.95 0.98;
-               to: "background";
-            }
-         }
-      }
-      part { name: "elm.swallow.buttonArea.Background";
-         type: RECT;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_SCROLL_BUTTONAREA_BG_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BASE_IMAGE_SCROLL_BUTTONAREA_BG_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 0.0 0.5;
-            visible: 1;
-            rel1 {
-               relative: 0.92 0.04;
-               to: "bg";
-            }
-            rel2 {
-               relative: 1.0  1.0);
-               to_x: "bg";
-               to_y: "base";
+            rel1 { relative: 1.0 0.0; to_x: "pad_n"; to_y: "base"; }
+            rel2 { relative: 1.0 1.0; to: "base"; }
+            image { normal: "00_search_input_field_bg.png";
+               border: 3 3 3 3;
+               border_scale: 1;
             }
-            color: 0 0 0 0;
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
          }
       }
-      part { name: "elm.swallow.buttonArea";
+      part { name: "elm.entry2";
          type: SWALLOW;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_SCROLL_BUTTONAREA_DEFAULT_MIN_INC;
-            max: POPUP_BASE_IMAGE_SCROLL_BUTTONAREA_DEFAULT_MAX_INC;
-            fixed : 1 1;
-            align: 0.0 0.5;
-            visible: 0;
-            rel1 {
-               relative: 0.0 0.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-            rel2 {
-               relative: 0.0 1.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-      part { name: "pad_b_button";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            align: 0.5 1.0;
-            min: POPUP_BASE_IMAGE_SCROLL_PADDING_BOTTOM_MIN_INC;
-            fixed: 0 1;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 0.0 1.0;
-               to: "base";
-            }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "base";
-            }
-         }
-      }
-   }
-   programs {
-      /*    program {
-       name: "show";
-       signal: "elm,state,show";
-       source: "elm";
-       action: STATE_SET "visible" 0.0;
-       target: "background";
-       transition: "DECELERATE" 0.5; 
-       }
-       program {
-       name: "hide";
-       signal: "elm,state,hide";
-       source: "elm";
-       action: STATE_SET "default" 0.0;
-       target: "background";
-       transition: "DECELERATE" 0.5; 
-      }*/
-      program { name: show_title;
-         signal: "elm,state,title,visible";
-         source: "elm";
-         action: STATE_SET "show_title" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-      program { name: hide_title;
-         signal: "elm,state,title,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-      program { name: show_title_icon;
-         signal: "elm,state,title,icon,visible";
-         source: "elm";
-         action: STATE_SET "show_title_icon" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.swallow.title.icon";
-      }
-      program { name: hide_title_icon;
-         signal: "elm,state,title,icon,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.swallow.title.icon";
-      }
-      program { name: show_button_area;
-         signal: "elm,state,button,visible";
-         source: "elm";
-         action: STATE_SET "show_button_area" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background"; 
-         target: "base";
-      }
-      program { name: hide_button_area;
-         signal: "elm,state,button,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background"; 
-         target: "base";
-      }
-      program { name: show_button_title_area;
-         signal: "elm,state,button,title,visible";
-         source: "elm";
-         action: STATE_SET "show_button_title_area" 0.0;
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-      program { name: hide_button_title_area;
-         signal: "elm,state,button,title,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-   } /* end of programs */
-}
-
-group { name: "elm/popup/content/image_scroll";
-   parts{
-      part { name: "pad_t";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            align: 0.5 0.0;
-            min: POPUP_CONTENT_IMAGE_SCROLL_PADDING_TOP_MIN_INC;
-            fixed: 0 1;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 1.0 0.0;to_x: "pad_l";
-            }
-            rel2 {
-               relative: 0.0 0.0;to_x: "pad_r"; 
-            }
-         }
-      }
-      part { name: "pad_l";
-         type: RECT;
          scale: 1;
          description { state: "default" 0.0;
-            min : POPUP_CONTENT_IMAGE_SCROLL_PADDING_LEFT_MIN_INC;
-            fixed: 1 0;
-            rel1 { 
-               relative: 0.0 0.0; 
-            }
-            rel2 { 
-               relative: 0.0 1.0; 
-            }
-            color: 0 0 0 0;
-            align: 0.0 0.0;
+             rel1.to: "elm.image2";
+             rel2.to: "elm.image2";
          }
       }
-      part { name: "pad_r";     
-         type: RECT;
+      part { name: "pad_n2";
          scale: 1;
          description { state: "default" 0.0;
-            min : POPUP_CONTENT_IMAGE_SCROLL_PADDING_RIGHT_MIN_INC;
+            min : POPUP_BASE_CUSTOMSTYLE_CONTENT_CENTER_PADDING_MIN_INC 0;
+            max: POPUP_BASE_CUSTOMSTYLE_CONTENT_CENTER_PADDING_MIN_INC 9999;
             fixed: 1 0;
-            rel1 { 
-               relative: 1.0 0.0; 
-            }
-            rel2 { 
-               relative: 1.0 1.0; 
-            }
-            color: 0 0 0 0;
-            align: 1.0 0.0;
-         }
-      } 
-      part{ name:"elm.swallow.content";
-         type: SWALLOW;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_CONTENT_IMAGE_SCROLL_CONTENT_DEFAULT_MIN_INC;
-            align: 0.5 0.5;
-            fixed: 1 0;
-            rel1 {
-               relative: 1.0 1.0;
-               to: "pad_t";
-            }
-            rel2 {
-               relative: 0.0 0.0;
-               to: "pad_b";
-            }
-         }
-      }
-      part { name: "pad_b";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            align: 0.5 1.0;
-            min: POPUP_CONTENT_IMAGE_SCROLL_PADDING_BOTTOM_MIN_INC;
-            fixed: 0 1;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 1.0 1.0;to_x: "pad_l";
-            }
-            rel2 {
-               relative: 0.0 1.0;to_x: "pad_r";
-            }
-         }
-      }
-   }
-}
-group { name: "elm/popup/buttons2/image_scroll";
-   parts{
-      part{ name:"actionbtn1";
-         type: SWALLOW;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_BUTTONS2_IMAGE_SCROLL_BUTTON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BUTTONS2_IMAGE_SCROLL_BUTTON_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 0.0 0.0;
             rel1 {
-               relative: 0.0 0.0;
+               relative: 1.0 0.0; to_x: "elm.image2"; to_y: "base";
             }
-         }
-      }
-      part{ name:"actionbtn2";
-         type: SWALLOW;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_BUTTONS2_IMAGE_SCROLL_BUTTON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BUTTONS2_IMAGE_SCROLL_BUTTON_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 0.0 1.0;
             rel2 {
-               relative: 1.0 1.0;
-            }
-         }
-      }
-   }
-}
-
-group { name: "elm/popup/base/image_slider";
-   parts {
-      images {
-         image: "00_popup_title_middle.png" COMP;
-         image: "00_popup_content.png" COMP;
-      }
-      part { name: "bg";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_SLIDER_BG_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BASE_IMAGE_SLIDER_BG_DEFAULT_MIN_MAX_INC;
-            color: 0 0 0 0;
-            rel1.relative: 0.0 0.0;
-            rel2.relative: 1.0 1.0;
-            align: 0.0 0.0;
-         }
-      }
-      part { name: "base";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 0.23 0.3; to: "bg";
+               relative: 1.0 1.0; to: "base";
             }
-            rel2 {
-               relative: 0.77 0.94; to: "bg";}
             align: 0.0 0.0;
          }
       }
-      part { name: "elm.rect.title";
+      part { name: "elm.image3";
          type: IMAGE;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_SLIDER_TITLE_DEFAULT_MIN_INC;
-            fixed : 1 1;
-            align: 0.5 0.0;
-            visible: 0;
-            image.normal: "00_popup_title_middle.png";
-            image.border: POPUP_BASE_IMAGE_SLIDER_TITLE_DEFAULT_IMAGE_BORDER_INC;
-            image.border_scale: 1;
-            rel1 {
-               relative: 0.0 0.0; to: "base";
-            }
-            rel2 {
-               relative: 1.0 0.0; to: "base";
-            }
-         }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-      part { name: "background";
-         scale : 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            align: 0.5 0.0;
-            rel1.to: "elm.rect.title";
-            rel2.to: "base";
-            rel1.relative: 0.0 1.0;
-            rel2.relative: 1.0 1.0;
-            image {
-               normal: "00_popup_content.png";
-               border: POPUP_BASE_IMAGE_SLIDER_BACKGROUND_DEFAULT_IMAGE_BORDER_INC;
-               middle: DEFAULT;
-               border_scale: 1;
-            }
-         }
-      }
-      part { name: "elm.swallow.title.icon";
-         type: SWALLOW;
          scale: 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_SLIDER_TITLE_ICON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BASE_IMAGE_SLIDER_TITLE_ICON_DEFAULT_MIN_MAX_INC;
+            min: POPUP_BASE_CUSTOMSTYLE_CONTENT_ENTRY_MIN_INC;
+            max: POPUP_BASE_CUSTOMSTYLE_CONTENT_ENTRY_MIN_INC;
             fixed: 1 1;
             align: 0.0 0.5;
-            rel1 {
-               to: "elm.rect.title";
-               relative: 0.0 0.0;
-            }
-            rel2 {
-               to: "elm.rect.title";
-               relative: 1.0 1.0;
-            }   
-            visible: 0;
-         }
-         description { state: "show_title_icon" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-      part {
-         name: "elm.swallow.title";
-         type: TEXTBLOCK;
-         effect: SHADOW;
-         scale:1;
-         description {
-            state: "default" 0.0;
-            text
-              {                 
-                 style: "popup_image_title_style";
-                 min: 0 0;
-                 max: 0 1;
-              }
-            color: POPUP_DEFAULT_TITLE_TEXT_COLOR_INC;
-            visible:0;
-            color2: 0 0 0 255;
-            rel1 { relative: 0.0 0.0; to: "elm.rect.title"; }  
-            rel2 { relative: 1.0 1.0; to: "elm.rect.title"; }
-            align: 0.5 0.5;
-         }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-         description { state: "show_title_icon" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-      part { name: "elm.swallow.content";
-         type: SWALLOW;
-         scale : 1;
-         description { state: "default" 0.0;
-            align: 0.0 0.0;
-            rel1 {
-               relative: 0.03 0.05;
-               to: "background";
-            }
-            rel2 {
-               relative: 0.97 0.98;
-               to: "background";
-            }
-         }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            rel1 {
-               relative: 0.05 1.05;
-               to: "elm.rect.title";
-            }
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
-         }
-         description { state: "show_button_title_area" 0.0;
-            inherit: "default" 0.0;
-            rel1 {
-               relative: 0.05 1.05;
-               to: "elm.rect.title";
-            }
-            rel2 {
-               relative: 0.95 0.98;
-               to: "background";
-            }
-         }
-      }
-      part { name: "elm.swallow.buttonArea.Background";
-         type: RECT;
-         scale : 1;
-         description { state: "default" 0.0;
-            align: 0.0 0.0;
-            visible: 1;
-            rel1 {
-               relative: 0.92 0.04;
-               to: "bg";
-            }
-            rel2 {
-               relative: 1.0  1.0);
-               to_x: "bg";
-               to_y: "base";
+            rel1 { relative: 1.0 0.0; to_x: "pad_n2"; to_y: "base"; }
+            rel2 { relative: 1.0 1.0; to: "base"; }
+            image { normal: "00_search_input_field_bg.png";
+               border: 3 3 3 3;
+               border_scale: 1;
             }
-            color: 0 0 0 0;
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
          }
       }
-      part { name: "elm.swallow.buttonArea";
+      part { name: "elm.entry3";
          type: SWALLOW;
-         scale : 1;
-         description { state: "default" 0.0;
-            align: 0.5 0.5;
-            visible: 0;
-            rel1 {
-               relative: 0.0 0.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
-         }
-      }
-   }
-   programs {
-      /*    program {
-       name: "show";
-       signal: "elm,state,show";
-       source: "elm";
-       action: STATE_SET "visible" 0.0;
-       target: "background";
-       transition: "DECELERATE" 0.5; 
-       }
-       program {
-       name: "hide";
-       signal: "elm,state,hide";
-       source: "elm";
-       action: STATE_SET "default" 0.0;
-       target: "background";
-       transition: "DECELERATE" 0.5; 
-      }*/
-      program { name: show_title;
-         signal: "elm,state,title,visible";
-         source: "elm";
-         action: STATE_SET "show_title" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-      program { name: hide_title;
-         signal: "elm,state,title,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-      program { name: show_title_icon;
-         signal: "elm,state,title,icon,visible";
-         source: "elm";
-         action: STATE_SET "show_title_icon" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.swallow.title.icon";
-      }
-      program { name: hide_title_icon;
-         signal: "elm,state,title,icon,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.swallow.title.icon";
-      }
-      program { name: show_button_area;
-         signal: "elm,state,button,visible";
-         source: "elm";
-         action: STATE_SET "show_button_area" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background"; 
-         target: "base";
-      }
-      program { name: hide_button_area;
-         signal: "elm,state,button,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background"; 
-         target: "base";
-      }
-      program { name: show_button_title_area;
-         signal: "elm,state,button,title,visible";
-         source: "elm";
-         action: STATE_SET "show_button_title_area" 0.0;
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-      program { name: hide_button_title_area;
-         signal: "elm,state,button,title,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-   } /* end of programs */
-}
-
-group { name: "elm/popup/content/image_slider";
-   parts{
-      part { name: "pad_t";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            align: 0.5 0.0;
-            min: POPUP_CONTENT_IMAGE_SLIDER_PADDING_TOP_DEFAULT_MIN_INC;
-            fixed: 0 1;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 1.0 0.0;to_x: "pad_l";
-            }
-            rel2 {
-               relative: 0.0 0.0;to_x: "pad_r"; 
-            }
-         }
-      }
-      part { name: "pad_l";
-         type: RECT;
          scale: 1;
          description { state: "default" 0.0;
-            min : POPUP_CONTENT_IMAGE_SLIDER_PADDING_LEFT_DEFAULT_MIN_INC;
-            fixed: 1 0;
-            rel1 { 
-               relative: 0.0 0.0; 
-            }
-            rel2 { 
-               relative: 0.0 1.0; 
-            }
-            color: 0 0 0 0;
-            align: 0.0 0.0;
+             rel1.to: "elm.image3";
+             rel2.to: "elm.image3";
          }
       }
-      part { name: "pad_r";     
-         type: RECT;
+      part { name: "pad_n3";
          scale: 1;
          description { state: "default" 0.0;
-            min : POPUP_CONTENT_IMAGE_SLIDER_PADDING_RIGHT_DEFAULT_MIN_INC;
-            fixed: 1 0;
-            rel1 { 
-               relative: 1.0 0.0; 
-            }
-            rel2 { 
-               relative: 1.0 1.0; 
-            }
-            color: 0 0 0 0;
-            align: 1.0 0.0;
-         }
-      } 
-      part{ name:"elm.swallow.content";
-         type: SWALLOW;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_CONTENT_IMAGE_SLIDER_CONTENT_DEFAULT_MIN_INC;
-            align: 0.5 0.5;
+            min : POPUP_BASE_CUSTOMSTYLE_CONTENT_CENTER_PADDING_MIN_INC 0;
+            max: POPUP_BASE_CUSTOMSTYLE_CONTENT_CENTER_PADDING_MIN_INC 9999;
             fixed: 1 0;
             rel1 {
-               relative: 1.0 1.0;
-               to: "pad_t";
-            }
-            rel2 {
-               relative: 0.0 0.0;
-               to: "pad_b";     
+               relative: 1.0 0.0; to_x: "elm.image3"; to_y: "base";
+            }
+            rel2 {
+               relative: 1.0 1.0; to: "base";
             }
-         }
-      }
-      part { name: "pad_b";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            align: 0.5 1.0;
-            min: POPUP_CONTENT_IMAGE_SLIDER_PADDING_BOTTOM_DEFAULT_MIN_INC;
-            fixed: 0 1;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 1.0 1.0;to_x: "pad_l";
-            }
-            rel2 {
-               relative: 0.0 1.0;to_x: "pad_r"; 
-            }
-         }
-      }
-   }
-}
-group { name: "elm/popup/buttons2/image_slider";
-   parts{
-      part{ name:"actionbtn1";
-         type: SWALLOW;
-         scale : 1;
-         description { state: "default" 0.0;
-            min: POPUP_BUTTONS2_IMAGE_SLIDER_BUTTON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BUTTONS2_IMAGE_SLIDER_BUTTON_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
             align: 0.0 0.0;
-            rel1 {
-               relative: 0.0 0.0;
+         }
+      }
+      part { name: "elm.image4";
+         type: IMAGE;
+         scale: 1;
+         description { state: "default" 0.0;
+            min: POPUP_BASE_CUSTOMSTYLE_CONTENT_ENTRY_MIN_INC;
+            max: POPUP_BASE_CUSTOMSTYLE_CONTENT_ENTRY_MIN_INC;
+            fixed: 1 1;
+            align: 0.0 0.5;
+            rel1 { relative: 1.0 0.0; to_x: "pad_n3"; to_y: "base"; }
+            rel2 { relative: 1.0 1.0; to: "base"; }
+            image { normal: "00_search_input_field_bg.png";
+               border: 3 3 3 3;
+               border_scale: 1;
             }
          }
       }
-      part{ name:"actionbtn2";
+      part { name: "elm.entry4";
          type: SWALLOW;
-         scale : 1;
+         scale: 1;
          description { state: "default" 0.0;
-            min: POPUP_BUTTONS2_IMAGE_SLIDER_BUTTON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BUTTONS2_IMAGE_SLIDER_BUTTON_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 0.0 1.0;
-            rel2 {
-               relative: 1.0 1.0;
-            }
+             rel1.to: "elm.image4";
+             rel2.to: "elm.image4";
          }
       }
    }
 }
 
-group { name: "elm/popup/base/image_list";
+group { name: "elm/popup/base/content_expand";
+   images {
+      image: "00_popup_title_bg.png" COMP;
+      image: "00_popup_bottom_bg.png" COMP;
+      image: "00_popup_bg.png" COMP;
+   }
    parts {
-      images {
-         image: "00_popup_title_middle.png" COMP;
-         image: "00_popup_bottom.png" COMP;
-         image: "00_popup_bg.png" COMP;
-      }
-      part { name: "bg";
-         type: RECT;
-         scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_LIST_BG_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BASE_IMAGE_LIST_BG_DEFAULT_MIN_MAX_INC;
-            color: 255 0 0 0;
-            rel1.relative: 0.0 0.0;
-            rel2.relative: 1.0 1.0;
-            align: 0.0 0.0;
-         }
-      }
       part { name: "base";
-         type: RECT;
+         type: IMAGE;
          scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
          description { state: "default" 0.0;
-            fixed: 1 1;
-            color: 255 0 0 0;
-            rel1 {
-               relative: 0.23 0.4; to: "bg";
+            rel1.to_x: "elm.swallow.content";
+            rel2.to_x: "elm.swallow.content";
+            image {
+               normal: "00_popup_bg.png";
+               border: POPUP_BASE_DEFAULT_BG_DEFAULT_IMAGE_BORDER_INC;
+               border_scale: 1;
             }
-            rel2 {
-               relative: 0.77 0.94; to: "bg";}
             align: 0.0 0.0;
          }
       }
-      part { name: "elm.rect.title";
+      part { name: "elm.bg.title";
          type: IMAGE;
          scale : 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_LIST_TITLE_DEFAULT_MIN_INC;
+            min: 0 64;
             fixed : 0 1;
+            align: 0.5 0.0;
             visible: 0;
-            image.normal: "00_popup_title_middle.png";
-            image.border: POPUP_BASE_IMAGE_LIST_TITLE_DEFAULT_IMAGE_BORDER_INC;
+            image.normal: "00_popup_title_bg.png";
+            image.border: POPUP_BASE_DEFAULT_TITLE_DEFAULT_IMAGE_BORDER_INC;
             image.border_scale: 1;
-            rel1 {
-               relative: 0.0 0.0; to: "base";
-            }
+            rel1.to_x: "base";
             rel2 {
-               relative: 1.0 0.0; to: "base";
+               relative: 1.0 0.0;
+               to_x: "base";
             }
          }
-         description { state: "show_title" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
       }
-      part { name: "background";
-         scale : 1;
-         mouse_events: 0;
+      part { name: "left_pad";
+         type: RECT;
+         scale: 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_LIST_BACKGROUND_DEFAULT_MIN_INC;
+            min: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
+            max: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
             fixed: 1 1;
-            rel1.to: "elm.rect.title";
-            rel1.relative: 0.0 1.0;
-            rel2.to: "base";
-            rel2.relative: 1.0 1.0;
-            image {
-               normal: "00_popup_bottom.png";
-               border: POPUP_BASE_IMAGE_LIST_BACKGROUND_DEFAULT_IMAGE_BORDER_INC;
-               middle: DEFAULT;
-               border_scale: 1;
-            }
+            align: 0.0 0.0;
+            visible: 0;
+            rel1.to: "elm.bg.title";
+         }
+      }
+      part { name: "right_pad";
+         type: RECT;
+         scale: 1;
+         description { state: "default" 0.0;
+            min: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
+            max: POPUP_BASE_DEFAULT_PADDING_MIN_MAX_INC;
+            fixed: 1 1;
+            align: 1.0 1.0;
+            visible: 0;
+            rel2.to: "elm.bg.title";
          }
       }
       part { name: "elm.swallow.title.icon";
          type: SWALLOW;
          scale: 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_LIST_TITLE_ICON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BASE_IMAGE_LIST_TITLE_ICON_DEFAULT_MIN_MAX_INC;
+            min: POPUP_BASE_DEFAULT_TITLE_ICON_DEFAULT_MIN_MAX_INC;
+            max: POPUP_BASE_DEFAULT_TITLE_ICON_DEFAULT_MIN_MAX_INC;
             fixed: 1 1;
             align: 0.0 0.5;
             rel1 {
-               to: "elm.rect.title";
-               relative: 0.0 0.0;
+               to: "left_pad";
+               relative: 1.0 0.0;
             }
             rel2 {
-               to: "elm.rect.title";
-               relative: 1.0 1.0;
-            }   
+               to: "right_pad";
+               relative: 0.0 1.0;
+            }
             visible: 0;
          }
-         description { state: "show_title_icon" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
       }
-      part {
-         name: "elm.swallow.title";
+      part { name: "elm.text.title";
          type: TEXTBLOCK;
-         effect: SHADOW;
          scale:1;
-         description {
-            state: "default" 0.0;
-            text
-              {                 
-                 style: "popup_image_title_style";
-                 min: 0 0;
-                 max: 0 1;
-              }
+         description { state: "default" 0.0;
+            text {
+              style: "popup_title_style";
+              min: 0 0;
+              max: 0 1;
+              align: 0.5 0.0;
+            }
             color: POPUP_DEFAULT_TITLE_TEXT_COLOR_INC;
             visible:0;
-            color2: 0 0 0 255;
-            rel1 { relative: 0.0 0.0; to: "elm.rect.title"; }  
-            rel2 { relative: 1.0 1.0; to: "elm.rect.title"; }
-            align: 0.5 0.5;
-         }
-         description { state: "show_title" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+            rel1 {
+               relative: 1.0 0.0;
+               to: "left_pad";
+            }
+            rel2 {
+               relative: 0.0 1.0;
+               to: "right_pad";
+            }
          }
-         description { state: "show_title_icon" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
@@ -3023,289 +2548,253 @@ group { name: "elm/popup/base/image_list";
          type: SWALLOW;
          scale : 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_LIST_CONTENT_DEFAULT_MIN_INC;
-            align: 0.5 0.5;
-            fixed: 1 0;
-            rel1 {
-               relative: 0.05 0.05;
-               to: "background";
-            }
-            rel2 {
-               relative: 0.95 0.98;
-               to: "background";
-            }
+            min: POPUP_BASE_DEFAULT_CONTENT_DEFAULT_MIN_MAX_INC;
+            max: POPUP_BASE_DEFAULT_CONTENT_DEFAULT_MIN_MAX_INC;
+            rel1.relative: 0.5 0.0;
+            rel2.relative: 0.5 1.0;
          }
-         description { state: "show_title" 0.0;
+         description { state: "show_title_area" 0.0;
             inherit: "default" 0.0;
             rel1 {
-               relative: 0.05 1.05;
-               to: "elm.rect.title";
+               relative: 0.5 1.0;
+               to_y: "elm.bg.title";
             }
          }
-         description { state: "show_button_area" 0.0;
+         description { state: "show_action_area" 0.0;
             inherit: "default" 0.0;
+            rel2 {
+               relative: 0.5 0.0;
+               to_y: "elm.bg.action_area";
+            }
          }
-         description { state: "show_button_title_area" 0.0;
+         description { state: "show_action_title_area" 0.0;
             inherit: "default" 0.0;
             rel1 {
-               relative: 0.05 1.05;
-               to: "elm.rect.title";
+               relative: 0.5 1.0;
+               to_y: "elm.bg.title";
             }
             rel2 {
-               relative: 0.95 0.98;
-               to: "background";
+               relative: 0.5 0.0;
+               to_y: "elm.bg.action_area";
             }
          }
       }
-      part { name: "elm.swallow.buttonArea.Background";
-         type: RECT;
+      part { name: "elm.bg.action_area";
+         type: IMAGE;
          scale : 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_LIST_BUTTONAREA_BG_DEFAULT_MIN_INC;
-            fixed : 1 1;
-            align: 1.0 0.5;
-            visible: 1;
+            min: 0 96;
+            fixed : 0 1;
+            align: 0.5 1.0;
+            visible: 0;
+            image.normal: "00_popup_bottom_bg.png";
+            image.border: POPUP_BASE_DEFAULT_BUTTON_BG_IMAGE_BORDER_INC;
+            image.border_scale: 1;
             rel1 {
-               relative: 0.92 0.04;
-               to: "bg";
-            }
-            rel2 {
-               relative: 1.0  1.0);
-               to_x: "bg";
-               to_y: "base";
+               relative: 0.0 1.0;
+               to_x: "base";
             }
-            color: 0 0 0 0;
+            rel2.to_x: "base";
          }
-         description { state: "show_button_area" 0.0;
+         description { state: "visible" 0.0;
             inherit: "default" 0.0;
             visible: 1;
          }
       }
-      part { name: "elm.swallow.buttonArea";
+      part { name: "elm.swallow.action_area";
          type: SWALLOW;
          scale : 1;
          description { state: "default" 0.0;
-            min: POPUP_BASE_IMAGE_LIST_BUTTONAREA_DEFAULT_MIN_INC;
-            fixed : 1 1;
-            align: 0.5 0.5;
-            visible: 1;
-            rel1 {
-               relative: 0.0 0.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-            rel2 {
-               relative: 1.0 1.0;
-               to: "elm.swallow.buttonArea.Background";
-            }
-            color: 255 0 0 200;
-         }
-         description { state: "show_button_area" 0.0;
-            inherit: "default" 0.0;
-            visible: 1;
+            rel1.to: "elm.bg.action_area";
+            rel2.to: "elm.bg.action_area";
          }
       }
    }
    programs {
-      /*    program {
-       name: "show";
-       signal: "elm,state,show";
-       source: "elm";
-       action: STATE_SET "visible" 0.0;
-       target: "background";
-       transition: "DECELERATE" 0.5; 
-       }
-       program {
-       name: "hide";
-       signal: "elm,state,hide";
-       source: "elm";
-       action: STATE_SET "default" 0.0;
-       target: "background";
-       transition: "DECELERATE" 0.5; 
-      }*/
-      program { name: show_title;
-         signal: "elm,state,title,visible";
-         source: "elm";
-         action: STATE_SET "show_title" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-      program { name: hide_title;
-         signal: "elm,state,title,hidden";
-         source: "elm";
-         action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
-         target: "elm.rect.title";
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
       program { name: show_title_icon;
          signal: "elm,state,title,icon,visible";
          source: "elm";
-         action: STATE_SET "show_title_icon" 0.0;
-         target: "elm.swallow.title";
+         action: STATE_SET "visible" 0.0;
          target: "elm.swallow.title.icon";
       }
       program { name: hide_title_icon;
          signal: "elm,state,title,icon,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.title";
          target: "elm.swallow.title.icon";
       }
-      program { name: show_button_area;
-         signal: "elm,state,button,visible";
+      program { name: show_title_text;
+         signal: "elm,state,title,text,visible";
          source: "elm";
-         action: STATE_SET "show_button_area" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background"; 
-         target: "base";
+         action: STATE_SET "visible" 0.0;
+         target: "elm.text.title";
       }
-      program { name: hide_button_area;
-         signal: "elm,state,button,hidden";
+      program { name: hide_title_text;
+         signal: "elm,state,title,text,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.buttonArea";
-         target: "elm.swallow.content";
-         target: "elm.swallow.buttonArea.Background"; 
-         target: "base";
+         target: "elm.text.title";
       }
-      program { name: show_button_title_area;
-         signal: "elm,state,button,title,visible";
+      program { name: show_title_area;
+         signal: "elm,state,title_area,visible";
          source: "elm";
-         action: STATE_SET "show_button_title_area" 0.0;
-         target: "elm.swallow.content"; 
-         target: "base";
-      }
-      program { name: hide_button_title_area;
-         signal: "elm,state,button,title,hidden";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.action_area", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "show_title_area", 0.0);
+            set_state(PART:"elm.bg.title", "visible", 0.0);
+         }
+      }
+      program { name: hide_title_area;
+         signal: "elm,state,title_area,hidden";
+         source: "elm";
+         action: STATE_SET "default" 0.0;
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.swallow.action_area", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "default", 0.0);
+            set_state(PART:"elm.bg.title", "default", 0.0);
+         }
+      }
+      program { name: show_action_area;
+         signal: "elm,state,action_area,visible";
+         source: "elm";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.bg.title", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_action_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "show_action_area", 0.0);
+            set_state(PART:"elm.bg.action_area", "visible", 0.0);
+         }
+      }
+      program { name: hide_action_area;
+         signal: "elm,state,action_area,hidden";
          source: "elm";
          action: STATE_SET "default" 0.0;
-         target: "elm.swallow.content"; 
-         target: "base";
+         script {
+            new st[31];
+            new Float:vl;
+            get_state(PART:"elm.bg.title", st, 30, vl);
+            if (!strcmp(st, "visible"))
+              set_state(PART:"elm.swallow.content", "show_title_area", 0.0);
+            else
+              set_state(PART:"elm.swallow.content", "default", 0.0);
+            set_state(PART:"elm.bg.action_area", "default", 0.0);
+         }
       }
-   } /* end of programs */
+   }
 }
 
-group { name: "elm/popup/content/image_list";
+group { name: "elm/popup/buttons1/content_expand";
+   data.item: "action_area_height" POPUP_BUTTON_DEFAULT_ACTION_AREA_HEIGHT;
    parts{
-      part { name: "pad_t";
-         type: RECT;
+      part{ name:"actionbtn1";
+         type: SWALLOW;
          scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
-         description { state: "default" 0.0;
-            align: 0.5 0.0;
-            min: POPUP_CONTENT_IMAGE_LIST_PADDING_TOP_DEFAULT_MIN_INC;
-            fixed: 0 1;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 1.0 0.0;to_x: "pad_l";
-            }
-            rel2 {
-               relative: 0.0 0.0;to_x: "pad_r"; 
-            }
-         }
-      }
-      part { name: "pad_l";
-         type: RECT;
-         scale: 1;
          description { state: "default" 0.0;
-            min : POPUP_CONTENT_IMAGE_LIST_PADDING_LEFT_DEFAULT_MIN_INC;
-            fixed: 1 0;
-            rel1 { 
-               relative: 0.0 0.0; 
-            }
-            rel2 { 
-               relative: 0.0 1.0; 
-            }
-            color: 0 0 0 0;
-            align: 0.0 0.0;
+            rel1.relative: 0.2 0.1;
+            rel2.relative: 0.8 0.9;
          }
       }
-      part { name: "pad_r";     
-         type: RECT;
-         scale: 1;
-         description { state: "default" 0.0;
-            min : POPUP_CONTENT_IMAGE_LIST_PADDING_RIGHT_DEFAULT_MIN_INC;
-            fixed: 1 0;
-            rel1 { 
-               relative: 1.0 0.0; 
-            }
-            rel2 { 
-               relative: 1.0 1.0; 
-            }
-            color: 0 0 0 0;
-            align: 1.0 0.0;
-         }
-      } 
-      part{ name:"elm.swallow.content";
+   }
+}
+
+group { name: "elm/popup/buttons2/content_expand";
+   data.item: "action_area_height" POPUP_BUTTON_DEFAULT_ACTION_AREA_HEIGHT;
+   parts{
+      part{ name:"actionbtn1";
          type: SWALLOW;
          scale : 1;
          description { state: "default" 0.0;
-            min: POPUP_CONTENT_IMAGE_LIST_CONTENT_DEFAULT_MIN_INC;
-            align: 0.5 0.5;
-            fixed: 1 0;
-            rel1 {
-               relative: 0.5 1.0;
-               to: "pad_t";
-            }
-            rel2 {
-               relative: 0.5 0.0;
-               to: "pad_b";     
-            }
+            align: 0.0 0.5;
+            rel1.relative: 0.1 0.1;
+            rel2.relative: 0.45 0.9;
          }
       }
-      part { name: "pad_b";
-         type: RECT;
+      part{ name:"actionbtn2";
+         type: SWALLOW;
          scale : 1;
-         mouse_events: 0;
-         repeat_events: 1;
          description { state: "default" 0.0;
-            align: 0.5 1.0;
-            min: POPUP_CONTENT_IMAGE_LIST_PADDING_BOTTOM_DEFAULT_MIN_INC;
-            fixed: 0 1;
-            color: 0 0 0 0;
-            rel1 {
-               relative: 0.0 1.0;to_x: "pad_l";
-            }
-            rel2 {
-               relative: 1.0 1.0;to_x: "pad_r"; 
-            }
+            align: 0.0 0.5;
+            rel1.relative: 0.55 0.1;
+            rel2.relative: 0.9 0.9;
          }
       }
    }
 }
-group { name: "elm/popup/buttons2/image_list";
+
+group { name: "elm/popup/buttons3/content_expand";
+   data.item: "action_area_height" POPUP_BUTTON_DEFAULT_ACTION_AREA_HEIGHT;
    parts{
       part{ name:"actionbtn1";
          type: SWALLOW;
          scale : 1;
          description { state: "default" 0.0;
-            min: POPUP_BUTTONS2_IMAGE_LIST_BUTTON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BUTTONS2_IMAGE_LIST_BUTTON_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 0.0 0.0;
-            rel1 {
-               relative: 0.0 0.0;
-            }
+            align: 0.0 0.5;
+            rel1.relative: 0.05 0.1;
+            rel2.relative: 0.3 0.9;
          }
       }
       part{ name:"actionbtn2";
          type: SWALLOW;
          scale : 1;
          description { state: "default" 0.0;
-            min: POPUP_BUTTONS2_IMAGE_LIST_BUTTON_DEFAULT_MIN_MAX_INC;
-            max: POPUP_BUTTONS2_IMAGE_LIST_BUTTON_DEFAULT_MIN_MAX_INC;
-            fixed : 1 1;
-            align: 0.0 1.0;
-            rel2 {
-               relative: 1.0 1.0;
-            }
+            align: 0.0 0.5;
+            rel1.relative: 0.375 0.1;
+            rel2.relative: 0.625 0.9;
+         }
+      }
+      part{ name:"actionbtn3";
+         type: SWALLOW;
+         scale : 1;
+         description { state: "default" 0.0;
+            align: 0.0 0.5;
+            rel1.relative: 0.7 0.1;
+            rel2.relative: 0.95 0.9;
+         }
+      }
+   }
+}
+
+group { name: "elm/popup/item/content_expand";
+   inherit: "elm/popup/item/default";
+   parts {
+      part { name: "bg";
+         mouse_events: 0;
+         type: RECT;
+         description { state: "default" 0.0;
+            color: 240 240 240 255;
+            min: 620 71;
+            align: 0.5 0.0;
+         }
+         description { state: "clicked" 0.0;
+            color: 190 170 150 255;
+         }
+      }
+   }
+}
+
+group { name: "elm/popup/content/content_expand";
+   parts{
+      part{ name:"elm.swallow.content";
+         type: SWALLOW;
+         scale : 1;
+         description { state: "default" 0.0;
          }
       }
    }
 }
 
+#undef POPUP_ITEM_STATE_ENABLED
+#undef POPUP_ITEM_STATE_DISABLED