src/themes/tizen/tizen-white/style.less

   1 /******************************************************************************************************/
   2 /**************** Define ColorCode Here    ************* Start ****************************************/
   3 /******************************************************************************************************/
   4
   5
   6
   7 /***************** Naviframe **********************************/
   8 @color_bar_title_text : rgba(59, 115, 182, 1); /* #3b73b6 */ /* title text */
   9 @color_bar_btn_press : rgba(0, 0, 0, 0.1);
  10
  11 /***************** Body ***************************************/
  12 @color_bg: rgb(248, 246, 239); // #F8F6EF // Main Background color
  13 @color_text: rgb(0, 0, 0);      // 0 0 0
  14 @color_text_sub:                        rgb(102, 102, 102);     // 102 102 102
  15 @color_text_setting:            rgb(42, 109, 140);      // 42 109 140
  16
  17 /***************** List ***************************************/
  18 @color_list_bg:                                                         rgba(248, 246, 239, 1);                         /* B0211        : List bg color                 */
  19 @color_list_press :                                             rgba(87, 135, 194, 1);                          /* B041         : List Press color      */
  20 @color_list_border_bottom:              rgba(211, 209, 203, 0.5);                       /* B0221        : 1px line Code                 */
  21 @color_list_main_text_focus:            rgba(249, 249, 249, 1);
  22 @color_list_main_text_unfocus:          rgba(0, 0, 0, 1);
  23 @color_list_sub_text_default: rgba(100, 100, 100, 1);
  24
  25
  26 @color_list_divider_expand_div : rgba(0, 0, 0, 0.5);
  27 @color_list_divider_bg : rgba(248, 246, 239, 1);                                                /* W021L1 : Index BG                                    */
  28 @color_list_divider_text : rgba(59, 115, 182, 1);                                               /* W021L2 : Index bar                                   */
  29
  30 @color_list_dialogue_bg : rgba(239, 237, 229, 1);
  31 @color_dialogue_main_text: rgba(59, 115, 182, 1);
  32 @color_dialogue_border_right: rgba(142, 154, 163, 1);
  33
  34 @color_list_expandable_expanded_bg:     rgb(215, 225, 232);
  35 @color_list_expanded_bg : rgba(220, 218, 211, 1);
  36
  37 @color_list_bubble_sent_text:   rgb(0, 0, 0);
  38 @color_list_bubble_receive_text:        rgb(255, 255, 255);
  39 @color_list_bubble_sos_text:    rgb(233, 73, 73);
  40 @color_list_bubble_date_text:   rgb(104, 104, 104);
  41 @color_list_bubble_date_bg:             rgba(225, 225, 225, 0);
  42 @color_list_bubble_time_sent_text:      rgb(57, 166, 215);
  43 @color_list_bubble_time_receive_text:   rgb(211, 0, 0);
  44 @color_list_bubble_time_sos_text:       rgb(211, 0, 0);
  45 @color_list_bubble_name_text:   rgb(139, 139, 139);
  46 @color_list_bubble_help_text:   rgb(154, 154, 154);
  47 @color_list_bubble_link_text:   rgb(34, 129, 157);
  48
  49
  50 /***************** SearchBar(forms.textinput) *****************/
  51 @color_searchbar_bg : rgba(248, 246, 239, 1);
  52 @color_searchbar_default_text : rgba(121, 131, 138, 1); /* Search default text */
  53 @color_searchbar_input_field_bg : rgba(255, 255, 255, 1); /* W301 : 00_search_edit_field_bg.png */
  54
  55 /***************** Popup **************************************/
  56 @font_size_popup_info_style: 24 * @unit_base;
  57 @color_popup_text_bg: rgba(248, 246, 239, 1);   /* B061L1 */
  58
  59
  60 /***************** Button *************************************/
  61
  62 @color_button_EditText:         rgb(61, 61, 61);
  63 @color_button_EditTextPress:    rgb(61, 61, 61);
  64
  65 @color_button_text_normal:      rgb(54, 49, 51);
  66 @color_button_text_press:       rgb(248, 246, 239);
  67
  68 @color_button_normal:           rgb(235, 232, 227);
  69 @color_button_normal_webkit:    -webkit-linear-gradient(top, rgb(235, 232, 227), rgb(234, 231, 226));
  70 @color_button_normal_moz:       -moz-linear-gradient(top, rgb(235, 232, 227), rgb(234, 231, 226));
  71 @color_button_normal_o:         -o-linear-gradient(top, rgb(235, 232, 227), rgb(234, 231, 226));
  72 @color_button_normal_ms:        -ms-linear-gradient(top, rgb(235, 232, 227), rgb(234, 231, 226));
  73 @color_button_press:            rgb(59, 115, 182);
  74
  75 @color_button_inner:            rgb(247, 245, 238);
  76 @color_button_inner_webkit:     -webkit-linear-gradient(top, rgb(250, 247, 242), rgb(248, 245, 240));
  77 @color_button_inner_moz:        -moz-linear-gradient(top, rgb(250, 247, 242), rgb(248, 245, 240));
  78 @color_button_inner_o:          -o-linear-gradient(top, rgb(250, 247, 242), rgb(248, 245, 240));
  79 @color_button_inner_ms:         -ms-linear-gradient(top, rgb(250, 247, 242), rgb(248, 245, 240));
  80
  81 @button_shadow_outer:              0 0 1px 1px rgba(255, 255, 255, 1);
  82 @button_shadow_inner:           inset 0 0 3px rgba(255, 255, 255, 1);
  83
  84 .LESSbutton_box_style{
  85         color: @color_button_text_normal;
  86 }
  87
  88 .LESSbutton_up_style{
  89         background: @color_button_normal;
  90         background: @color_button_normal_webkit;
  91         background: @color_button_normal_moz;
  92         background: @color_button_normal_o;
  93         background: @color_button_normal_ms;
  94 }
  95
  96 .LESSbutton_box_style{
  97         background: @color_button_normal;
  98         background: @color_button_normal_webkit;
  99         background: @color_button_normal_moz;
 100         background: @color_button_normal_o;
 101         background: @color_button_normal_ms;
 102         border: 1px solid;
 103         border-color: rgba(220, 218, 211, 1);
 104         .LESSbox-shadow-line( @button_shadow_outer );
 105 }
 106 .LESSbutton_inner_box_style{
 107         background: @color_button_inner;
 108         background: @color_button_inner_webkit;
 109         background: @color_button_inner_ms;
 110         background: @color_button_inner_o;
 111         background: @color_button_inner_moz;
 112         .LESSbox-shadow-line( @button_shadow_inner );
 113 }
 114 .LESSbutton_inner_pressstyle{
 115         color: @color_button_text_press;
 116 }
 117
 118 .LESSbutton_text1_style{
 119         font-family: @font_family;
 120         font-weight: normal;
 121         font-size: 1.0rem;
 122         font-style:normal;
 123         color: @color_button_text_black;
 124         &:hover {color: @color_button_text_normal;}
 125 }
 126
 127 .LESSbutton_hover_style{
 128         color: @color_button_text_normal;
 129 }
 130
 131 .LESSbutton_down_style{
 132         background: @color_button_press;
 133         color: @color_button_text_press;
 134 }
 135
 136 /***************** Datetime picker ****************************/
 137
 138 @font_size_datetime_main_text:              22 * @unit_base;
 139 @font_size_datetime_sub_text:               16 * @unit_base;
 140 /***************************************************************************
 141                         contextual popup
 142  ***************************************************************************/
 143 @color_ctxpopup_text:                   rgb(255, 255, 255);
 144 @color_ctxpopup_background:             rgb(68, 68, 68);
 145 @color_ctxpopup_border_left:            rgb(91, 91, 91);
 146 @color_ctxpopup_border_right:           rgb(45, 45, 45);
 147 @color_ctxpopup_border_top:             rgb(91, 91, 91);
 148 @color_ctxpopup_border_bottom:          rgb(45, 45, 45);
 149
 150 @color_ctxbutton_press:            rgb(59, 115, 182);
 151
 152 @color_ctxpopup_timepicker_text:        rgba( 249, 249, 249, 0.4 );
 153 @color_ctxpopup_timepicker_text_focus:  rgba( 249, 249, 249, 1 );
 154
 155 /******************************************************************************************************/
 156 /**************** Define ColorCode Here    ************* End ****************************************/
 157 /******************************************************************************************************/
 158
 159
 160
 161
 162
 163
 164
 165
 166
 167 /************************** old color code  ******************************/
 168
 169 // Basic color set
 170
 171 @color_bg_sub:                  rgb(36, 36, 36);        // 36 36 36     // TODO: used only in dialog group. Check more.
 172
 173 @color_border:                  rgb(42, 42, 42);        // 42 42 42
 174 @color_header:                  rgb(68, 68, 74);        // 68 68 74
 175
 176 @color_scrollbar:               rgb(198, 196, 190);
 177
 178
 179 @color_text_dim:                        rgb(108, 115, 118);     // 108 115 118
 180 @color_text_focus:              @color_text;
 181
 182 @color_text_input:              rgb(70, 70, 70);        // 70 70 70
 183 @color_text_cursor:             @color_text_setting;
 184 @color_text_segctrl:            rgb(158, 195, 213);     // 158 195 213  // TODO: used only in segctrl. Check more.
 185
 186 //Dialogue color set
 187
 188 @color_dialogue_sub_text:                               rgb(146,146,146);
 189
 190
 191 //Dialogue Editor color set
 192 @color_dialogue_editor_default_text:    rgb(70, 70, 70);
 193 @color_dialogue_editor_bg:                              rgb(0, 0, 0);
 194 @color_dialogue_editor_border:                  rgb(108, 168, 199);
 195 /*************************
 196   Vars/Mixins for Widgets
 197
 198   NOTE:
 199     * Color variables' name: @color_<widget name>_<identifier>
 200         * Color values: Use rgb() or rgba()
 201  *************************/
 202
 203
 204 /***************************************************************************
 205                    List
 206 ***************************************************************************/
 207
 208
 209 @color_list_main_text_read:             rgba(158, 158, 158, 1);
 210 @color_list_main_text_unread:   rgba(249, 249, 249, 1);
 211
 212 @color_list_sub_text_settings:  rgba(0, 140, 210, 1);
 213 @color_list_sub_text_focus:             rgba(249, 249, 249, 1);
 214 @color_list_flexible_text_main: rgba(249, 249, 249, 1);
 215 @color_list_flexible_text_sub:          rgba(149, 149, 149, 1);
 216 @color_list_index_list:                 rgba(164, 164, 164, 1);
 217 @color_list_editfield_text:                     rgba(70, 70, 70, 1);
 218 @color_list_editfield_text_cursor:      rgba(0, 140, 210, 1);
 219 @color_list_multiline_text:             rgba(149, 149, 149, 1);
 220 @color_list_3line_main_text:            rgba(249, 249, 249, 1);
 221 @color_list_3line_main_text_read:       rgba(249, 249, 249, 1);
 222 @color_list_3line_main_text_focus:      rgba(249, 249, 249, 1);
 223 @color_list_3line_main_text2:           rgba(104, 137, 152, 1);
 224 @color_list_3line_main_text2_focus:     rgba(249, 249, 249, 1);
 225 @color_list_converter_style:            rgba(249, 249, 249, 1);
 226 @color_list_converter_style_focus:      rgba(249, 249, 249, 1);
 227 @color_list_unread_email:               rgba(249, 249, 249, 1);
 228 @color_list_contents_text:              rgba(210, 210, 210, 1);
 229 @color_list_name_text:                  rgba(129, 129, 129, 1);
 230 @color_list_name_text_dim:              rgba(0, 140, 210, 1);
 231 @color_list_colorbar:                           rgba(80, 107, 207, 1); //Temp, not defined
 232
 233
 234
 235
 236
 237
 238 @font_size_list_main_text:              44 * @unit_base; //1.375rem;    /* 44 px */
 239 @font_size_list_sub_text:               32 * @unit_base; //1.0rem;      /* 32 px */
 240 @font_size_list_flexible_text_main:     48 * @unit_base; //1.5rem;      /* 48 px */
 241 @font_size_list_flexible_text_sub:      36 * @unit_base; //1.125rem;    /* 36 px */
 242 @font_size_list_index_list:             32 * @unit_base; //1.0rem;      /* 32 px */
 243 @font_size_list_editfield_text:         44 * @unit_base; //1.375rem;    /* 44 px */
 244 @font_size_list_multiline_text:         32 * @unit_base; //1.0rem;      /* 32 px */
 245 @font_size_list_3line_main_text:        42 * @unit_base; //1.3125rem;   /* 42 px */
 246 @font_size_list_3line_main_text2:       36 * @unit_base; //1.125rem;    /* 36 px */
 247 @font_size_list_converter_style:        40 * @unit_base; //1.3rem;      /* 40 px */
 248 @font_size_list_unread_email:           44 * @unit_base; //1.375rem;    /* 44 px */
 249 @font_size_list_contents_text:          30 * @unit_base; //0.94rem;     /* 30 px */
 250 @font_size_list_name_text:              32 * @unit_base; //1.0rem;      /* 32 px */
 251
 252 @style_list_li_dialogue_border_left_width: 10 * @unit_base;
 253 @style_list_bubble_date_height: 40 * @unit_base;
 254 @style_list_bubble_date_text_align:     center;
 255
 256
 257 /***************************************************************************
 258                    Shortcut Scroll
 259 ***************************************************************************/
 260 @color_shortcutscroll_rollover_bg: none;
 261 @color_shortcutscroll_rollover_text: rgba(160, 172, 179, 1);
 262 @color_shortcutscroll_popup_bg: rgba(229, 229, 229, 1); // 00_fast_scroll_popup_bg.png
 263 @color_shortcutscroll_popup_shadow: rgba(199, 199, 199, 0.5);
 264 @color_shortcutscroll_popup_text: rgb(42, 137, 194);
 265
 266
 267 /***************************************************************************
 268                    Popup
 269 ***************************************************************************/
 270 @color_popup_center_progressbar_title:  rgba(153, 153, 153, 1);
 271 @color_popup_text_progress_title:       rgba(249, 249, 249, 1);
 272 /* TODO : ninepatch popup title */
 273 @color_popup_title_bg:          rgba(80, 147, 182, 255);        /* popup_title_bg.png */
 274
 275 @color_popup_button_bg:         rgba(248, 246, 239, 1);
 276 @color_popup_font:                      white;
 277 @color_popup_text_font:         black;
 278
 279 @color_popup_buttonbg:          rgb(84, 126, 153);
 280 @color_popup_buttonbg_webkit:   -webkit-gradient(linear, left top, left bottom, from(rgb(84, 126, 153)), to(rgb(69, 105, 128)));
 281 @color_popup_buttonbg_moz:      -moz-linear-gradient(top, rgb(84, 126, 153), rgb(69, 105, 128));
 282 @color_popup_buttonbg_ms:       -ms-linear-gradient(top, rgb(84, 126, 153), rgb(69, 105, 128));
 283 @color_popup_buttonbg_o:        -o-linear-gradient(top, rgb(84, 126, 153), rgb(69, 105, 128));
 284 @color_popup_buttontext:        rgb(249, 249, 249);
 285 @color_popup_buttonbg_over:     rgb(94, 136, 163);
 286 @color_popup_buttonbg_press:    rgb(67, 160, 217);
 287 @color_popup_buttonbg_press_webkit:     -webkit-gradient(linear, left top, left bottom, from(rgb(67, 160, 217)), to(rgb(56, 139, 185)));
 288 @color_popup_buttonbg_press_moz:        -moz-linear-gradient(top, rgb(67, 160, 217), rgb(56, 139, 185));
 289 @color_popup_buttonbg_press_ms:         -ms-linear-gradient(top, rgb(67, 160, 217), rgb(56, 139, 185));
 290 @color_popup_buttonbg_press_o:          -o-linear-gradient(top, rgb(67, 160, 217), rgb(56, 139, 185));
 291
 292 @color_popup_scroller_bg:       rgba(248, 246, 239, 1);
 293
 294
 295 @font_size_popup_basic_style_title:             24 * @unit_base; //1.1875rem;   /* 38px */
 296 @font_size_popup_center_progressbar_title:      26 * @unit_base; //0.8125rem;   /* 26px */
 297 @font_size_popup_text_progress_title:           42 * @unit_base; //1.3125rem;   /* 42px */
 298 @font_size_popup_button_text:                   32 * @unit_base; //1.0rem;      /* 32px */
 299
 300 .LESSpopup_button_style{
 301 /*      background: @color_popup_buttonbg;
 302         background: @color_popup_buttonbg_webkit;
 303         background: @color_popup_buttonbg_moz;
 304         background: @color_popup_buttonbg_ms;
 305         background: @color_popup_buttonbg_o;
 306         color: @color_popup_buttontext;*/
 307 }
 308
 309 .LESSpopup_button_hover_style{
 310         background: @color_popup_buttonbg_over;
 311 }
 312
 313 .LESSpopup_button_press_style{
 314         background: @color_popup_buttonbg_press;
 315         background: @color_popup_buttonbg_press_webkit;
 316         background: @color_popup_buttonbg_press_moz;
 317         background: @color_popup_buttonbg_press_ms;
 318         background: @color_popup_buttonbg_press_o;
 319 }
 320
 321 .LESSpopup_padding_style{
 322 }
 323
 324 /***************************************************************************
 325                     Button
 326 ***************************************************************************/
 327
 328 @color_button_press_webkit:     -webkit-gradient(linear, left top, left bottom, from(rgb(67, 160, 217)), to(rgb(56, 139, 185)));
 329 @color_button_press_moz:        -moz-linear-gradient(top, rgb(67, 160, 217), rgb(56, 139, 185));
 330
 331 @color_button_hover:            rgb(161, 171, 177);
 332
 333 @color_button_text_black:       rgb(0, 0, 0);
 334 @color_button_text_white:       rgb(249, 249, 249);
 335 @color_button_text_press:       rgb(249, 249, 249);
 336
 337 @color_circlebutton_hover:              rgb(239, 119, 126);
 338 @color_circlebutton_hover_webkit:       -webkit-gradient(linear, left top, left bottom, from(rgb(198, 78, 85)), to(rgb(166, 43, 45)));
 339 @color_circlebutton_hover_moz:          -moz-linear-gradient(top, rgb(198, 78, 85), rgb(166,43,45));
 340 @color_circlebutton_press:              rgb(67, 160, 217);
 341 @color_circlebutton_press_webkit:       -webkit-gradient(linear, left top, left bottom, from(rgb(67, 160, 217)), to(rgb(56, 139, 185)));
 342 @color_circlebutton_press_moz:          -moz-linear-gradient(top, rgb(67, 160, 217), rgb(56, 139, 185));
 343
 344 @color_button_EditText:         rgb(249, 249, 249);
 345 @color_button_EditTextPress:    rgb(249, 249, 249);
 346 @color_button_EditBG:           rgb(0, 0, 0);
 347 @color_button_EditBGPress:      rgb(0, 140, 210);
 348
 349 @color_button_switch_BGon:              rgb(42, 126, 172);
 350 @color_button_switch_BGon_webkit:       -webkit-gradient(linear, left top, left bottom, from(rgb(33, 116, 167)), to(rgb(75, 165, 219)));
 351 @color_button_switch_BGon_moz:          -moz-linear-gradient(top, rgb(33, 116, 167), rgb(75, 165, 219));
 352 @color_button_switch_BGoff:             rgb(151, 161, 167);
 353 @color_button_switch_BGoff_text_color:  rgb(203, 203, 203);
 354 @color_button_switch_BGoff_webkit:      -webkit-gradient(linear, left top, left bottom, from(rgb(114, 114, 114)), to(rgb(141, 141, 141)));
 355 @color_button_switch_BGoff_moz:         -moz-linear-gradient(top, rgb(114, 114, 114), rgb(141, 141, 141));
 356 @color_button_switch_BGreed:            rgb(253, 253, 253);
 357 @color_button_switch_BGreed_webkit:     -webkit-gradient(linear, left top, left bottom, from(rgb(253, 253, 253)), to(rgb(231, 231, 231)));
 358 @color_button_switch_BGreed_moz:        -moz-linear-gradient(top, rgb(253, 253, 253), rgb(231, 231, 231));
 359
 360 @radius_button_switch: 4px;
 361 @radius_button_switch_reed: 2px;
 362
 363 @color_button_edit:                     rgb(201, 88, 88);
 364 @color_button_edit_webkit:              -webkit-gradient(linear, left top, left bottom, from(rgb(201, 88, 88)), to(rgb(161, 40, 40)));
 365 @color_button_edit_moz:                 -moz_linear-gradient(top, rgb(201, 88, 88), rgb(161, 40, 40));
 366
 367 @color_button_edit_press:               rgb(147, 24, 24);
 368 @color_button_edit_press_webkit:        -webkit-gradient(linear, left top, left bottom, from(rgb(147, 24,24)), to(rgb(110, 23, 23)));
 369 @color_button_edit_press_moz:           -moz-linear-gradient(top, rgb(147, 24, 24), rgb(110, 23, 23));
 370
 371
 372 .LESSbutton_text1_style{
 373         font-family: @font_family;
 374         font-weight: normal;
 375         font-size: 1.0rem;
 376         font-style:normal;
 377         color: @color_button_text_black;
 378         &:hover {color: @color_button_text_black;}
 379 }
 380
 381 .LESScirclebutton_hover_style{
 382         border-width: 0px;
 383         background: @color_circlebutton_hover;
 384         background: @color_circlebutton_hover_webkit;
 385         backgronnd: @color_circlebutton_hover_moz;
 386 }
 387
 388 .LESScirclebutton_press_style{
 389         border-width: 0px;
 390         background: @color_circlebutton_press;
 391         background: @color_circlebutton_press_webkit;
 392         background: @color_circlebutton_press_moz;
 393 }
 394
 395 .LESStoggleswitch_on_style{
 396         background: @color_button_switch_BGon;
 397         background: @color_button_switch_BGon_webkit;
 398         background: @color_button_switch_BGon_moz;
 399         border-radius: @radius_button_switch;
 400         -webkit-border-radius: @radius_button_switch;
 401         -moz-border-radius: @radius_button_switch;
 402 }
 403
 404 .LESStoggleswitch_off_style{
 405         color: @color_button_switch_BGoff_text_color;
 406         background: @color_button_switch_BGoff;
 407         background: @color_button_switch_BGoff_webkit;
 408         background: @color_button_switch_BGoff_moz;
 409         border-radius: @radius_button_switch;
 410         -webkit-border-radius: @radius_button_switch;
 411         -moz-border-radius: @radius_button_switch;
 412 }
 413
 414 .LESStoggleswitch_reed_style{
 415         background: @color_button_switch_BGreed;
 416         background: @color_button_switch_BGreed_webkit;
 417         background: @color_button_switch_BGreed_moz;
 418         border-radius: @radius_button_switch_reed;
 419         -webkit-border-radius: @radius_button_switch_reed;
 420         -moz-border-radius: @radius_button_switch_reed;
 421 }
 422
 423 .LESSbutton_edit_style{
 424         background: @color_button_edit;
 425         background: @color_button_edit_webkit;
 426         background: @color_button_edit_moz;
 427         color: rgb(249, 249, 249);
 428 }
 429
 430 .LESSbutton_editpress_style{
 431         background: @color_button_edit_press;
 432         background: @color_button_edit_press_webkit;
 433         background: @color_button_edit_press_moz;
 434 }
 435
 436 .LESSbutton_edit_padding{
 437         padding: 0.5em 0.8em;
 438 }
 439
 440 /***************************************************************************
 441                     Date Time picker color set
 442 ***************************************************************************/
 443 @color_timepicker_selector_color:       rgb(42,137,194);
 444
 445
 446 /***************************************************************************
 447                     DaySelector
 448 ***************************************************************************/
 449 @color_dayselector_Btn_Sat:             rgba(0, 168, 231, 1); /* #00a8e7 */
 450 @color_dayselector_Btn_Sun:             rgba(240, 20, 2, 1); /* #f01402 */
 451 @color_dayselector_Btn_Mon_to_Fri:      rgba(249, 249, 249, 1); /* #f9f9f9 */
 452 @color_dayselector_Btn_border:          rgba(26, 82, 116, 1); /* #f9f9f9 */
 453
 454 @color_dayselector_Btn_normal_start:    rgb(126, 157, 178);
 455 @color_dayselector_Btn_normal_end:      rgb(84,121,144);
 456
 457 @color_dayselector_Btn_press_start:     rgb(59,119,150);
 458 @color_dayselector_Btn_press_end:       rgb(47,91,117);
 459
 460
 461 .LESSDayselectorButtonNormal{
 462         .LESSbackground-with-gradient(top, @color_dayselector_Btn_normal_start, @color_dayselector_Btn_normal_end);
 463 }
 464
 465 .LESSDayaselectorButtonPress{
 466         .LESSbackground-with-gradient(top, @color_dayselector_Btn_press_start, @color_dayselector_Btn_press_end);
 467 }
 468
 469
 470 /***************************************************************************
 471                     OptionHeader
 472 ***************************************************************************/
 473 @color_optionheader_Background: rgba(26, 82, 116, 1);
 474 @color_optionheader_bt:         -webkit-linear-gradient(top,  rgb(56,112,141) 0%,rgb(36,93,128) 100%);
 475 @color_optionheader_bt_press:   -webkit-linear-gradient(top,  rgb(74,164,218) 0%,rgb(43,138,195) 100%);
 476 @color_optionheader_tab_text:   rgba(249, 249, 249, 1); /* #f9f9f9 */
 477
 478
 479
 480
 481 /***************************************************************************
 482                     SegmentControl
 483 ***************************************************************************/
 484 @color_segmentcontrol_btn_normal : rgb(125,157,178);
 485 @color_segmentcontrol_btn_normal_start : rgb(125,157,178);
 486 @color_segmentcontrol_btn_normal_end : rgb(84,121,144);
 487
 488 @color_segmentcontrol_btn_press : rgb(59,119,150);
 489 @color_segmentcontrol_btn_press_start : rgb(59,119,150);
 490 @color_segmentcontrol_btn_press_end : rgb(47,91,117);
 491
 492 @color_segmentcontrol_Seg_text : rgba(249, 249, 249, 1); /* #F9F9F9*/
 493 @color_segmentcontrol_Seg_text_pressed : rgba(249, 249, 249, 1); /* #F9F9F9*/
 494
 495
 496 /* delete */
 497 /*
 498 .LESSSegmentControlBtnBackground
 499 {
 500         .LESSbackground-with-gradient(top, @color_segmentcontrol_btn_normal_start, @color_segmentcontrol_btn_normal_end);
 501 }
 502
 503 .LESSSegmentControlBtnPressBackground
 504 {
 505         .LESSbackground-with-gradient(top, @color_segmentcontrol_btn_press_start, @color_segmentcontrol_btn_press_end);
 506 }
 507 */
 508
 509 /***************************************************************************
 510                     ControlGroup
 511 ***************************************************************************/
 512 @color_controlgroup_btn_border : rgba(26, 82, 116, 1); /* #252525 */
 513
 514
 515 /***************************************************************************
 516                     Header / Footer
 517                     NavigationBar / ControlBar
 518 ***************************************************************************/
 519 @color_bar_bg : rgb(156, 181, 179);
 520 @color_bar_bg_start : rgb(156, 181, 179);
 521 @color_bar_bg_end : rgb(79,116,141);
 522
 523 @color_bar_back_btn_press : rgba(26, 82, 116, 0.3); /* #1A5274 */
 524
 525 @color_bar_btn_bg : transparent;
 526 @color_bar_back_btn_bg : transparent;
 527
 528 @color_bar_seg_btn_border : rgba(0, 0, 0, 0.1);
 529 @color_bar_seg_text_press : rgba(249, 249, 249, 1);
 530 @color_bar_seg_text_normal : rgba(249, 249, 249, 1);
 531 @color_bar_seg_btn_press : -webkit-linear-gradient(top,  rgb(61,120,151) 0%,rgb(48,91,118) 100%);
 532 @color_bar_seg_btn_normal : -webkit-linear-gradient(top,  rgb(127,159,181) 0%,rgb(70,108,133) 100%);
 533
 534 @color_bar_title_bg : rgb(90, 153, 186);
 535 @color_bar_title_bg_start : rgb(90, 153, 186);
 536 @color_bar_title_bg_end : rgb(32, 84, 115);
 537
 538 @color_bar_title_btn_border : rgba(36, 93, 128, 0.4); /* 00_winset_divider_line.png  temp value */
 539
 540 @color_bar_footer_bg : -webkit-linear-gradient(top,  rgb(156,181,179) 0%,rgb(79,116,141) 100%);
 541 @color_bar_footer_btn_bg : transparent;
 542
 543 @color_controlbar_btn_border : rgba(0, 0, 0, 0.1); /* #000000 */
 544 @color_controlbar_tabbbar_bg : transparent;
 545 @color_controlbar_toolbbar_bg : transparent;
 546 @color_controlbar_bg : transparent;
 547
 548 @color_controlbar_btn_text : rgba(249, 249, 249, 1); /* #F9F9F9 */
 549 @color_controlbar_btn_press : -webkit-linear-gradient(top,  rgb(61,121,150) 0%,rgb(48,91,118) 100%);
 550
 551 @color_border_top : rgba(255, 255, 255, 0.5);
 552 @color_border_bottom : rgba(0, 0, 0, 0.5);
 553
 554 .LESSHeaderFooterBackground
 555 {
 556         .LESSbackground-with-gradient(top, @color_bar_bg_start, @color_bar_bg_end);
 557 }
 558
 559 .LESSColorBarTitleBackground
 560 {
 561         background : rgb(248, 246, 239); // #F8F6EF /* Header Background */
 562 }
 563
 564 /***************************************************************************
 565                     Tickernoti
 566 ***************************************************************************/
 567 @color_ticker_bg:                       rgb(68, 68, 68);
 568 @color_ticker_text1:                    rgb(255, 255, 255);
 569 @color_ticker_text2:                    rgb(255, 255, 255);
 570 @color_ticker_btn:                      rgb(64, 64, 64);
 571
 572
 573 /***************************************************************************
 574                     Smallpopup
 575 ***************************************************************************/
 576 @color_smallpopup_bg:                   rgb(68, 68, 68);
 577 @color_smallpopup_text:                 rgb(255, 255, 255);
 578
 579
 580 /***************************************************************************
 581                     No Contents
 582 ***************************************************************************/
 583 @color_nocontents_text:                 rgb(128, 128, 128);
 584
 585
 586 /***************************************************************************
 587                     Slider
 588 ***************************************************************************/
 589 @color_slider_handle_text:              rgb(59, 115, 182);
 590 @color_slider_popup_text:               rgb(249, 249, 249);
 591
 592
 593 /***************************************************************************
 594                     Progress
 595 ***************************************************************************/
 596 @color_progress_bar0:                   rgb(226, 223, 219);
 597 @color_progress_bar1:                   rgb(54, 119, 195);
 598
 599
 600 /***************************************************************************
 601                    Handler
 602 ***************************************************************************/
 603 @color_scrollview_handler_bg : rgba(150, 150, 150, 0.5);
 604
 605 /***************************************************************************
 606                    multimediaview
 607 ***************************************************************************/
 608 @color_multimediaview_bg : rgb(249, 249, 249);
 609 @color_multimediaview_control_bg : rgba(249, 249, 249, 0.5);
 610 @color_multimediaview_button_bg : rgb(249, 249, 249);
 611 @color_multimediaview_timestamp_text : rgb(42, 137, 194);
 612 @color_multimediaview_duration_text : rgb(128, 128, 128);
 613 @color_multimediaview_bar_gray : rgb(178, 178, 178);
 614 @color_multimediaview_bar_active : rgb(42, 137, 194);
 615 @color_multimediaview_bar_handle : rgb(249, 249, 249);
 616
 617 /***************************************************************************
 618                    Color widgets
 619 ***************************************************************************/
 620 @color_widgets_title_bg: rgb(235, 239, 241);
 621 @color_widgets_basic_border: rgb(192, 192, 192);
 622 @color_widgets_left_border: rgb(108, 168, 199);
 623
 624 .LESScolortitle_background_style{
 625         background-color: @color_widgets_title_bg;
 626         border: 1px solid;
 627         border-color: @color_widgets_basic_border;
 628         border-left: 6px solid;
 629         border-left-color: @color_widgets_left_border;
 630 }
 631
 632 .LESShsvpicker_background_style{
 633         background-color: @color_widgets_title_bg;
 634         border: 1px solid;
 635         border-color: @color_widgets_basic_border;
 636         border-left: 6px solid;
 637         border-left-color: @color_widgets_left_border;
 638 }
 639
 640 .LESSpalette_background_style{
 641         background-color: @color_widgets_title_bg;
 642         border: 1px solid;
 643         border-top: 6px solid;
 644         border-color: @color_widgets_basic_border;
 645 }
 646
 647
 648 /***************************************************************************
 649                    multibutton entry
 650 ***************************************************************************/
 651 @color_multibuttonentry_bg : rgb(249, 249, 249);
 652 @color_multibuttonentry_block_text : rgb(255, 255, 255);
 653 @color_multibuttonentry_block_bg : rgb(93, 160, 196);
 654 @color_multibuttonentry_block_border : rgb(88, 150, 184);
 655 @color_multibuttonentry_press_bg : rgb(40, 106, 145);
 656 @color_multibuttonentry_press_border : rgb(49, 126, 171);
 657 @color_multibuttonentry_input_text : #222222;
 658 @color_multibuttonentry_link_bg : rgb(178, 178, 178);
 659 @color_multibuttonentry_link : rgb(249, 249, 249);
 660
 661 /***************************************************************************
 662 ***************************************************************************/
 663
 664 /***************************************************************************
 665                   virtualgrid
 666 ***************************************************************************/
 667 @color_virtualgrid_bg : rgb(255, 255, 255);
 668
 669 /***************************************************************************
 670 ****************************************************************************
 671                                                                         Layout ( position, padding, margin etc...)
 672 ****************************************************************************
 673 ***************************************************************************/
 674 @style-title-font-size : 28 * @unit_base;
 675
 676 @style-title-extended-2btn-width : 688 * @unit_base;
 677 @style-title-extended-2btn-radio-width : 343 * @unit_base;
 678 @style-title-extended-3btn-width : 688 * @unit_base;
 679 @style-title-extended-3btn-radio-width : 229 * @unit_base;
 680 @style-title-extended-4btn-width : 688 * @unit_base;
 681 @style-title-extended-4btn-radio-width : 171 * @unit_base;
 682
 683 @style-back-btn-left : 44 * @unit_base;
 684 @style-back-btn-arrow-top : 30 * @unit_base;
 685
 686 @style-title-min-height : 30 * @unit_base;
 687 @style-title-extended-margin : -30 * @unit_base;
 688 /***************************************************************************
 689                                                                         Navigation
 690 ***************************************************************************/
 691
 692 .LESStitle-diff-style {
 693         text-align: left;
 694         margin: 20*@unit_base 8*@unit_base 12*@unit_base 8*@unit_base;
 695 }
 696
 697 .LESSextended-controlgroup-border {
 698         border-style : solid;
 699         border-width : 1px;
 700         border-bottom-width: 2px;
 701
 702         border-bottom-color: @color_border_bottom;
 703         border-top-color: @color_border_top;
 704         border-left-color: @color_bar_seg_btn_border;
 705         border-right-color: @color_bar_seg_btn_border;
 706 }
 707
 708 .LESSback-btn-background {
 709         background : none;
 710 }
 711
 712 .LESSbtn-back {
 713         width : 144 * @unit_base;
 714         height : 114 * @unit_base;
 715         top : 0 * @unit_base;
 716         right : 0 * @unit_base;
 717 }
 718
 719 .LESSbtn-back-inner {
 720         width : 144 * @unit_base;
 721         height : 114 * @unit_base;
 722 }