header: Move button top higher in header with tabbar

Buttons in the page header have its own position(which is described in
the Tizen GUI guide), but if the button and the tabbar are put into the
header together, the tabbar overlaps the lower part of buttons. Although
there is no specification about the vertical position of the buttons
when the tabbar is used together, this patch moves the button slightly
higher, not to be overlaped by the tabbar.
Resolves N_SE-22253.

Change-Id: I92c61eaf10ca6134d1b625da5bd3d1e71aa4c84d

diff --git a/src/themes/tizen/common/jquery.mobile.theme.less b/src/themes/tizen/common/jquery.mobile.theme.less
index e0ab796..3ec9a50 100644 (file)
--- a/src/themes/tizen/common/jquery.mobile.theme.less
+++ b/src/themes/tizen/common/jquery.mobile.theme.less
@@ -103,6 +103,14 @@
                background: transparent;
                color   : @color_bar_title_button_text;
        }
+       &.ui-title-tabbar >.ui-btn {
+               // NOTE: there is an issue that when tabbar and button are
+               // used together in the header, the lower part of buttons is
+               // hidden by the tabbar. (N_SE-22253) Although No specification
+               // for this case is found in the GUI guide, this one is added
+               // to resolve this issue.
+               top: 8 * @unit_base;
+       }
 
        > .ui-btn.ui-btn-icon_only {
                -o-border-radius : 0px;