Skip to content
This repository was archived by the owner on Oct 8, 2021. It is now read-only.

Commit edcd958

Browse files
jaspermdegrootjaspermdegroot
committed
Demos: Added external fixed toolbars to panel test pages.
1 parent e454ce1 commit edcd958

File tree

3 files changed

+76
-47
lines changed

3 files changed

+76
-47
lines changed

‎demos/test/panels/index.html‎

Lines changed: 26 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -11,25 +11,29 @@
1111
<script>
1212
$( document ).on( "pagecreate", function() {
1313
$( "body > [data-role='panel']" ).panel();
14-
$( "#outside [data-role='listview']" ).listview();
14+
$( "body > [data-role='panel'] [data-role='listview']" ).listview();
15+
$( "body > [data-role='header']" ).toolbar();
16+
$( "body > [data-role='header'] [data-role='navbar']" ).navbar();
1517
});
1618
</script>
1719
</head>
1820
<body>
21+
22+
<div data-role="header" data-position="fixed" data-theme="a">
23+
<h1>Header index.html</h1>
24+
<a href="#outside" data-icon="bars" data-iconpos="notext">Menu</a>
25+
<a href="#inside-a" data-icon="bars" data-iconpos="notext">Menu</a>
26+
<div data-role="navbar">
27+
<ul>
28+
<li><a href="index.html">Page A</a></li>
29+
<li><a href="page-b.html">Page B</a></li>
30+
<li><a href="page-c.html">Page C</a></li>
31+
</ul>
32+
</div>
33+
</div><!-- /header -->
34+
1935
<div data-role="page" id="a">
2036

21-
<div data-role="header" data-position="fixed">
22-
<h1>Header</h1>
23-
<a href="#outside" data-icon="bars" data-iconpos="notext">Menu</a>
24-
<a href="#inside-a" data-icon="bars" data-iconpos="notext">Menu</a>
25-
<div data-role="navbar">
26-
<ul>
27-
<li><a href="index.html" class="ui-btn-active ui-state-persist">Page A</a></li>
28-
<li><a href="page-b.html">Page B</a></li>
29-
<li><a href="page-c.html">Page C</a></li>
30-
</ul>
31-
</div>
32-
</div><!-- /header -->
3337

3438
<div data-role="content">
3539

@@ -48,7 +52,13 @@ <h2>Page A</h2>
4852
</div>
4953

5054
<div data-role="footer" data-position="fixed">
51-
<h4>Footer</h4>
55+
<div data-role="navbar">
56+
<ul>
57+
<li><a href="index.html" class="ui-btn-active ui-state-persist">Page A</a></li>
58+
<li><a href="page-b.html">Page B</a></li>
59+
<li><a href="page-c.html">Page C</a></li>
60+
</ul>
61+
</div>
5262
</div><!-- /header -->
5363

5464
</div><!-- /page -->
@@ -59,7 +69,8 @@ <h4>Footer</h4>
5969
<li>List item</li>
6070
<li>List item</li>
6171
</ul>
62-
<p>sibling page A</p>
72+
<br><br>
73+
<p>index.html</p>
6374
</div>
6475

6576
</body>

‎demos/test/panels/page-b.html‎

Lines changed: 25 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -11,27 +11,29 @@
1111
<script>
1212
$( document ).on( "pagecreate", function() {
1313
$( "body > [data-role='panel']" ).panel();
14-
$( "#outside [data-role='listview']" ).listview();
14+
$( "body > [data-role='panel'] [data-role='listview']" ).listview();
15+
$( "body > [data-role='header']" ).toolbar();
16+
$( "body > [data-role='header'] [data-role='navbar']" ).navbar();
1517
});
1618
</script>
1719
</head>
1820
<body>
1921

22+
<div data-role="header" data-position="fixed" data-theme="a">
23+
<h1>Header page-b.html</h1>
24+
<a href="#outside" data-icon="bars" data-iconpos="notext">Menu</a>
25+
<a href="#inside-b" data-icon="bars" data-iconpos="notext">Menu</a>
26+
<div data-role="navbar">
27+
<ul>
28+
<li><a href="./">Page A</a></li>
29+
<li><a href="page-b.html">Page B</a></li>
30+
<li><a href="page-c.html">Page C</a></li>
31+
</ul>
32+
</div>
33+
</div><!-- /header -->
34+
2035
<div data-role="page" id="b">
2136

