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