Toolbar: Change the divider style of footer buttons

Creates button divider using CSS style. It replaces image file.

Change-Id: Idd88440b67ad5e50abf1a751b6299be17ec95a20

diff --git a/src/js/widgets/jquery.mobile.tizen.pagelayout.js b/src/js/widgets/jquery.mobile.tizen.pagelayout.js
index 3a6db9d..f707080 100644 (file)
--- a/src/js/widgets/jquery.mobile.tizen.pagelayout.js
+++ b/src/js/widgets/jquery.mobile.tizen.pagelayout.js
@@ -469,10 +469,10 @@ define( [ '../jquery.mobile.tizen.core' ], function ( ) {
 
                        for ( idx = 0; idx < btnLength; idx++ ) {
                                if ( footerBtn.eq( idx ).hasClass( "ui-btn-back" ) ) {
-                                       return true;
+                                       continue;
                                }
                                if ( footerBtn.eq( idx ).is( ":jqmData(icon='naviframe-more')" ) ){
-                                       return true;
+                                       continue;
                                }
                                footerBtn.eq( idx )
                                        .addClass( "ui-footer-btn-border" )
@@ -481,6 +481,7 @@ define( [ '../jquery.mobile.tizen.core' ], function ( ) {
                                        .css( "left", realBtnIndex * btnWidth + moreWidth );
                                realBtnIndex++;
                        }
+                       $elFooter.find( ".ui-footer-btn-border" ).eq( 0 ).removeClass( "ui-footer-btn-border" );
                },
 
                _setHWKeyLayout : function ( thisPage ) {

diff --git a/src/themes/tizen/common/jquery.mobile.theme.less b/src/themes/tizen/common/jquery.mobile.theme.less
index b1970c5..799086c 100644 (file)
--- a/src/themes/tizen/common/jquery.mobile.theme.less
+++ b/src/themes/tizen/common/jquery.mobile.theme.less
@@ -310,7 +310,13 @@
                font-size : 20 * @unit_base;
                font-weight : bold;
                color : @color_bar_toolbar_button_text;
+               background-image : none;
                border-width : 0px;
+
+               >.ui-btn-inner {
+                       padding-top : 0px;
+                       padding-bottom : 0px;
+               }
        }
 
        [data-role="controlgroup"] {
@@ -372,7 +378,8 @@
                }
        
        > [data-role="button"]:not([data-icon="naviframe-more"]) {
-               top : 0 * @unit_base;
+               top : 0px;
+               padding : 12 * @unit_base 0px;
        }
 
        > p {
@@ -392,12 +399,6 @@
                }
        }
 
-       >.ui-btn.ui-btn-up-s.ui-btn-box-s,
-       >.ui-btn.ui-btn-hover-s.ui-btn-box-s {
-               &:not([data-icon="naviframe-more"]) {
-                       background-color : @color_bar_toolbar_bg !important;
-               }
-       }
        >.ui-btn.ui-btn-down-s.ui-btn-box-s  {
                &:not([data-icon="naviframe-more"]) {
                        background-color : @color_bar_navbar_press !important;
@@ -405,8 +406,9 @@
        }
 
        >.ui-footer-btn-border {
-               background: url(images/00_toolbar_border.png) no-repeat !important;
-               background-size: contain;
+               >.ui-btn-inner {
+                       border-left : 2px solid @color_bar_toolbar_divider;
+               }
        }
 }
 
@@ -762,7 +764,7 @@ a.ui-link-inherit {
 
        > [data-role="button"]:not([data-icon="naviframe-more"]) {
                position : absolute;
-               top : 3 * @unit_base;
+               top : 0px;
        }
 }
 

diff --git a/src/themes/tizen/tizen-black/images/00_toolbar_border.png b/src/themes/tizen/tizen-black/images/00_toolbar_border.png
deleted file mode 100644 (file)
index 9af5792..0000000
Binary files a/src/themes/tizen/tizen-black/images/00_toolbar_border.png and /dev/null differ

diff --git a/src/themes/tizen/tizen-black/style.less b/src/themes/tizen/tizen-black/style.less
index 9e62513..b4f13c8 100644 (file)
--- a/src/themes/tizen/tizen-black/style.less
+++ b/src/themes/tizen/tizen-black/style.less
@@ -18,6 +18,7 @@
 @color_bar_toolbar_bg : rgba(70, 76, 94, 1);                   /* B0515L1: Toolbar bg */
 @color_bar_toolbar_button_text : rgba(250, 250, 250, 1);       /* B052L4 : Toolbar button normal */
 @color_bar_toolbar_button_text_press : rgba(250, 250, 250, 1); /* B052L4P : Toolbar button pressed */
+@color_bar_toolbar_divider : rgba(255, 255, 255, 0.2);
 @color_bar_navbar_press : rgba(42, 57, 172, 1);                /* B0511P : Navigation bar bg press */
 
 /***************************************************************************

diff --git a/src/themes/tizen/tizen-white/images/00_toolbar_border.png b/src/themes/tizen/tizen-white/images/00_toolbar_border.png
deleted file mode 100644 (file)
index 2d7d0ba..0000000
Binary files a/src/themes/tizen/tizen-white/images/00_toolbar_border.png and /dev/null differ

diff --git a/src/themes/tizen/tizen-white/style.less b/src/themes/tizen/tizen-white/style.less
index 277d084..26f16df 100644 (file)
--- a/src/themes/tizen/tizen-white/style.less
+++ b/src/themes/tizen/tizen-white/style.less
@@ -19,6 +19,7 @@
 @color_bar_toolbar_bg : rgba(222, 220, 213, 1);                  /* B0515L1: Toolbar bg */
 @color_bar_toolbar_button_text : rgba(58, 58, 58, 1);          /* B052L4 : Toolbar button normal */
 @color_bar_toolbar_button_text_press : rgba(250, 250, 250, 1); /* B052L4P : Toolbar button pressed */
+@color_bar_toolbar_divider : rgba(138, 138, 138, 0.2);
 @color_bar_navbar_press : rgba(14, 102, 170, 1);               /* B0511P : Navigation bar bg press */
 
 /***************************************************************************