[tab]changed icon+text style GUI

diff --git a/themes/images/HD/dark/Naviframe/00_effect_tab_bounce_left.png b/themes/images/HD/dark/Naviframe/00_effect_tab_bounce_left.png
index c1e3afb..2cbd953 100644 (file)
Binary files a/themes/images/HD/dark/Naviframe/00_effect_tab_bounce_left.png and b/themes/images/HD/dark/Naviframe/00_effect_tab_bounce_left.png differ

diff --git a/themes/images/HD/dark/Naviframe/00_effect_tab_bounce_right.png b/themes/images/HD/dark/Naviframe/00_effect_tab_bounce_right.png
index 691ec73..3a24521 100644 (file)
Binary files a/themes/images/HD/dark/Naviframe/00_effect_tab_bounce_right.png and b/themes/images/HD/dark/Naviframe/00_effect_tab_bounce_right.png differ

diff --git a/themes/images/HD/dark/Naviframe/00_sub_title_bg.png b/themes/images/HD/dark/Naviframe/00_sub_title_bg.png
new file mode 100644 (file)
index 0000000..37fe6f7
Binary files /dev/null and b/themes/images/HD/dark/Naviframe/00_sub_title_bg.png differ

diff --git a/themes/images/HD/dark/Naviframe/00_tab_focus.png b/themes/images/HD/dark/Naviframe/00_tab_focus.png
new file mode 100644 (file)
index 0000000..d14a8e0
Binary files /dev/null and b/themes/images/HD/dark/Naviframe/00_tab_focus.png differ

diff --git a/themes/images/HD/dark/Naviframe/00_title_bg.png b/themes/images/HD/dark/Naviframe/00_title_bg.png
index eef8f3a..51fc782 100644 (file)
Binary files a/themes/images/HD/dark/Naviframe/00_title_bg.png and b/themes/images/HD/dark/Naviframe/00_title_bg.png differ

diff --git a/themes/images/HD/light/Naviframe/00_sub_title_bg.png b/themes/images/HD/light/Naviframe/00_sub_title_bg.png
new file mode 100644 (file)
index 0000000..37fe6f7
Binary files /dev/null and b/themes/images/HD/light/Naviframe/00_sub_title_bg.png differ

diff --git a/themes/images/HD/light/Naviframe/00_tab_focus.png b/themes/images/HD/light/Naviframe/00_tab_focus.png
new file mode 100644 (file)
index 0000000..d14a8e0
Binary files /dev/null and b/themes/images/HD/light/Naviframe/00_tab_focus.png differ

diff --git a/themes/inc/tizen-dark-inc.edc b/themes/inc/tizen-dark-inc.edc
index 542747b..09d4f35 100755 (executable)
--- a/themes/inc/tizen-dark-inc.edc
+++ b/themes/inc/tizen-dark-inc.edc
@@ -49,7 +49,7 @@
 #define NAVIFRAME_LANDSCAPE_TITLE_FUNC_BTN_SIZE_INC 85 91
 #define NAVIFRAME_PREV_FUNC_BTN_SIZE_INC 85 98
 #define NAVIFRAME_LANDSCAPE_PREV_FUNC_BTN_SIZE_INC 85 85
-#define NAVIFRAME_TITLE_TAB_H_INC 63
+#define NAVIFRAME_TITLE_TAB_H_INC 75
 #define NAVIFRAME_TITLE_TAB_FONT_SIZE_INC 44
 #define NAVIFRAME_LANDSCAPE_TITLE_TAB_FONT_SIZE_INC 38
 #define NAVIFRAME_TITLE_TAB_TEXT_H_INC 60
@@ -1189,20 +1189,19 @@
 #define TOOLBAR_ITEM_SEPARATOR_RIGHT_COLOR_INC 25 25 25 255
 #define TOOLBAR_ITEM_BG_REL1_OFFSET_INC 4 4
 #define TOOLBAR_ITEM_BG_REL2_OFFSET_INC -5 -5
