Export 0.2.1

[platform/framework/web/web-ui-fw.git] / src / themes / tizen / common / jquery.mobile.forms.textinput.less

diff --git a/src/themes/tizen/common/jquery.mobile.forms.textinput.less b/src/themes/tizen/common/jquery.mobile.forms.textinput.less
index 5ad0160..a48a2bb 100755 (executable)
--- a/src/themes/tizen/common/jquery.mobile.forms.textinput.less
+++ b/src/themes/tizen/common/jquery.mobile.forms.textinput.less
@@ -1,5 +1,5 @@
 @import "config.less";\r
-@search-bar-padding: (16*@unit_base);\r
+@search-bar-padding: (13*@unit_base);\r
 \r
 label.ui-input-text {\r
        font-size: 22 * @unit_base;\r
@@ -32,8 +32,15 @@ textarea.ui-input-text {
 .ui-input-search {\r
        position: relative;\r
 \r
-       padding-right : 30 * @unit_base;\r
-       padding-left : 30 * @unit_base;\r
+       padding-right : 36 * @unit_base;\r
+       padding-left : 36 * @unit_base;\r
+\r
+       border : 1px solid @color_searchbar_border;\r
+       -webkit-box-shadow: inset 2 * @unit_base 2 * @unit_base 2 * @unit_base @color_searchbar_border;\r
+       -moz-box-shadow: inset 2 * @unit_base 2 * @unit_base 2 * @unit_base @color_searchbar_border;\r
+       -o-box-shadow: inset 2 * @unit_base 2 * @unit_base 2 * @unit_base @color_searchbar_border;\r
+       -ms-box-shadow: inset 2 * @unit_base 2 * @unit_base 2 * @unit_base @color_searchbar_border;\r
+       box-shadow: inset 2 * @unit_base 2 * @unit_base 2 * @unit_base @color_searchbar_border;\r
 \r
        input.ui-input-text {\r
                width : 100%;\r
@@ -46,10 +53,10 @@ textarea.ui-input-text {
                background: transparent none;\r
        }\r
        .ui-btn-icon-notext.ui-input-clear {\r
-               width: 30 * @unit_base;\r
-               height: 30 * @unit_base;\r
+               width: 36 * @unit_base;\r
+               height: 33 * @unit_base;\r
                .ui-btn-inner {\r
-                       padding : 4 * @unit_base;\r
+                       padding : 6 * @unit_base;\r
                }\r
        }\r
        .ui-icon-deleteSearch {\r
@@ -66,16 +73,6 @@ textarea.ui-input-text {
        .ui-input-clear-hidden { display: none; }\r
 }\r
 \r
-.ui-image-search {\r
-       position: absolute;\r
-       top: 0px;\r
-       left: 0px;\r
-       width : 22 * @unit_base;\r
-       height : 22 * @unit_base;\r
-       margin: 4 * @unit_base;\r
-}\r
-\r
-\r
 /* code for label+inputbox : remove this code if webApp dev. controls input area */\r
 @media all and (min-width: 721*@unit_base) {\r
        label.ui-input-text:not([data-type='search']) {\r
@@ -92,7 +89,6 @@ textarea.ui-input-text {
        }\r
 }\r
 \r
-\r
 /* search bar */\r
 .ui-body-s > div > .ui-field-contain > .input-search-bar,\r
 .ui-body-s > .ui-field-contain > .input-search-bar {\r
@@ -108,6 +104,7 @@ textarea.ui-input-text {
        .ui-corner-all {\r
                .LESSborder-radius-all(.3em);\r
        }\r
+\r
        .ui-input-search {\r
                font-size : 16 * @unit_base;\r
                display : block;\r
@@ -115,20 +112,33 @@ textarea.ui-input-text {
 \r
                background-color: @color_searchbar_input_field_bg;\r
                .ui-input-text {\r
-                       height: 30 * @unit_base;\r
+                       height: 33 * @unit_base;\r
                        padding : 0px;\r
 \r
                        margin-right : 38 * @unit_base;\r
                }\r
+\r
+               .ui-image-search {\r
+                       position: absolute;\r
+                       top: 0px;\r
+                       left: 0px;\r
+                       width : 22 * @unit_base;\r
+                       height : 22 * @unit_base;\r
+                       margin: 6 * @unit_base;\r
+               }\r
        }\r
+\r
        .ui-input-search-default {\r
+               margin-right : 75 * @unit_base;\r
                -webkit-transition: width 400ms linear;\r
                -moz-transition: width 400ms linear;\r
                -o-transition: width 400ms linear;\r
                -ms-transition: width 400ms linear;\r
                transition: width 400ms linear;\r
        }\r
+\r
        .ui-input-search-wide {\r
+               margin-right : 75 * @unit_base;\r
                margin-right : 0 * @unit_base;\r
                -webkit-transition: width 400ms linear;\r
                -moz-transition: width 400ms linear;\r
@@ -136,50 +146,65 @@ textarea.ui-input-text {
                -ms-transition: width 400ms linear;\r
                transition: width 400ms linear;\r
        }\r
-       .ui-btn-icon-cancel {\r
+\r
+       .ui-btn-icon-cancel.ui-input-cancel {\r
                display: inline-block;\r
                position: absolute;\r
 \r
-               top     : 16 * @unit_base;\r
+               top     : 3 * @unit_base;\r
                right : 0 * @unit_base;\r
-               margin-right : 16 * @unit_base;\r
+               height : 33 * @unit_base;\r
+               margin-right : 10 * @unit_base;\r
 \r
                vertical-align: middle;\r
                padding : 0px;\r
 \r
-               height : 74 * @unit_base;\r
-\r
                border-color : none;\r
-               .ui-btn-text{\r
-                       font-size : 32 * @unit_base;\r
-               }\r
-               .ui-btn-inner {\r
-                       padding-top : 18 * @unit_base;\r
-                       padding-bottom : 18 * @unit_base;\r
-               }\r
-       }\r
 \r
-       .ui-btn-icon-cancel.ui-input-cancel {\r
-               width : 134 * @unit_base;\r
+               width : 68 * @unit_base;\r
                -webkit-transition: all 400ms linear;\r
                -moz-transition: all 400ms linear;\r
                -o-transition: all 400ms linear;\r
                -ms-transition: all 400ms linear;\r
                transition: all 400ms linear;\r
+\r
+               .ui-btn-inner {\r
+                       padding-top : 6 * @unit_base;\r
+                       padding-bottom : 6 * @unit_base;\r
+                       .ui-btn-text{\r
+                               font-size : 15 * @unit_base;\r
+                       }\r
+               }\r
+\r
+               &.ui-btn-cancel-hide {\r
+                       right : -75 * @unit_base;\r
+                       visibility: hidden;\r
+               }\r
+               &.ui-btn-cancel-show {\r
+                       right : 0px;\r
+                       visibility: visible;\r
+               }\r
        }\r
-       .ui-btn-cancel-hide {\r
-               right : -150 * @unit_base;\r
-               visibility: hidden;\r
+\r
+       .ui-search-bar-icon {\r
+               margin-left : 42 * @unit_base;\r
        }\r
-       .ui-btn-cancel-show {\r
-               right : 0px;\r
-               visibility: visible;\r
+\r
+       .ui-btn.ui-btn-search-front-icon {\r
+               position : absolute;\r
+               width : 35 * @unit_base;\r
+               height : 35 * @unit_base;\r
+               top : 2 * @unit_base;\r
+               border-radius : 66 * @unit_base;\r
+               >.ui-btn-inner.ui-btn-icon-only {\r
+                       border-radius : 66 * @unit_base;\r
+               }\r
        }\r
 }\r
 \r
 .ui-header .input-search-bar {\r
-       padding-top : 13 * @unit_base;\r
-       padding-bottom : 13 * @unit_base;\r
+       padding-top : 4 * @unit_base;\r
+       padding-bottom : 4 * @unit_base;\r
 }\r
 \r
 .ui-image-search {\r
@@ -193,3 +218,4 @@ textarea.ui-input-text {
        background-repeat: no-repeat;\r
        background-size : 100% 100%;\r
 }\r
+\r