demos/tizen-winsets/widgets/list/list-normal_no_anchor.html

   1 <div data-role="page" id="genlist-normal" data-add-back-btn="true" data-fit-page-to-window="true">
   2         <div data-role="header" data-position="fixed">
   3                 <h1>Normal lists</h1>
   4         </div>
   5         <div class="content" data-role="content" data-scroll="y">
   6                 <form>
   7                 <ul data-role="listview">
   8
   9                         <li>
  10                                 1line
  11                         </li>
  12
  13                         <li>
  14                                 1line-sub
  15                                 <span class="ui-li-text-sub">subtext</span>
  16                         </li>
  17
  18                         <li>
  19                                 1line-btn1
  20                                 <div data-role="button" data-inline="true">Text Button</div>
  21                         </li>
  22
  23                         <li>
  24                                 1line-btn2
  25                                 <div data-role="button" data-inline="true" data-icon="plus" data-style="circle"></div>
  26                         </li>
  27
  28                         <li>
  29                                 1line-toggle
  30                                 <select name="flip-11" id="flip-11" data-role="slider">
  31                                         <option value="off"></option>
  32                                         <option value="on"></option>
  33                                 </select>
  34                         </li>
  35
  36                         <li>
  37                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
  38                                 1line-bigicon1
  39                         </li>
  40
  41                         <li>
  42                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
  43                                 1line-bigicon2
  44                                 <span class="ui-li-text-sub">Sub text</span>
  45                         </li>
  46
  47                         <li>
  48                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
  49                                 1line-bigicon4
  50                                 <div data-role="button" data-inline="true">Text Button</div>
  51                         </li>
  52
  53                         <li>
  54                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
  55                                 1line-bigicon5
  56                                 <div data-role="button" data-inline="true" data-icon="plus" data-style="circle"></div>
  57                         </li>
  58
  59                         <li>
  60                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
  61                                 1line-bigicon6
  62                                 <select name="flip-11" id="flip-11" data-role="slider">
  63                                         <option value="off"></option>
  64                                         <option value="on"></option>
  65                                 </select>
  66                         </li>
  67
  68                         <li class="ui-li-has-checkbox">
  69                                 <input type="checkbox" name="c1line-check1" />
  70                                 1line-check1
  71                         </li>
  72
  73                         <li class="ui-li-has-checkbox">
  74                                 <input type="checkbox" name="c1line-check2" />
  75                                 1line-check2
  76                                 <div data-role="button" data-inline="true" data-icon="plus" data-style="circle"></div>
  77                         </li>
  78
  79                         <li class="ui-li-has-checkbox">
  80                                 <input type="checkbox"  name="c1line-check3" />
  81                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
  82                                 1line-check3
  83                         </li>
  84
  85                         <li class="ui-li-has-checkbox">
  86                                 <input type="checkbox"  name="c1line-check4" />
  87                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
  88                                 1line-check4
  89                                 <div data-role="button" data-inline="true" data-icon="plus" data-style="circle"></div>
  90                         </li>
  91
  92                         <li class="ui-li-has-radio">
  93                                 <input type="radio" name="1line-radio" />
  94                                 1line-radio1
  95                         </li>
  96
  97                         <li class="ui-li-has-radio">
  98                                 <input type="radio" name="1line-radio" />
  99                                 1line-radio3
 100                                 <div data-role="button" data-inline="true" data-icon="plus" data-style="circle"></div>
 101                         </li>
 102
 103                         <li class="ui-li-has-radio">
 104                                 <input type="radio" name="1line-radio" />
 105                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 106                                 1line-radio4
 107                         </li>
 108
 109                         <li class="ui-li-has-radio">
 110                                 <input type="radio" name="1line-radio" />
 111                                 1line-radio5
 112                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 113                                 <div data-role="button" data-inline="true" data-icon="plus" data-style="circle"></div>
 114                         </li>
 115
 116                         <li class="ui-li-has-radio">
 117                                 <input type="radio" name="1line-radio" />
 118                                 1line-radio
 119                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 120                         </li>
 121
 122                         <li class="ui-li-has-multiline">
 123                                 2line
 124                                 <span class="ui-li-text-sub">Subtext</span>
 125                         </li>
 126
 127                         <li class="ui-li-has-multiline">
 128                                 2line-2sub
 129                                 <span class="ui-li-text-sub">Subtext</span>
 130                                 <span class="ui-li-text-sub2">Subtext2</span>
 131                         </li>
 132
 133                         <li class="ui-li-has-multiline">
 134                                 2line-btn1
 135                                 <span class="ui-li-text-sub">Subtext</span>
 136                                 <div data-role="button" data-inline="true">button</div>
 137                         </li>
 138
 139                         <li class="ui-li-has-multiline">
 140                                 2line-btn1
 141                                 <span class="ui-li-text-sub">Subtext</span>
 142                                 <div data-role="button" data-inline="true" data-icon="call"></div>
 143                         </li>
 144
 145                         <li class="ui-li-has-multiline">
 146                                 2line-btn2
 147                                 <span class="ui-li-text-sub">Subtext</span>
 148                                 <div data-role="button" data-inline="true" data-icon="call" data-style="circle"></div>
 149                         </li>
 150
 151                         <li class="ui-li-has-multiline">
 152                                 2line-star1
 153                                 <span class="ui-li-text-sub">Subtext</span>
 154                                 <span style="position:absolute; right:16px; top:80px"><img class= "ui-li-icon-sub-right" src="00_winset_icon_favorite_on.png"></span>
 155                                 <span class="ui-li-text-sub2">Subtext2</span>
 156                         </li>
 157
 158                         <li class="ui-li-has-multiline">
 159                                 2line-star2
 160                                 <span class="ui-li-text-sub"><img class="ui-li-icon-sub" src="00_winset_icon_favorite_on.png">Subtext</span>
 161                                 <span><img class="ui-li-icon-sub-right" src="00_winset_icon_favorite_on.png"></span>
 162                         </li>
 163
 164                         <li class="ui-li-has-multiline">
 165                                 2line-setting
 166                                 <span class="ui-li-text-sub">Subtext</span>
 167                         </li>
 168
 169                         <li class="ui-li-has-multiline">
 170                                 2line-toggle-setting
 171                                 <span class="ui-li-text-sub">Subtext</span>
 172                                 <select name="flip-11" id="flip-11" data-role="slider">
 173                                         <option value="off"></option>
 174                                         <option value="on"></option>
 175                                 </select>
 176                         </li>
 177
 178                         <li class="ui-li-has-multiline">
 179                                 2line-btn-setting
 180                                 <span class="ui-li-text-sub">Subtext</span>
 181                                 <div data-role="button" data-inline="true" data-icon="call" data-style="circle"></div>
 182                         </li>
 183
 184                         <li class="ui-li-has-multiline">
 185                                 2line-bigicon0
 186                                 <span class="ui-li-text-sub">Subtext<img src="00_winset_icon_favorite_on.png"></span>
 187                                 <div data-role="button" data-inline="true" data-icon="call" data-style="circle"></div>
 188                         </li>
 189
 190                         <li class="ui-li-has-multiline">
 191                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 192                                 2line-bigicon1
 193                                 <span class="ui-li-text-sub">Subtext</span>
 194                         </li>
 195
 196                         <li class="ui-li-has-multiline">
 197                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 198                                 2line-bigicon2
 199                                 <span class="ui-li-text-sub">Subtext</span>
 200                                 <span class="ui-li-text-sub2">Subtext2</span>
 201                         </li>
 202
 203                         <li class="ui-li-has-multiline">
 204                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 205                                 2line-bigicon3
 206                                 <span class="ui-li-text-sub">Subtext</span>
 207                         </li>
 208
 209                         <li class="ui-li-has-multiline">
 210                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 211                                 2line-bigicon4
 212                                 <span class="ui-li-text-sub">Subtext</span>
 213                                 <div data-role="button" data-inline="true" data-icon="call" data-style="circle"></div>
 214                         </li>
 215
 216                         <li class="ui-li-has-checkbox ui-li-has-multiline">
 217                                 <input type="checkbox"  name="c2line-check1" />
 218                                 2line-check
 219                                 <span class="ui-li-text-sub">Subtext</span>
 220                         </li>
 221
 222                         <li class="ui-li-has-checkbox ui-li-has-multiline">
 223                                 <input type="checkbox"  name="c2line-check2" />
 224                                 2line-check2
 225                                 <span class="ui-li-text-sub">Subtext</span>
 226                                 <div data-role="button" data-inline="true" data-icon="call" data-style="circle"></div>
 227                         </li>
 228
 229                         <li class="ui-li-has-checkbox ui-li-has-multiline">
 230                                 <input type="checkbox"  name="c2line-check3" />
 231                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 232                                 2line-check3
 233                                 <span class="ui-li-text-sub">Subtext</span>
 234                         </li>
 235
 236                         <li class="ui-li-has-radio ui-li-has-multiline">
 237                                 <input type="radio" name="2line-radio" />
 238                                 2line-radio1
 239                                 <span class="ui-li-text-sub">Subtext</span>
 240                         </li>
 241
 242                         <li class="ui-li-has-radio ui-li-has-multiline">
 243                                 <input type="radio" name="2line-radio" />
 244                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 245                                 2line-radio2
 246                                 <span class="ui-li-text-sub">Subtext</span>
 247                         </li>
 248
 249                         <li class="ui-li-has-multiline">
 250                                 <span class="ui-li-color-bar"></span>
 251                                 2line-colorbar1
 252                                 <span class="ui-li-text-sub">Subtext
 253                                         <img src="00_winset_icon_favorite_on.png">
 254                                         <img src="00_winset_icon_favorite_on.png">
 255                                         <img src="00_winset_icon_favorite_on.png">
 256                                 </span>
 257                                 <div data-role="button" data-inline="true">button</div>
 258                         </li>
 259
 260                         <li class="ui-li-has-multiline">
 261                                 <span class="ui-li-color-bar" style="background-color:rgba(72, 136, 42, 1);"></span>
 262                                 2line-colorbar2
 263                                 <span><img class="ui-li-icon-sub" src="00_winset_icon_favorite_on.png"></span>
 264                                 <span class="ui-li-text-sub">Subtext</span>
 265                                 <div data-role="button" data-inline="true">button</div>
 266                         </li>
 267
 268                         <li class="ui-li-has-multiline">
 269                                 <span class="ui-li-color-bar" style="background-color:rgba(204, 52, 52, 1);"></span>
 270                                 2line-colorbar2
 271                                 <span><img class="ui-li-icon-sub" src="00_winset_icon_favorite_on.png"></span>
 272                                 <span class="ui-li-text-sub">Subtext</span>
 273                                 <div data-role="button" data-inline="true" data-icon="call"></div>
 274                         </li>
 275
 276                         <li class="ui-li-has-multiline">
 277                                 <span class="ui-li-color-bar" style="background-color:rgba(72, 136, 42, 1);"></span>
 278                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 279                                 2line-colorbar3
 280                                 <span class="ui-li-text-sub">Subtext</span>
 281                                 <div data-role="button" data-inline="true" data-icon="call" data-style="circle"></div>
 282                         </li>
 283
 284                         <li class="ui-li-has-multiline">
 285                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 286                                 2line-bigicon8
 287                                 <span class="ui-li-text-sub">Subtext</span>
 288                                 <img src="00_winset_icon_favorite_on.png" class="ui-li-icon-sub">
 289                         </li>
 290
 291                         <li class="ui-li-has-multiline ui-li-thumbnail-right">
 292                                 2line-thumb1
 293                                 <span class="ui-li-text-sub">Subtext</span>
 294                                 <img src="large_thumbnail.jpg" class="ui-li-bigicon">
 295                         </li>
 296
 297                         <li class="ui-li-has-multiline ui-li-thumbnail-right">
 298                                 2line-thumb2
 299                                 <span><img class="ui-li-icon-sub" src="00_winset_icon_favorite_on.png"></span>
 300                                 <span class="ui-li-text-sub"><img class="ui-li-icon-sub" src="00_winset_icon_favorite_on.png">Subtext</span>
 301                                 <img src="large_thumbnail.jpg" class="ui-li-bigicon">
 302                         </li>
 303
 304                         <li class="ui-li-has-multiline ui-li-thumbnail-right">
 305                                 <span class="ui-li-text-sub">Subtext</span>
 306                                 2line-sub-main-bigicon1
 307                                 <img src="large_thumbnail.jpg" class="ui-li-bigicon">
 308                         </li>
 309
 310                         <li class="ui-li-has-multiline">
 311                                 2line-bigicon-pgbar1
 312                                 <div data-role="progressbar" id="progressbar"></div>
 313                         </li>
 314
 315                         <li class="ui-li-has-multiline">
 316                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 317                                 Short Progress
 318                                 <div data-role="progressbar" id="progressbar"></div>
 319                                 <div data-role="button" data-inline="true">Stop</div>
 320                         </li>
 321
 322                         <li class="ui-li-has-checkbox ui-li-has-multiline">
 323                                 <input type="checkbox"  name="c2line-icon-bigicon-btn" />
 324                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 325                                 2line-3items
 326                                 <span class="ui-li-text-sub">Subtext</span>
 327                                 <div data-role="button" data-inline="true" data-icon="call" data-style="circle"></div>
 328                         </li>
 329
 330                         <li class="ui-li-has-multiline">
 331                                 2line-thumb3
 332                                 <span><img class="ui-li-icon-sub" src="00_winset_icon_favorite_on.png"></span>
 333                                 <span class="ui-li-text-sub">Subtext</span>
 334                                 <img src="thumbnail.jpg" class="ui-li-bigicon">
 335                         </li>
 336                 </ul>
 337                 </form>
 338         </div>
 339         <div data-role="footer">
 340         </div>
 341 </div>