-#define TOOLBAR_ITEM_BG_SELECTED_BORDER_INC 3 3 3 3
-#define TABBAR_ITEM_TEXTBLOCK_COLOR_INC "#999999"
-#define TABBAR_ITEM_SELECTED_TEXTBLOCK_COLOR_INC "#3b73b6"
+#define TOOLBAR_ITEM_BG_SELECTED_BORDER_INC 1 1 1 1
+#define TABBAR_ITEM_TEXTBLOCK_COLOR_INC "#f0f0f0"
+#define TABBAR_ITEM_SELECTED_TEXTBLOCK_COLOR_INC "#f0f0f0"
 #define TABBAR_ITEM_BG_DEFAULT_BORDER_INC 9 9 9 9
 #define TABBAR_ITEM_BG_DEFAULT_VISIBLE_INC 0
 #define TABBAR_ITEM_BG_DEFAULT_COLOR_INC 255 255 255 0
-#define TABBAR_DEFAULT_HEIGHT_INC 111
-#define TABBAR_ICON_TEXT_HEIGHT_INC 111
-#define TABBAR_HORIZONTAL_HEIGHT_INC 91
-#define TABBAR_HORIZONTAL_ICON_TEXT_HEIGHT_INC 91
-#define TABBAR_ITEM_ICON_SIZE_INC 68 68
-#define TABBAR_ITEM_SMALL_ICON_SIZE_INC 44 44
-#define TABBAR_ITEM_DIVIDER_LEFT_COLOR_INC 211 209 203 255
-#define TABBAR_ITEM_DIVIDER_RIGHT_COLOR_INC 255 255 255 255
+#define TABBAR_DEFAULT_HEIGHT_INC 126
+#define TABBAR_ICON_TEXT_HEIGHT_INC 126
+#define TABBAR_HORIZONTAL_HEIGHT_INC 75
+#define TABBAR_HORIZONTAL_ICON_TEXT_HEIGHT_INC 75
+#define TABBAR_ITEM_ICON_SIZE_INC 63 63
+#define TABBAR_ITEM_DIVIDER_LEFT_COLOR_INC 255 255 255 82
+#define TABBAR_ITEM_DIVIDER_RIGHT_COLOR_INC 255 255 255 82
 
 #define CONFORMANT_INDICATOR_BG_DEFAULT_COLOR_INC 52 52 50 255
 #define CONFORMANT_INDICATOR_BG_TRANSLUCENT_COLOR_INC 0 0 0 125

