src/themes/tizen/common/jquery.mobile.tizen.ctxpopup.less

   1 @import "config.less";
   2
   3 @border_radius: .3em;
   4
   5 .ui-ctxpopup {
   6         display: table;
   7
   8         .ui-ctxpopup-row .ui-triangle-top {
   9                 top: 2px;
  10         }
  11
  12         .ui-ctxpopup-row .ui-triangle-left {
  13                 left: 2px;
  14         }
  15
  16         .ui-ctxpopup-row .ui-triangle-right {
  17                 right: 2px;
  18         }
  19
  20         .ui-ctxpopup-row .ui-triangle-bottom {
  21                 bottom: 2px;
  22         }
  23
  24         .ui-ctxpopup-row {
  25                 display: table-row;
  26
  27                 .ui-ctxpopup-cell {
  28                         display: table-cell;
  29                 }
  30
  31                 .ui-popupwindow-padding {
  32                         background: @color_ctxpopup_background;
  33                         border: none;
  34                         -webkit-box-shadow: 0 * @unit_base 0 * @unit_base 12 * @unit_base rgba( 0, 0, 0, .6 );
  35                         box-shadow: 0 * @unit_base 0 * @unit_base 12 * @unit_base rgba( 0, 0, 0, .6 );
  36                         -webkit-border-radius: @border_radius;
  37                         border-radius: @border_radius;
  38                 }
  39
  40         }
  41
  42     .ui-listview li.ui-btn-up-s, .ui-listview li.ui-btn-hover-s {
  43         background: transparent;
  44     }
  45
  46         .ui-listview li.ui-btn-down-s {
  47                 background: @color_bar_back_btn_press;
  48         }
  49
  50         .ui-listview li:last-child {
  51                 border-bottom-left-radius: @border_radius;
  52                 border-bottom-right-radius: @border_radius;
  53         }
  54
  55         .ui-listview li:first-child {
  56                 border-top-left-radius: @border_radius;
  57                 border-top-right-radius: @border_radius;
  58         }
  59
  60     .ui-listview {
  61                 min-width: 386 * @unit_base;
  62                 max-width: 620 * @unit_base;
  63         border: none;
  64     }
  65
  66         .ui-listview > .ui-li {
  67                 color: @color_ctxpopup_text;
  68                 border-bottom-color: @color_ctxpopup_border_bottom;
  69                 padding: 0 7 * @unit_base;
  70         }
  71
  72         .ui-listview li.ui-btn-up-s > .ui-li > .ui-btn-text > a.ui-link-inherit, .ui-listview li.ui-btn-hover-s > .ui-li > .ui-btn-text > a.ui-link-inherit, .ui-listview li.ui-btn-down-s > .ui-li > .ui-btn-text > a.ui-link-inherit {
  73           color: @color_ctxpopup_text;
  74         }
  75
  76     .ui-listview > .ui-li:last-child {
  77         border: none;
  78     }
  79
  80     .horizontal {
  81                 color: @color_ctxpopup_text;
  82                 max-width: 648 * @unit_base;
  83
  84                 .icon .ui-btn {
  85                         padding: 0;
  86                         background: transparent;
  87
  88                         .ui-btn-icon-only {
  89                                 width: 128 * @unit_base;
  90                                 height: 92 * @unit_base;
  91                                 padding: 0;
  92                         }
  93
  94                         .ui-icon {
  95                                 top: 0;
  96                                 height: inherit;
  97                                 width: inherit;
  98                                 margin: 0;
  99                                 background-position: center;
 100                                 .LESSbackground-size( 48 * @unit_base, 48 * @unit_base );
 101                         }
 102                 }
 103
 104                 .text {
 105                         padding: 0 20 * @unit_base;
 106                         min-width: 128 * @unit_base;
 107                 }
 108
 109
 110         a.ui-link {
 111             color: @color_ctxpopup_text;
 112             text-decoration: none;
 113         }
 114
 115         table {
 116             border: none;
 117             border-spacing: 0;
 118         }
 119
 120         td {
 121                         * {
 122                                 display: -moz-box;
 123                                 -moz-box-pack: center;
 124                                 display: -webkit-box;
 125                                 -webkit-box-pack: center;
 126                                 display: box;
 127                                 box-pack: center;
 128                         }
 129
 130             border-left: 1px solid @color_ctxpopup_border_left;
 131             border-right: 1px solid @color_ctxpopup_border_right;
 132             border-top: 1px solid @color_ctxpopup_border_right;
 133             border-bottom: 1px solid @color_ctxpopup_border_left;
 134         }
 135
 136         td:first-of-type {
 137             border-left: none;
 138         }
 139
 140         td:last-of-type {
 141             border-right: none;
 142         }
 143
 144         tr:first-of-type > td {
 145             border-top: none;
 146         }
 147
 148         tr:last-of-type > td {
 149             border-bottom: none;
 150         }
 151
 152                 tr:first-of-type > td:first-of-type {
 153                         border-top-left-radius: @border_radius;
 154                 }
 155
 156                 tr:first-of-type > td:last-of-type {
 157                         border-top-right-radius: @border_radius;
 158                 }
 159
 160                 tr:last-of-type > td:first-of-type {
 161                         border-bottom-left-radius: @border_radius;
 162                 }
 163
 164                 tr:last-of-type > td:last-of-type {
 165                         border-bottom-right-radius: @border_radius;
 166                 }
 167
 168         ul {
 169             padding: 0;
 170             display: inline-block;
 171             list-style: none;
 172             vertical-align: middle;
 173             margin: 0;
 174         }
 175
 176         li {
 177                         line-height: 92 * @unit_base;
 178                         min-height: 92 * @unit_base;
 179                         min-width: 128 * @unit_base;
 180
 181             float: left;
 182             display: inline-block;
 183             border-left: 1px solid @color_ctxpopup_border_left;
 184             border-right: 1px solid @color_ctxpopup_border_right;
 185             text-align: center;
 186         }
 187
 188                 li:first-of-type {
 189                         border-top-left-radius: @border_radius;
 190                         border-bottom-left-radius: @border_radius;
 191
 192             border-left: none;
 193         }
 194
 195         li:last-of-type {
 196                         border-top-right-radius: @border_radius;
 197                         border-bottom-right-radius: @border_radius;
 198
 199             border-right: none;
 200             margin-right: 0;
 201         }
 202
 203                 li:active, td:active {
 204                         background: @color_bar_back_btn_press;
 205                 }
 206     }
 207
 208     .button {
 209         table .ui-btn {
 210             margin: 8 * @unit_base;
 211             padding: 0;
 212             height: 74 * @unit_base;
 213             width: 172 * @unit_base;
 214         }
 215     }
 216
 217 }