3 <div data-role="page" id="colorwidgets-demo" data-add-back-btn="true">
\r
4 <div data-role="header" data-position="fixed">
\r
5 <h1>Color widgets</h1>
\r
7 <div data-role="content">
\r
8 <div style="padding-right: 20px;">
\r
10 <div>Color title widget</div>
\r
11 <div data-role="colortitle" id="colortitle"></div>
\r
14 <div>Color palette widget</div>
\r
15 <div data-role="colorpalette" id="colorpalette" data-show-preview="true"></div>
\r
18 <div>Color picker button</div>
\r
19 <div data-role="colorpickerbutton" data-inline="true" id="colorpickerbutton-noform"></div>
\r
22 <div>Color picker button (form element)</div>
\r
23 <form action="#" method="get">
\r
24 <div role="fieldcontain">
\r
25 <label for="colorpickerbutton" class="colorpickerbutton_label">Pick Colour:</label>
\r
26 <input type="color" data-inline="true" id="colorpickerbutton" value="#dfddc3"></input>
\r
31 <form action="#" method="get">
\r
32 <div role="fieldcontain">
\r
33 <input type="checkbox" id="checkHideInput" checked></input>
\r
34 <label for="checkHideInput">Hide Input</label>
\r
40 <div data-role="label">Hue-Saturation-Value picker widget</div>
\r
41 <div data-role="hsvpicker" id="hsvpicker"></div>
\r
44 <div data-role="label">Hue-Saturation-Lightness picker widget</div>
\r
45 <div data-role="colorpicker" id="colorpicker"></div>
\r
49 <div data-role="footer"></div>
\r