22-
<div data-role="header" data-position="fixed">
23-
<h1>Header</h1>
24-
<a href="#outside" data-icon="bars" data-iconpos="notext">Menu</a>
25-
<a href="#inside-b" data-icon="bars" data-iconpos="notext">Menu</a>
26-
<div data-role="navbar">
27-
<ul>
28-
<li><a href="./">Page A</a></li>
29-
<li><a href="page-b.html" class="ui-btn-active ui-state-persist">Page B</a></li>
30-
<li><a href="page-c.html">Page C</a></li>
31-
</ul>
32-
</div>
33-
</div><!-- /header -->
34-
3537
<div data-role="content">
3638

3739
<h2>Page B</h2>
@@ -49,7 +51,13 @@ <h2>Page B</h2>
4951
</div>
5052

5153
<div data-role="footer" data-position="fixed">
52-
<h4>Footer</h4>
54+
<div data-role="navbar">
55+
<ul>
56+
<li><a href="./">Page A</a></li>
57+
<li><a href="page-b.html" class="ui-btn-active ui-state-persist">Page B</a></li>
58+
<li><a href="page-c.html">Page C</a></li>
59+
</ul>
60+
</div>
5361
</div><!-- /header -->
5462

5563
</div><!-- /page -->
@@ -60,7 +68,8 @@ <h4>Footer</h4>
6068
<li>List item</li>
6169
<li>List item</li>
6270
</ul>
63-
<p>sibling page B</p>
71+
<br><br>
72+
<p>page-b.html</p>
6473
</div>
6574

6675
</body>

‎demos/test/panels/page-c.html‎

Lines changed: 25 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,9 @@
1111
<script>
1212
$( document ).on( "pagecreate", function() {
1313
$( "body > [data-role='panel']" ).panel();
14-
$( "#outside [data-role='listview']" ).listview();
14+
$( "body > [data-role='panel'] [data-role='listview']" ).listview();
15+
$( "body > [data-role='header']" ).toolbar();
16+
$( "body > [data-role='header'] [data-role='navbar']" ).navbar();
1517
});
1618
</script>
1719
</head>
@@ -23,9 +25,23 @@
2325
<li>List item</li>
2426
<li>List item</li>
2527
</ul>
26-
<p>sibling page C</p>
28+
<br><br>
29+
<p>page-c.html</p>
2730
</div>
2831

32+
<div data-role="header" data-position="fixed" data-theme="a">
33+
<h1>Header page-c.html</h1>
34+
<a href="#outside" data-icon="bars" data-iconpos="notext">Menu</a>
35+
<a href="#inside-c" data-icon="bars" data-iconpos="notext">Menu</a>
36+
<div data-role="navbar">
37+
<ul>
38+
<li><a href="./">Page A</a></li>
39+
<li><a href="page-b.html">Page B</a></li>
40+
<li><a href="page-c.html">Page C</a></li>
41+
</ul>
42+
</div>
43+
</div><!-- /header -->
44+
2945
<div data-role="page" id="c">
3046

3147
<div data-role="panel" id="inside-c" data-position="right" data-theme="b">
@@ -36,19 +52,6 @@
3652
</ul>
3753
</div>
3854

39-
<div data-role="header" data-position="fixed">
40-
<h1>Header</h1>
41-
<a href="#outside" data-icon="bars" data-iconpos="notext">Menu</a>
42-
<a href="#inside-c" data-icon="bars" data-iconpos="notext">Menu</a>
43-
<div data-role="navbar">
44-
<ul>
45-
<li><a href="./">Page A</a></li>
46-
<li><a href="page-b.html">Page B</a></li>
47-
<li><a href="page-c.html" class="ui-btn-active ui-state-persists">Page C</a></li>
48-
</ul>
49-
</div>
50-
</div><!-- /header -->
51-
5255
<div data-role="content">
5356

5457
<h2>Page C</h2>
@@ -58,7 +61,13 @@ <h2>Page C</h2>
5861
</div><!-- /content -->
5962

6063
<div data-role="footer" data-position="fixed">
61-
<h4>Footer</h4>
64+
<div data-role="navbar">
65+
<ul>
66+
<li><a href="./">Page A</a></li>
67+
<li><a href="page-b.html">Page B</a></li>
68+
<li><a href="page-c.html" class="ui-btn-active ui-state-persists">Page C</a></li>
69+
</ul>
70+
</div>
6271
</div><!-- /header -->
6372

6473
</div><!-- /page -->

0 commit comments

Comments
 (0)