diff --git a/themes/widgets/toolbar.edc b/themes/widgets/toolbar.edc
index 74b6ca6..f1c04d1 100644 (file)
--- a/themes/widgets/toolbar.edc
+++ b/themes/widgets/toolbar.edc
@@ -22,7 +22,7 @@
 
 #define TOOLBAR_TEXT_STYLE(_font_size) \
    style { name: "toolbar_text_style_"_font_size; \
-      base: "font=Tizen:style=Medium style=far_shadow,bottom shadow_color=#ffffffff font_size="_font_size" align=center color="TABBAR_ITEM_TEXTBLOCK_COLOR_INC" wrap=word ellipsis=1 text_class=tizen linegap=-10"; \
+      base: "font=Tizen:style=Bold style=far_shadow,bottom shadow_color=#000000ff font_size="_font_size" align=center color="TABBAR_ITEM_TEXTBLOCK_COLOR_INC" wrap=word ellipsis=1 text_class=tizen linegap=0"; \
       tag: "br" "\n"; \
       tag: "ps" "ps"; \
       tag: "hilight" "+ font=Tizen:style=Bold"; \
@@ -32,7 +32,7 @@
 
 #define TOOLBAR_SELECTED_TEXT_STYLE(_font_size) \
    style { name: "toolbar_selected_text_style_"_font_size; \
-      base: "font=Tizen:style=Medium style=far_shadow,bottom shadow_color=#ffffffff font_size="_font_size" align=center color="TABBAR_ITEM_SELECTED_TEXTBLOCK_COLOR_INC" wrap=word ellipsis=1 text_class=tizen linegap=-10"; \
+      base: "font=Tizen:style=Bold style=far_shadow,bottom shadow_color=#000000ff font_size="_font_size" align=center color="TABBAR_ITEM_SELECTED_TEXTBLOCK_COLOR_INC" wrap=word ellipsis=1 text_class=tizen linegap=0"; \
       tag: "br" "\n"; \
       tag: "ps" "ps"; \
       tag: "hilight" "+ font=Tizen:style=Bold"; \
@@ -50,12 +50,32 @@ styles{
 }
 
 group { name: "elm/toolbar/base/default";
+   images {
+       image: "00_title_bg.png" COMP;
+   }
    parts {
       part { name: "base";
          type: RECT;
          mouse_events: 1;
          description { state: "default" 0.0;
-            color: 248 246 239 255;
+         }
+      }
+      part { name: "base_bg";
+         type: IMAGE;
+         scale: 1;
+         description {
+            state: "default" 0.0;
+            rel1 {
+                relative: 0.0 0.0;
+                to: "base";
+            }
+            rel2 {
+                relative: 1.0 1.0;
+                to: "base";
+            }
+            image {
+                normal: "00_title_bg.png";
+            }
          }
       }
       part { name: "clipper";
@@ -996,8 +1016,8 @@ group { name: "elm/toolbar/separator/default";
          type: RECT;
          scale: 1;
          description { state: "default" 0.0;
-            min: 4 26;
-            max: 4 9999;
+            min: 2 88;
+            max: 2 88;
             fixed: 1 1;
             rel1 {
                 relative: 0.5 0.5;
@@ -1055,6 +1075,7 @@ group { name: "elm/toolbar/base/tabbar";
    images {
       image: "00_effect_tab_bounce_left.png" COMP;
       image: "00_effect_tab_bounce_right.png" COMP;
+      image: "00_title_bg.png" COMP;
    }
    script {
       public left_timer, right_timer;
@@ -1074,7 +1095,24 @@ group { name: "elm/toolbar/base/tabbar";
          type: RECT;
          scale: 1;
          description { state: "default" 0.0;
-            color: 248 246 239 255;
+         }
+      }
+      part { name: "base_bg";
+         type: IMAGE;
+         scale: 1;
+         description {
+            state: "default" 0.0;
+            rel1 {
+                relative: 0.0 0.0;
+                to: "base";
+            }
+            rel2 {
+                relative: 1.0 1.0;
+                to: "base";
+            }
+            image {
+                normal: "00_title_bg.png";
+            }
          }
       }
       part { name: "left_padding";
@@ -1083,7 +1121,7 @@ group { name: "elm/toolbar/base/tabbar";
          scale: 1;
          description {
             state: "default" 0.0;
-            min: 16 0;
+            min: 0 0;
             fixed: 1 1;
             visible: 0;
             align: 0.0 0.5;
@@ -1099,7 +1137,7 @@ group { name: "elm/toolbar/base/tabbar";
          scale: 1;
          description {
             state: "default" 0.0;
-            min: 16 0;
+            min: 0 0;
             fixed: 1 1;
             visible: 0;
             align: 1.0 0.5;
@@ -1255,6 +1293,7 @@ group { name: "elm/toolbar/item/tabbar";
       image: "00_tab_press.png" COMP;
       image: "00_badge_bg.png" COMP;
       image: "00_focus.png" COMP;
+      image: "00_tab_focus.png" COMP;
    }
 
    data.item: "transition_animation_on" "1";
@@ -1270,12 +1309,12 @@ group { name: "elm/toolbar/item/tabbar";
          scale: 1;
          mouse_events: 0;
          description { state: "default" 0.0;
-            min: 172 0;
+            min: 180 0;
             visible: 0;
          }
          description { state: "icon_text" 0.0;
             inherit: "default" 0.0;
-            min: 229 0;
+            min: 180 0;
          }
       }
       part { name: "bg_cover";
@@ -1302,7 +1341,7 @@ group { name: "elm/toolbar/item/tabbar";
          description { state: "default" 0.0;
             align: 0.0 0.0;
             rel2.relative: 0.0 0.0;
-            min: 6 0;
+            min: 0 0;
             fixed: 1 1;
             visible: 0;
             color: 0 0 0 0;
@@ -1315,7 +1354,7 @@ group { name: "elm/toolbar/item/tabbar";
          description { state: "default" 0.0;
             align: 1.0 1.0;
             rel1.relative: 1.0 1.0;
-            min: 6 0;
+            min: 0 0;
             fixed: 1 1;
             visible: 0;
             color: 0 0 0 0;
@@ -1328,22 +1367,22 @@ group { name: "elm/toolbar/item/tabbar";
          mouse_events: 0;
          description { state: "default" 0.0;
             min: 0 0;
-            fixed: 1 0;
+            fixed: 0 1;
             rel1 {
                relative: 1.0 1.0;
                to: "padding_left_top";
             }
             rel2 {
-               relative: 1.0 0.0;
-               to_x: "padding_left_top";
-               to_y: "padding_right_bottom";
+               relative: 0.0 1.0;
+               to_x: "padding_right_bottom";
+               to_y: "padding_left_top";
             }
-            align: 0.0 0.5;
+            align: 0.5 0.0;
             color: 0 0 0 0;
          }
          description { state: "visible" 0.0;
             inherit: "default" 0.0;
-            min: TABBAR_ITEM_SMALL_ICON_SIZE_INC;
+            min: TABBAR_ITEM_ICON_SIZE_INC;
          }
          description { state: "icononly" 0.0;
             inherit: "default" 0.0;
@@ -1354,19 +1393,19 @@ group { name: "elm/toolbar/item/tabbar";
          scale: 1;
          mouse_events: 0;
          description { state: "default" 0.0; //when only icon or no icon is there
-            align: 0.0 0.0;
+            align: 0.5 0.0;
             rel1 {
-               relative: 1.0 0.0;
+               relative: 0.0 1.0;
                to: "icon_rect";
             }
             rel2.to: "icon_rect";
-            fixed: 1 0;
+            fixed: 0 1;
             min: 0 0;
             color: 0 0 0 0;
          }
          description { state: "visible" 0.0;
             inherit: "default" 0.0;
-            min: 1 0;
+            min: 0 1;
          }
          description { state: "icononly" 0.0;
             inherit: "default" 0.0;
@@ -1377,22 +1416,48 @@ group { name: "elm/toolbar/item/tabbar";
          scale: 1;
          mouse_events: 0;
          description { state: "default" 0.0; //when only icon or no icon is there
-            align: 1.0 0.5;
+            align: 0.5 1.0;
             rel1 {
-               relative: 0.0 1.0;
-               to_x: "elm.text";
-               to_y: "padding_left_top";
+               relative: 1.0 0.0;
+               to_x: "padding_left_top";
+               to_y: "elm.text";
             }
             rel2 {
                relative: 0.0 0.0;
-               to_x: "elm.text";
-               to_y: "padding_right_bottom";
+               to_x: "padding_right_bottom";
+               to_y: "elm.text";
             }
-            fixed: 1 0;
-            min: 8 0;
+            fixed: 0 1;
+            min: 0 0;
             color: 0 0 0 0;
          }
       }
+      part { name: "elm.swallow.icon.proxy";
+         type: PROXY;
+         scale: 1;
+         clip_to: "elm.icon.proxy.clipper";
+         description { state: "default" 0.0;
+             source: "elm.swallow.icon";
+             proxy.source_clip: 0;
+             rel1.to: "elm.swallow.icon";
+             rel1.offset: 0 3;
+             rel2.to: "elm.swallow.icon";
+             rel2.offset: -1 2;
+         }
+      }
+      part { name: "elm.swallow.icon_new.proxy";
+         type: PROXY;
+         scale: 1;
+         clip_to: "elm.icon_new.proxy.clipper";
+         description { state: "default" 0.0;
+             source: "elm.swallow.icon_new";
+             proxy.source_clip: 0;
+             rel1.to: "elm.swallow.icon_new";
+             rel1.offset: 0 3;
+             rel2.to: "elm.swallow.icon_new";
+             rel2.offset: -1 2;
+         }
+      }
       part { name: "elm.swallow.icon";
          type: SWALLOW;
          scale: 1;
@@ -1401,25 +1466,29 @@ group { name: "elm/toolbar/item/tabbar";
             visible: 0;
             min: TABBAR_ITEM_ICON_SIZE_INC;
             max: TABBAR_ITEM_ICON_SIZE_INC;
-            rel1.to: "padding_left_top";
-            rel2.to: "padding_right_bottom";
+            rel1 {
+                to: "padding_left_top";
+            }
+            rel2 {
+                to: "padding_right_bottom";
+            }
             aspect: 1.0 1.0;
             aspect_preference: HORIZONTAL;
          }
          description { state: "visible" 0.0;
             fixed: 1 0;
-            min: TABBAR_ITEM_SMALL_ICON_SIZE_INC;
-            max: TABBAR_ITEM_SMALL_ICON_SIZE_INC;
-            align: 1.0 0.5;
+            min: TABBAR_ITEM_ICON_SIZE_INC;
+            max: TABBAR_ITEM_ICON_SIZE_INC;
+            align: 0.5 1.0;
             rel1 {
-               relative: 0.0 1.0;
-               to_x: "padding_before_text";
-               to_y: "padding_left_top";
+               relative: 1.0 0.0;
+               to_x: "padding_left_top";
+               to_y: "padding_before_text";
             }
             rel2 {
                relative: 0.0 0.0;
-               to_x: "padding_before_text";
-               to_y: "padding_right_bottom";
+               to_x: "padding_right_bottom";
+               to_y: "padding_before_text";
             }
             aspect: 1.0 1.0;
             aspect_preference: HORIZONTAL;
@@ -1443,18 +1512,18 @@ group { name: "elm/toolbar/item/tabbar";
             aspect_preference: HORIZONTAL;
          }
          description { state: "visible" 0.0;
-            fixed: 0 1;
-            min: TABBAR_ITEM_SMALL_ICON_SIZE_INC;
-            max: TABBAR_ITEM_SMALL_ICON_SIZE_INC;
+            fixed: 1 0;
+            min: TABBAR_ITEM_ICON_SIZE_INC;
+            max: TABBAR_ITEM_ICON_SIZE_INC;
             rel1 {
                relative: 0.0 1.0;
-               to_x: "padding_before_text";
-               to_y: "padding_left_top";
+               to_x: "padding_left_top";
+               to_y: "padding_before_text";
             }
             rel2 {
                relative: 0.0 0.0;
-               to_x: "padding_before_text";
-               to_y: "padding_right_bottom";
+               to_x: "padding_right_bottom";
+               to_y: "padding_before_text";
             }
             aspect: 1.0 1.0;
             aspect_preference: HORIZONTAL;
@@ -1464,32 +1533,6 @@ group { name: "elm/toolbar/item/tabbar";
             visible: 1;
          }
       }
-      part { name: "elm.swallow.icon_new.proxy";
-         type: PROXY;
-         scale: 1;
-         clip_to: "elm.icon_new.proxy.clipper";
-         description { state: "default" 0.0;
-             source: "elm.swallow.icon_new";
-             proxy.source_clip: 0;
-             rel1.to: "elm.swallow.icon_new";
-             rel1.offset: 0 -3;
-             rel2.to: "elm.swallow.icon_new";
-             rel2.offset: -1 -4;
-         }
-      }
-      part { name: "elm.swallow.icon.proxy";
-         type: PROXY;
-         scale: 1;
-         clip_to: "elm.icon.proxy.clipper";
-         description { state: "default" 0.0;
-             source: "elm.swallow.icon";
-             proxy.source_clip: 0;
-             rel1.to: "elm.swallow.icon";
-             rel1.offset: 0 -3;
-             rel2.to: "elm.swallow.icon";
-             rel2.offset: -1 -4;
-         }
-      }
       part { name: "elm.text";
          type: TEXTBLOCK;
          mouse_events: 0;
@@ -1499,18 +1542,18 @@ group { name: "elm/toolbar/item/tabbar";
             visible: 0;
             rel1 {
                relative: 1.0 1.0;
-               to_x: "padding_after_icon";
-               to_y: "padding_left_top";
+               to_x: "padding_left_top";
+               to_y: "padding_after_icon";
             }
             rel2 {
                relative: 0.0 0.0;
                to: "padding_right_bottom";
             }
             fixed: 1 1;
-            max: 0 78;
+            max: 0 34;
             text {
                style: "toolbar_text_style_30";
-               min: 0 0;
+               min: 0 1;
                max: 1 0;
             }
          }
@@ -1520,17 +1563,17 @@ group { name: "elm/toolbar/item/tabbar";
          }
          description { state: "visible" 0.24;
             inherit: "visible" 0.0;
-            max: 0 62;
+            max: 0 34;
             text.style: "toolbar_text_style_24";
          }
          description { state: "visible" 0.28;
             inherit: "visible" 0.0;
-            max: 0 72;
+            max: 0 34;
             text.style: "toolbar_text_style_28";
          }
          description { state: "visible" 0.30;
             inherit: "visible" 0.0;
-            max: 0 78;
+            max: 0 34;
             text.style: "toolbar_text_style_30";
          }
          description { state: "selected" 0.0;
@@ -1559,20 +1602,19 @@ group { name: "elm/toolbar/item/tabbar";
             visible: 0;
             rel1 {
                relative: 1.0 1.0;
-               to_x: "padding_after_icon";
-               to_y: "padding_left_top";
+               to_x: "padding_left_top";
+               to_y: "padding_after_icon";
             }
             rel2 {
                relative: 0.0 0.0;
                to: "padding_right_bottom";
             }
-            min: 0 36;
-            max: 9999 36;
+            max: 0 34;
             fixed: 1 1;
             text {
                style: "toolbar_text_style_30";
-               min: 0 0;
-               max: 0 1;
+               min: 0 1;
+               max: 1 0;
             }
          }
          description { state: "visible" 0.0;
@@ -1581,17 +1623,17 @@ group { name: "elm/toolbar/item/tabbar";
          }
          description { state: "visible" 0.24;
             inherit: "visible" 0.0;
-            max: 0 62;
+            max: 0 34;
             text.style: "toolbar_text_style_24";
          }
          description { state: "visible" 0.28;
             inherit: "visible" 0.0;
-            max: 0 72;
+            max: 0 34;
             text.style: "toolbar_text_style_28";
          }
          description { state: "visible" 0.30;
             inherit: "visible" 0.0;
-            max: 0 78;
+            max: 0 34;
             text.style: "toolbar_text_style_30";
          }
          description { state: "selected" 0.0;
@@ -1611,40 +1653,24 @@ group { name: "elm/toolbar/item/tabbar";
             text.style: "toolbar_selected_text_style_30";
          }
       }
-      part { name: "padding.selected_line";
-         type: RECT;
-         scale: 1;
-         mouse_events: 0;
-         description { state: "default" 0.0;
-            rel1 {
-                relative: 0.0 0.5;
-                offset: 16 0;
-            }
-            rel2 {
-                relative: 1.0 0.5;
-                offset: -17 -1;
-            }
-            min: 0 64;
-            fixed: 0 1;
-            visible: 0;
-         }
-      }
       part { name: "selected_line";
-         type: RECT;
+         type: IMAGE;
          scale: 1;
          mouse_events: 0;
          description { state: "default" 0.0;
             rel1 {
-                to: "padding.selected_line";
                 relative: 0.0 1.0;
             }
             rel2 {
-                to: "padding.selected_line";
                 relative: 1.0 1.0;
             }
-            align: 0.5 0.0;
-            color: 59 115 182 255;
-            min: 0 5;
+            image {
+                normal: "00_tab_focus.png";
+                border: 1 1 1 1;
+                border_scale: 1;
+            }
+            align: 0.0 1.0;
+            min: 0 10;
             fixed: 0 1;
             visible: 0;
          }
@@ -1800,80 +1826,78 @@ group { name: "elm/toolbar/item/tabbar";
             color: 255 255 255 153;
          }
       }
-      part { name: "elm.icon.clipper";
+      part { name: "elm.icon.proxy.clipper";
          type: RECT;
          description { state: "default" 0.0;
-            color: 255 255 255  255;
+            color: 0 0 0 255;
          }
          description { state: "animation" 0.0;
-            color: 255 255 255 0;
+            color: 0 0 0 255;
          }
          description { state: "selected" 0.0;
-            color: 255 255 255 255;
+            color: 0 0 0 255;
          }
          description { state: "disabled" 0.0;
-            color: 255 255 255 153;
+            color: 0 0 0 255;
          }
       }
-      part { name: "elm.icon_new.clipper";
+      part { name: "elm.icon_new.proxy.clipper";
          type: RECT;
          description { state: "default" 0.0;
-            color: 255 255 255 0;
+            color: 0 0 0 255;
          }
          description { state: "animation" 0.0;
-            color: 255 255 255 255;
+            color: 0 0 0 255;
          }
          description { state: "selected" 0.0;
-            color: 255 255 255 255;
+            color: 0 0 0 255;
          }
          description { state: "disabled" 0.0;
-            color: 255 255 255 153;
+            color: 0 0 0 255;
          }
       }
-      part { name: "elm.icon.proxy.clipper";
+      part { name: "elm.icon.clipper";
          type: RECT;
          description { state: "default" 0.0;
-            color: 153 153 153 255;
+            color: 255 255 255 255;
          }
          description { state: "animation" 0.0;
-            color: 255 255 255 0;
+            color: 255 255 255 255;
          }
          description { state: "selected" 0.0;
-            color: 61 114 180 255;
+            color: 255 255 255 255;
          }
          description { state: "disabled" 0.0;
-            color: 255 255 255 153;
+            color: 255 255 255 255;
          }
       }
-      part { name: "elm.icon_new.proxy.clipper";
+      part { name: "elm.icon_new.clipper";
          type: RECT;
          description { state: "default" 0.0;
-            color: 255 255 255 0;
+            color: 255 255 255 255;
          }
          description { state: "animation" 0.0;
             color: 255 255 255 255;
          }
          description { state: "selected" 0.0;
-            color: 61 114 180 255;
+            color: 255 255 255 255;
          }
          description { state: "disabled" 0.0;
-            color: 255 255 255 153;
+            color: 255 255 255 255;
          }
       }
       part { name: "divider";
          type: RECT;
          scale: 1;
          description { state: "default" 0.0;
-            min: 4 26;
-            max: 4 9999;
+            min: 2 88;
+            max: 2 88;
             fixed: 1 1;
             rel1 {
                 relative: 1.0 0.5;
-                to_y: "elm.swallow.icon";
             }
             rel2 {
                 relative: 1.0 0.5;
-                to_y: "elm.swallow.icon";
             }
          }
          description { state: "hidden" 0.0;
@@ -2394,34 +2418,112 @@ group { name: "elm/toolbar/item/tabbar";
    }
 }
 
-group { name: "elm/toolbar/base/tabbar/item_horizontal";
+group { name: "elm/toolbar/base/tabbar/item_with_title";
    inherit: "elm/toolbar/base/tabbar";
+   images {
+      image: "00_sub_title_bg.png" COMP;
+   }
    parts {
-      part { name: "left_padding";
+       part { name: "base_bg";
+         type: IMAGE;
+         scale: 1;
          description {
             state: "default" 0.0;
-            min: 34 0;
+            rel1 {
+                relative: 0.0 0.0;
+                to: "base";
+            }
+            rel2 {
+                relative: 1.0 1.0;
+                to: "base";
+            }
+            image {
+                normal: "00_sub_title_bg.png";
+                border: 8 8 35 35;
+                border_scale: 1;
+            }
          }
       }
-      part { name: "right_padding";
-         description {
-            state: "default" 0.0;
-            min: 34 0;
+   }
+}
+
+group { name: "elm/toolbar/item/tabbar/item_with_title";
+   inherit: "elm/toolbar/item/tabbar";
+   parts {
+      part { name: "divider";
+         type: RECT;
+         scale: 1;
+         description { state: "default" 0.0;
+            min: 2 48;
+            max: 2 48;
+            fixed: 1 1;
+            rel1 {
+                relative: 1.0 0.5;
+            }
+            rel2 {
+                relative: 1.0 0.5;
+            }
+         }
+         description { state: "hidden" 0.0;
+            inherit: "default" 0.0;
+            visible: 0;
+         }
+      }
+      part { name: "divider_left";
+         type: RECT;
+         clip_to: "divider";
+         description { state: "default" 0.0;
+            color: TABBAR_ITEM_DIVIDER_LEFT_COLOR_INC;
+            rel1 {
+                relative: 0.0 0.0;
+                to: "divider";
+            }
+            rel2 {
+                relative: 0.5 1.0;
+                to: "divider";
+            }
+         }
+      }
+      part { name: "divider_right";
+         type: RECT;
+         clip_to: "divider";
+         description { state: "default" 0.0;
+            color: TABBAR_ITEM_DIVIDER_RIGHT_COLOR_INC;
+            rel1 {
+                relative: 0.5 0.0;
+                to: "divider";
+            }
+            rel2 {
+                relative: 1.0 1.0;
+                to: "divider";
+            }
          }
       }
    }
 }
 
+group { name: "elm/toolbar/base/tabbar/item_horizontal";
+   alias: "elm/toolbar/base/tabbar";
+}
+
 group { name: "elm/toolbar/item/tabbar/item_horizontal";
    inherit: "elm/toolbar/item/tabbar";
    parts {
       part { name: "bg";
          description { state: "default" 0.0;
-            min: 303 0;
+            min: 320 0;
          }
          description { state: "icon_text" 0.0;
-            min: 404 0;
+            inherit: "default" 0.0;
+            min: 320 0;
          }
       }
    }
+   program { name: "icon_text,horizontal";
+         signal: "elm,state,horizontal_icon_text,tabbar";
+         source: "elm";
+         script {
+            set_state(PART:"bg", "icon_text", 0.0);
+         }
+      }
 }