javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-22 13:32:54 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(page): removes ion-page wc

Browse Source
This commit is contained in:
Manu Mtz.-Almeida
2018-02-28 15:05:20 +01:00
parent c3362fecd5
commit eb7cbe9f04
121 changed files with 330 additions and 465 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/core/scripts/test-components/src/components/page-one/page-one.tsx
View File

@ -7,17 +7,15 @@ export class PageOne {
render() { render() {
return [ return [
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page One</ion-title> <ion-title>Page One</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>,
<ion-content> <ion-content>
page one page one
<a href='#/two/second-page'>Ir a la page 2</a> <a href='#/two/second-page'>Ir a la page 2</a>
</ion-content> </ion-content>
</ion-page>
]; ];
} }
} }

4
packages/core/scripts/test-components/src/components/page-two/page-two.tsx
View File

@ -7,16 +7,14 @@ export class PageTwo {
render() { render() {
return [ return [
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page Two</ion-title> <ion-title>Page Two</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>,
<ion-content> <ion-content>
this is page two this is page two
</ion-content> </ion-content>
</ion-page>
]; ];
} }
} }

4
packages/core/scripts/test-components/src/components/tab-one/tab-one.tsx
View File

@ -7,16 +7,14 @@ export class TabOne {
render() { render() {
return [ return [
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page One</ion-title> <ion-title>Page One</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>,
<ion-content> <ion-content>
tab one tab one
</ion-content> </ion-content>
</ion-page>
]; ];
} }
} }

4
packages/core/scripts/test-components/src/components/tab-three/tab-three.tsx
View File

@ -7,16 +7,14 @@ export class TabThree {
render() { render() {
return [ return [
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Tab 3</ion-title> <ion-title>Tab 3</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>,
<ion-content> <ion-content>
tab three tab three
</ion-content> </ion-content>
</ion-page>
]; ];
} }
} }

4
packages/core/scripts/test-components/src/components/tab-two/tab-two.tsx
View File

@ -7,16 +7,14 @@ export class TabTwo {
render() { render() {
return [ return [
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Tab two (2)</ion-title> <ion-title>Tab two (2)</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>,
<ion-content> <ion-content>
<ion-nav></ion-nav> <ion-nav></ion-nav>
</ion-content> </ion-content>
</ion-page>
]; ];
} }
} }

30
packages/core/src/components.d.ts vendored
View File

@ -2081,36 +2081,6 @@ declare global {
} }
import {
Page as IonPage
} from './components/page/page';
declare global {
interface HTMLIonPageElement extends IonPage, HTMLStencilElement {
}
var HTMLIonPageElement: {
prototype: HTMLIonPageElement;
new (): HTMLIonPageElement;
};
interface HTMLElementTagNameMap {
"ion-page": HTMLIonPageElement;
}
interface ElementTagNameMap {
"ion-page": HTMLIonPageElement;
}
namespace JSX {
interface IntrinsicElements {
"ion-page": JSXElements.IonPageAttributes;
}
}
namespace JSXElements {
export interface IonPageAttributes extends HTMLAttributes {
}
}
}
import { import {
PickerColumnCmp as IonPickerColumn PickerColumnCmp as IonPickerColumn
} from './components/picker-column/picker-column'; } from './components/picker-column/picker-column';

3
packages/core/src/components/action-sheet/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Action Sheet - Basic</ion-title> <ion-title>Action Sheet - Basic</ion-title>
@ -31,7 +31,6 @@
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/action-sheet/test/translucent/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Action Sheet - Translucent</ion-title> <ion-title>Action Sheet - Translucent</ion-title>
@ -41,7 +41,7 @@
</ion-row> </ion-row>
</ion-grid> </ion-grid>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/alert/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Alert - Basic</ion-title> <ion-title>Alert - Basic</ion-title>
@ -30,7 +30,7 @@
<ion-button id="checkbox" expand="block" onclick="presentAlertCheckbox()">Checkbox</ion-button> <ion-button id="checkbox" expand="block" onclick="presentAlertCheckbox()">Checkbox</ion-button>
<ion-button expand="block" onclick="presentWithCssClass()">CssClass</ion-button> <ion-button expand="block" onclick="presentWithCssClass()">CssClass</ion-button>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/alert/test/translucent/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Alert - Translucent</ion-title> <ion-title>Alert - Translucent</ion-title>
@ -44,7 +44,7 @@
<ion-button expand="block" color="secondary" onclick="presentAlertRadio()">Radio</ion-button> <ion-button expand="block" color="secondary" onclick="presentAlertRadio()">Radio</ion-button>
<ion-button expand="block" color="danger" onclick="presentAlertCheckbox()">Checkbox</ion-button> <ion-button expand="block" color="danger" onclick="presentAlertCheckbox()">Checkbox</ion-button>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

15
packages/core/src/components/app/app.scss
View File

@ -150,23 +150,10 @@ sub {
bottom: -.25em; bottom: -.25em;
} }
ion-app {
@include position(0);
position: absolute;
z-index: $z-index-page-container;
width: 100%;
height: 100%;
contain: layout size style;
}
// Page Container Structure // Page Container Structure
// -------------------------------------------------- // --------------------------------------------------
ion-app,
.ion-page { .ion-page {
@include position(0); @include position(0);

4
packages/core/src/components/avatar/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Avatar - Basic</ion-title> <ion-title>Avatar - Basic</ion-title>
@ -36,7 +36,7 @@
<ion-label>Item Avatar</ion-label> <ion-label>Item Avatar</ion-label>
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>

6
packages/core/src/components/back-button/readme.md
View File

@ -4,7 +4,6 @@ A back button is a component that allows you navigate back into app history. To
add a back button to your view, all you need is: add a back button to your view, all you need is:
```html ```html
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -12,7 +11,6 @@ add a back button to your view, all you need is:
</ion-buttons> </ion-buttons>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>
</ion-page>
``` ```
The back button component is smart enough to know what to render and what content to show. The back button component is smart enough to know what to render and what content to show.
@ -20,7 +18,6 @@ The back button component is smart enough to know what to render and what conten
If, however, you want more control over what is shown in the back button, you can pass your own button markup. If, however, you want more control over what is shown in the back button, you can pass your own button markup.
```html ```html
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -33,14 +30,12 @@ If, however, you want more control over what is shown in the back button, you ca
</ion-buttons> </ion-buttons>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>
</ion-page>
``` ```
Or no button text at all: Or no button text at all:
```html ```html
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -52,7 +47,6 @@ Or no button text at all:
</ion-buttons> </ion-buttons>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>
</ion-page>
``` ```

6
packages/core/src/components/back-button/test/basic/index.html
View File

@ -17,7 +17,7 @@
async function loadFirstPage() { async function loadFirstPage() {
const nav = document.querySelector('ion-nav'); const nav = document.querySelector('ion-nav');
await nav.componentOnReady(); await nav.componentOnReady();
const firstPage = document.createElement('ion-page'); const firstPage = document.createElement('div');
firstPage.classList.add('first-page'); firstPage.classList.add('first-page');
firstPage.innerHTML = ` firstPage.innerHTML = `
<ion-header> <ion-header>
@ -44,7 +44,7 @@
} }
async function goToPageTwo(nav) { async function goToPageTwo(nav) {
const secondPage = document.createElement('ion-page'); const firstPage = document.createElement('div');
secondPage.classList.add('second-page'); secondPage.classList.add('second-page');
secondPage.innerHTML = ` secondPage.innerHTML = `
<ion-header> <ion-header>
@ -72,7 +72,7 @@
} }
async function goToPageThree(nav) { async function goToPageThree(nav) {
const thirdPage = document.createElement('ion-page'); const thirdPage = document.createElement('div');
thirdPage.classList.add('third-page'); thirdPage.classList.add('third-page');
thirdPage.innerHTML = ` thirdPage.innerHTML = `
<ion-header> <ion-header>

12
packages/core/src/components/back-button/test/host-element/index.html
View File

@ -9,7 +9,7 @@
class PageOne extends HTMLElement { class PageOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -24,7 +24,6 @@
<ion-button class="next">Go to Page Two</ion-button> <ion-button class="next">Go to Page Two</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -32,7 +31,7 @@
class PageTwo extends HTMLElement { class PageTwo extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -49,7 +48,6 @@
</ion-nav-push> </ion-nav-push>
</div> </div>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -57,7 +55,7 @@
class PageThree extends HTMLElement { class PageThree extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -74,7 +72,6 @@
</ion-nav-push> </ion-nav-push>
</div> </div>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -82,7 +79,7 @@
class PageFour extends HTMLElement { class PageFour extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -94,7 +91,6 @@
<ion-content padding> <ion-content padding>
<h1>Page Four</h1> <h1>Page Four</h1>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }

4
packages/core/src/components/badge/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Badge - Basic</ion-title> <ion-title>Badge - Basic</ion-title>
@ -111,7 +111,7 @@
</ion-list> </ion-list>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/button/test/anchor/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button - Anchor</ion-title> <ion-title>Button - Anchor</ion-title>
@ -61,7 +61,7 @@
<ion-button href="#" color="secondary" disabled>Secondary Disabled</ion-button> <ion-button href="#" color="secondary" disabled>Secondary Disabled</ion-button>
</p> </p>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/button/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button - Basic</ion-title> <ion-title>Button - Basic</ion-title>
@ -77,7 +77,7 @@
</p> </p>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/button/test/expand/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button - Expand</ion-title> <ion-title>Button - Expand</ion-title>
@ -41,7 +41,7 @@
<ion-button expand="full" round>Full + Round</ion-button> <ion-button expand="full" round>Full + Round</ion-button>
</p> </p>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/button/test/fill/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button - Fill</ion-title> <ion-title>Button - Fill</ion-title>
@ -124,7 +124,7 @@
<ion-button fill="clear" color="secondary" disabled>Secondary Disabled</ion-button> <ion-button fill="clear" color="secondary" disabled>Secondary Disabled</ion-button>
</p> </p>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/button/test/icon/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button - Icon</ion-title> <ion-title>Button - Icon</ion-title>
@ -119,7 +119,7 @@
</ion-button> </ion-button>
</p> </p>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/button/test/round/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button - Round</ion-title> <ion-title>Button - Round</ion-title>
@ -43,7 +43,7 @@
<ion-button round expand="full" color="dark">Full</ion-button> <ion-button round expand="full" color="dark">Full</ion-button>
<ion-button round strong>Strong</ion-button> <ion-button round strong>Strong</ion-button>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<style> <style>

4
packages/core/src/components/button/test/size/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button - Size</ion-title> <ion-title>Button - Size</ion-title>
@ -51,7 +51,7 @@
<ion-button size="large" fill="clear" href="#">Large</ion-button> <ion-button size="large" fill="clear" href="#">Large</ion-button>
</p> </p>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/button/test/strong/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button - Strong</ion-title> <ion-title>Button - Strong</ion-title>
@ -23,7 +23,7 @@
<p><ion-button strong expand="full" color="dark">Full</ion-button></p> <p><ion-button strong expand="full" color="dark">Full</ion-button></p>
<p><ion-button strong round>Strong</ion-button></p> <p><ion-button strong round>Strong</ion-button></p>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/button/test/toolbar/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button - Toolbar</ion-title> <ion-title>Button - Toolbar</ion-title>
@ -250,7 +250,7 @@
</ion-segment> </ion-segment>
</ion-toolbar> </ion-toolbar>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/buttons/test/icon/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button - Basic</ion-title> <ion-title>Button - Basic</ion-title>
@ -25,7 +25,7 @@
<ion-content padding no-bounce text-center> <ion-content padding no-bounce text-center>
Content Content
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/card/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Card - Basic</ion-title> <ion-title>Card - Basic</ion-title>
@ -64,7 +64,7 @@
</ion-item> </ion-item>
</ion-card> </ion-card>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<style> <style>
.content { .content {

4
packages/core/src/components/card/test/translucent/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Card - Basic</ion-title> <ion-title>Card - Basic</ion-title>
@ -238,7 +238,7 @@
</ion-card> </ion-card>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>

4
packages/core/src/components/checkbox/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Checkbox - Basic</ion-title> <ion-title>Checkbox - Basic</ion-title>
@ -76,7 +76,7 @@
<ion-checkbox disabled></ion-checkbox> <ion-checkbox disabled></ion-checkbox>
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

3
packages/core/src/components/chip/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Chip - Basic</ion-title> <ion-title>Chip - Basic</ion-title>
@ -119,7 +119,6 @@
</ion-chip> </ion-chip>
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
<script> <script>
function del(chip) { function del(chip) {

3
packages/core/src/components/content/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header id="header"> <ion-header id="header">
<ion-toolbar style="display: none" id="toolbar2"> <ion-toolbar style="display: none" id="toolbar2">
<ion-title>Hidden Toolbar</ion-title> <ion-title>Hidden Toolbar</ion-title>
@ -67,7 +67,6 @@
<ion-title>Footer</ion-title> <ion-title>Footer</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-footer> </ion-footer>
</ion-page>
<script> <script>
function toggleFullscreen() { function toggleFullscreen() {

3
packages/core/src/components/datetime/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Datetime - Basic</ion-title> <ion-title>Datetime - Basic</ion-title>
@ -121,7 +121,6 @@
</ion-list> </ion-list>
</ion-content> </ion-content>
</ion-page>
<script> <script>
var yearValuesArray = [2020, 2016, 2008, 2004, 2000, 1996]; var yearValuesArray = [2020, 2016, 2008, 2004, 2000, 1996];

4
packages/core/src/components/events/test/basic/index.html
View File

@ -11,7 +11,7 @@
<body onload="runTest()"> <body onload="runTest()">
<ion-events></ion-events> <ion-events></ion-events>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Events</ion-title> <ion-title>Events</ion-title>
@ -31,7 +31,7 @@
<ion-button class="publish">Publish the data</ion-button> <ion-button class="publish">Publish the data</ion-button>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

3
packages/core/src/components/fab/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Floating Action Button - Basic</ion-title> <ion-title>Floating Action Button - Basic</ion-title>
@ -92,7 +92,6 @@
<ion-title>Footer</ion-title> <ion-title>Footer</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-footer> </ion-footer>
</ion-page>
<script> <script>
function insertAfter(el, referenceNode) { function insertAfter(el, referenceNode) {

3
packages/core/src/components/fab/test/translucent/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Floating Action Button - Translucent</ion-title> <ion-title>Floating Action Button - Translucent</ion-title>
@ -98,7 +98,6 @@
<ion-title>Footer</ion-title> <ion-title>Footer</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-footer> </ion-footer>
</ion-page>
<script> <script>
function insertAfter(el, referenceNode) { function insertAfter(el, referenceNode) {

3
packages/core/src/components/grid/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Grid - Basic</ion-title> <ion-title>Grid - Basic</ion-title>
@ -265,7 +265,6 @@
</ion-grid> </ion-grid>
</ion-content> </ion-content>
</ion-page>
<style> <style>
.grid-demo ion-col div { .grid-demo ion-col div {

4
packages/core/src/components/hide-when/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Hide when - Basic</ion-title> <ion-title>Hide when - Basic</ion-title>
@ -94,7 +94,7 @@
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/icon/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Icon - Basic</ion-title> <ion-title>Icon - Basic</ion-title>
@ -179,7 +179,7 @@
font-size: 0.8em; font-size: 0.8em;
} }
</style> </style>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/icon/test/items/index.html
View File

@ -16,7 +16,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Icon - Items</ion-title> <ion-title>Icon - Items</ion-title>
@ -166,7 +166,7 @@
</script> </script>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>

4
packages/core/src/components/infinite-scroll/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
@ -36,7 +36,7 @@
</ion-infinite-scroll> </ion-infinite-scroll>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>

3
packages/core/src/components/input/test/attributes/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Input - Attributes</ion-title> <ion-title>Input - Attributes</ion-title>
@ -78,7 +78,6 @@
</ion-list> </ion-list>
</ion-content> </ion-content>
</ion-page>
<script> <script>
var numberInput = checkInput('input1'); var numberInput = checkInput('input1');

3
packages/core/src/components/input/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Input - Basic</ion-title> <ion-title>Input - Basic</ion-title>
@ -93,7 +93,6 @@
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
<script> <script>
function toggleBoolean(id, prop) { function toggleBoolean(id, prop) {

4
packages/core/src/components/item-sliding/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item Sliding - Basic</ion-title> <ion-title>Item Sliding - Basic</ion-title>
@ -422,7 +422,7 @@
} }
</style> </style>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/item/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item - Basic</ion-title> <ion-title>Item - Basic</ion-title>
@ -109,7 +109,7 @@
<ion-title>Footer</ion-title> <ion-title>Footer</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-footer> </ion-footer>
</ion-page>
</ion-app> </ion-app>
</body> </body>

4
packages/core/src/components/item/test/buttons/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Items as Links/Buttons</ion-title> <ion-title>Items as Links/Buttons</ion-title>
@ -132,7 +132,7 @@
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/item/test/colors/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item Colors</ion-title> <ion-title>Item Colors</ion-title>
@ -109,7 +109,7 @@
</ion-item> </ion-item>
</ion-list> </ion-list>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/item/test/dividers/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item Divider</ion-title> <ion-title>Item Divider</ion-title>
@ -145,7 +145,7 @@
height: 100px; height: 100px;
} }
</style> </style>
</ion-page>
</ion-app> </ion-app>
</body> </body>

4
packages/core/src/components/item/test/groups/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item Groups</ion-title> <ion-title>Item Groups</ion-title>
@ -27,7 +27,7 @@
<!-- list loaded from data --> <!-- list loaded from data -->
</ion-list> </ion-list>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>

4
packages/core/src/components/item/test/icons/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item Icons</ion-title> <ion-title>Item Icons</ion-title>
@ -109,7 +109,7 @@
<ion-badge slot="end">99</ion-badge> <ion-badge slot="end">99</ion-badge>
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/item/test/images/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item Images</ion-title> <ion-title>Item Images</ion-title>
@ -90,7 +90,7 @@
</ion-label> </ion-label>
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<style> <style>

4
packages/core/src/components/item/test/inputs/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item inputs</ion-title> <ion-title>Item inputs</ion-title>
@ -81,7 +81,7 @@
</ion-item> </ion-item>
</ion-list> </ion-list>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/item/test/media/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item Media</ion-title> <ion-title>Item Media</ion-title>
@ -89,7 +89,7 @@
<ion-icon name="close-circle" slot="end"></ion-icon> <ion-icon name="close-circle" slot="end"></ion-icon>
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/item/test/reorder/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar color="primary"> <ion-toolbar color="primary">
<ion-title>Item Reorder</ion-title> <ion-title>Item Reorder</ion-title>
@ -34,7 +34,7 @@
<ion-reorder-group id="endGroup"></ion-reorder-group> <ion-reorder-group id="endGroup"></ion-reorder-group>
</ion-list> </ion-list>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<style> <style>

4
packages/core/src/components/item/test/sliding/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item Sliding - Basic</ion-title> <ion-title>Item Sliding - Basic</ion-title>
@ -405,7 +405,7 @@
} }
</style> </style>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/item/test/text/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Item Text</ion-title> <ion-title>Item Text</ion-title>
@ -113,7 +113,7 @@
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>

4
packages/core/src/components/label/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Label - Basic</ion-title> <ion-title>Label - Basic</ion-title>
@ -46,7 +46,7 @@
} }
</style> </style>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/list/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>List - Basic</ion-title> <ion-title>List - Basic</ion-title>
@ -38,7 +38,7 @@
</ion-list> </ion-list>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>
</html> </html>

4
packages/core/src/components/loading/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Loading - Basic</ion-title> <ion-title>Loading - Basic</ion-title>
@ -57,7 +57,7 @@
</ion-row> </ion-row>
</ion-grid> </ion-grid>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>
async function presentLoading() { async function presentLoading() {

4
packages/core/src/components/menu-toggle/test/basic/index.html
View File

@ -55,7 +55,7 @@
</ion-content> </ion-content>
</ion-menu> </ion-menu>
<ion-page main> <div class="ion-page" main>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
@ -81,7 +81,7 @@
<ion-button onclick="openRight()">Menu Button Will Open Right</ion-button> <ion-button onclick="openRight()">Menu Button Will Open Right</ion-button>
</div> </div>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<ion-menu-controller></ion-menu-controller> <ion-menu-controller></ion-menu-controller>

5
packages/core/src/components/menu-toggle/test/button/index.html
View File

@ -43,7 +43,7 @@
</ion-menu> </ion-menu>
<ion-page main> <div class="ion-page" main>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
@ -56,7 +56,8 @@
<ion-button>Toggle Menu</ion-button> <ion-button>Toggle Menu</ion-button>
</ion-menu-toggle> </ion-menu-toggle>
</ion-content> </ion-content>
</ion-page>
</div>
</ion-app> </ion-app>
<ion-menu-controller></ion-menu-controller> <ion-menu-controller></ion-menu-controller>

5
packages/core/src/components/menu-toggle/test/list/index.html
View File

@ -30,7 +30,7 @@
</ion-menu> </ion-menu>
<ion-page main> <div class="ion-page" main>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
@ -233,8 +233,7 @@
</ion-item> </ion-item>
</ion-menu-toggle> </ion-menu-toggle>
</ion-content> </ion-content>
</ion-page> </div>
</ion-app> </ion-app>
<ion-menu-controller></ion-menu-controller> <ion-menu-controller></ion-menu-controller>
</body> </body>

4
packages/core/src/components/menu/test/basic/index.html
View File

@ -64,7 +64,7 @@
</ion-content> </ion-content>
</ion-menu> </ion-menu>
<ion-page main> <div class="ion-page" main>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
@ -94,7 +94,7 @@
</ion-content> </ion-content>
</ion-page> </div>
</ion-app> </ion-app>
<ion-menu-controller></ion-menu-controller> <ion-menu-controller></ion-menu-controller>

5
packages/core/src/components/menu/test/standalone/index.html
View File

@ -41,7 +41,7 @@
</ion-menu> </ion-menu>
<ion-page main> <div class="ion-page" main>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
@ -62,8 +62,7 @@
<button onclick="setEnabled()">Set Swipe Enabled False</button> <button onclick="setEnabled()">Set Swipe Enabled False</button>
</p> </p>
</ion-content> </ion-content>
</div>
</ion-page>
<style> <style>
body { body {

2
packages/core/src/components/modal-controller/readme.md
View File

@ -10,7 +10,7 @@ async function presentModal() {
await modalController.componentOnReady(); await modalController.componentOnReady();
// create component to open // create component to open
const element = document.createElement('ion-page'); const element = document.createElement('div');
element.innerHTML = ` element.innerHTML = `
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>

2
packages/core/src/components/modal/readme.md
View File

@ -15,7 +15,7 @@ async function presentModal() {
await modalController.componentOnReady(); await modalController.componentOnReady();
// create component to open // create component to open
const element = document.createElement('ion-page'); const element = document.createElement('div');
element.innerHTML = ` element.innerHTML = `
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>

6
packages/core/src/components/modal/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Modal - Basic</ion-title> <ion-title>Modal - Basic</ion-title>
@ -23,7 +23,7 @@
<ion-button id="presentModal" class="e2ePresentModal" onclick="presentModal()">Present modal</ion-button> <ion-button id="presentModal" class="e2ePresentModal" onclick="presentModal()">Present modal</ion-button>
</p> </p>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>
@ -36,7 +36,7 @@
await modalController.componentOnReady(); await modalController.componentOnReady();
// create component to open // create component to open
const element = document.createElement('ion-page'); const element = document.createElement('div');
element.innerHTML = ` element.innerHTML = `
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>

9
packages/core/src/components/modal/test/host-elements/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Modal - Host Elements</ion-title> <ion-title>Modal - Host Elements</ion-title>
@ -23,7 +23,7 @@
<ion-button class="e2ePresentModal" onclick="presentModal()">Present modal</ion-button> <ion-button class="e2ePresentModal" onclick="presentModal()">Present modal</ion-button>
</p> </p>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>
@ -33,7 +33,7 @@
class ModalPage extends HTMLElement { class ModalPage extends HTMLElement {
async connectedCallback() { async connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Super Modal</ion-title> <ion-title>Super Modal</ion-title>
@ -43,8 +43,7 @@
<h1>Content of doom</h1> <h1>Content of doom</h1>
<div>Here's some more content</div> <div>Here's some more content</div>
<ion-button class="dismiss">Dismiss Modal</ion-button> <ion-button class="dismiss">Dismiss Modal</ion-button>
</ion-content> </ion-content>`;
</ion-page>`;
// listen for close event // listen for close event
const button = this.querySelector('ion-button'); const button = this.querySelector('ion-button');

6
packages/core/src/components/nav-pop/test/basic/index.html
View File

@ -30,7 +30,7 @@
async function loadFirstPage() { async function loadFirstPage() {
const nav = document.querySelector('ion-nav'); const nav = document.querySelector('ion-nav');
await nav.componentOnReady(); await nav.componentOnReady();
const firstPage = document.createElement('ion-page'); const firstPage = document.createElement('div');
firstPage.classList.add('first-page'); firstPage.classList.add('first-page');
firstPage.innerHTML = ` firstPage.innerHTML = `
<ion-header> <ion-header>
@ -54,7 +54,7 @@
} }
async function goToPageTwo(nav) { async function goToPageTwo(nav) {
const secondPage = document.createElement('ion-page'); const secondPage = document.createElement('div');
secondPage.classList.add('second-page'); secondPage.classList.add('second-page');
secondPage.innerHTML = ` secondPage.innerHTML = `
<ion-header> <ion-header>
@ -81,7 +81,7 @@
} }
async function goToPageThree(nav) { async function goToPageThree(nav) {
const thirdPage = document.createElement('ion-page'); const thirdPage = document.createElement('div');
thirdPage.classList.add('third-page'); thirdPage.classList.add('third-page');
thirdPage.innerHTML = ` thirdPage.innerHTML = `
<ion-header> <ion-header>

9
packages/core/src/components/nav-push/test/basic/index.html
View File

@ -30,7 +30,7 @@
class FirstPage extends HTMLElement { class FirstPage extends HTMLElement {
async connectedCallback() { async connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page One</ion-title> <ion-title>Page One</ion-title>
@ -42,7 +42,6 @@
<ion-button class="next">Go to Page Two</ion-button> <ion-button class="next">Go to Page Two</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -50,7 +49,7 @@
class SecondPage extends HTMLElement { class SecondPage extends HTMLElement {
async connectedCallback() { async connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page Two</ion-title> <ion-title>Page Two</ion-title>
@ -65,7 +64,6 @@
<ion-button class="back">Go Back</ion-button> <ion-button class="back">Go Back</ion-button>
</ion-nav-pop> </ion-nav-pop>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -73,7 +71,7 @@
class ThirdPage extends HTMLElement { class ThirdPage extends HTMLElement {
async connectedCallback() { async connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page Three</ion-title> <ion-title>Page Three</ion-title>
@ -85,7 +83,6 @@
<ion-button class="back">Go Back</ion-button> <ion-button class="back">Go Back</ion-button>
</ion-nav-pop> </ion-nav-pop>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }

8
packages/core/src/components/nav-set-root/test/basic/index.html
View File

@ -17,7 +17,7 @@
class FirstPage extends HTMLElement { class FirstPage extends HTMLElement {
async connectedCallback() { async connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page One</ion-title> <ion-title>Page One</ion-title>
@ -29,7 +29,6 @@
<ion-button class="next">Go to Page Two</ion-button> <ion-button class="next">Go to Page Two</ion-button>
</ion-nav-set-root> </ion-nav-set-root>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -37,7 +36,7 @@
class SecondPage extends HTMLElement { class SecondPage extends HTMLElement {
async connectedCallback() { async connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page Two</ion-title> <ion-title>Page Two</ion-title>
@ -49,7 +48,6 @@
<ion-button class="next">Go to Page Three</ion-button> <ion-button class="next">Go to Page Three</ion-button>
</ion-nav-set-root> </ion-nav-set-root>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -57,7 +55,6 @@
class ThirdPage extends HTMLElement { class ThirdPage extends HTMLElement {
async connectedCallback() { async connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page Three</ion-title> <ion-title>Page Three</ion-title>
@ -66,7 +63,6 @@
<ion-content padding> <ion-content padding>
<h1>Page Three</h1> <h1>Page Three</h1>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }

1
packages/core/src/components/nav/nav.tsx
View File

@ -985,6 +985,7 @@ export function attachViewToDom(nav: Nav, enteringView: ViewController, ti: Tran
return ti.delegate.attachViewToDom(nav.element, enteringView.component, enteringView.data, [], ti.escapeHatch).then((mountingData) => { return ti.delegate.attachViewToDom(nav.element, enteringView.component, enteringView.data, [], ti.escapeHatch).then((mountingData) => {
ti.mountingData = mountingData; ti.mountingData = mountingData;
Object.assign(enteringView, mountingData); Object.assign(enteringView, mountingData);
mountingData.element.classList.add('ion-page');
enteringView.state = STATE_ATTACHED; enteringView.state = STATE_ATTACHED;
}) })
// implicit returns FTW // implicit returns FTW

9
packages/core/src/components/nav/test/basic/index.html
View File

@ -9,7 +9,7 @@
class PageOne extends HTMLElement { class PageOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page One</ion-title> <ion-title>Page One</ion-title>
@ -21,7 +21,6 @@
<ion-button class="next">Go to Page Two</ion-button> <ion-button class="next">Go to Page Two</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -29,7 +28,7 @@
class PageTwo extends HTMLElement { class PageTwo extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -47,7 +46,6 @@
</div> </div>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -55,7 +53,7 @@
class PageThree extends HTMLElement { class PageThree extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -67,7 +65,6 @@
<ion-content padding> <ion-content padding>
<h1>Page Three</h1> <h1>Page Three</h1>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }

15
packages/core/src/components/nav/test/host-elements/index.html
View File

@ -17,7 +17,7 @@
class PageOne extends HTMLElement { class PageOne extends HTMLElement {
async connectedCallback() { async connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page One</ion-title> <ion-title>Page One</ion-title>
@ -26,8 +26,7 @@
<ion-content padding> <ion-content padding>
<h1>Page One</h1> <h1>Page One</h1>
<ion-button class="next">Go to Page Two</ion-button> <ion-button class="next">Go to Page Two</ion-button>
</ion-content> </ion-content>`;
</ion-page>`;
const button = this.querySelector('ion-button'); const button = this.querySelector('ion-button');
button.addEventListener('click', async () => { button.addEventListener('click', async () => {
@ -39,7 +38,7 @@
class PageTwo extends HTMLElement { class PageTwo extends HTMLElement {
async connectedCallback() { async connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page Two</ion-title> <ion-title>Page Two</ion-title>
@ -49,8 +48,7 @@
<h1>Page Two</h1> <h1>Page Two</h1>
<ion-button class="next">Go to Page Three</ion-button> <ion-button class="next">Go to Page Three</ion-button>
<ion-button class="previous">Go Back</ion-button> <ion-button class="previous">Go Back</ion-button>
</ion-content> </ion-content>`;
</ion-page>`;
const previousButton = this.querySelector('ion-button.previous'); const previousButton = this.querySelector('ion-button.previous');
previousButton.addEventListener('click', async () => { previousButton.addEventListener('click', async () => {
@ -67,7 +65,7 @@
class PageThree extends HTMLElement { class PageThree extends HTMLElement {
async connectedCallback() { async connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page Three</ion-title> <ion-title>Page Three</ion-title>
@ -76,8 +74,7 @@
<ion-content padding> <ion-content padding>
<h1>Page Three</h1> <h1>Page Three</h1>
<ion-button class="previous">Go Back</ion-button> <ion-button class="previous">Go Back</ion-button>
</ion-content> </ion-content>`;
</ion-page>`;
const previousButton = this.querySelector('ion-button.previous'); const previousButton = this.querySelector('ion-button.previous');
previousButton.addEventListener('click', async () => { previousButton.addEventListener('click', async () => {

53
packages/core/src/components/nav/test/nav-then-tabs/index.html
View File

@ -10,7 +10,7 @@
class PageOne extends HTMLElement { class PageOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -25,7 +25,6 @@
<ion-button class="next">Go to Page Two</ion-button> <ion-button class="next">Go to Page Two</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -41,7 +40,7 @@
class PageTwoSectionOne extends HTMLElement { class PageTwoSectionOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -59,7 +58,6 @@
<ion-button class="previous">Go Back</ion-button> <ion-button class="previous">Go Back</ion-button>
</div> </div>
</ion-content> </ion-content>
</ion-page>
`; `;
const button = this.querySelector('ion-button.previous'); const button = this.querySelector('ion-button.previous');
@ -75,7 +73,7 @@
class PageTwoSectionTwo extends HTMLElement { class PageTwoSectionTwo extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -90,7 +88,6 @@
<ion-button class="next">Go to Page Three</ion-button> <ion-button class="next">Go to Page Three</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -98,7 +95,7 @@
class PageThree extends HTMLElement { class PageThree extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -113,7 +110,7 @@
<ion-button class="previous">Go Back</ion-button> <ion-button class="previous">Go Back</ion-button>
</ion-nav-pop> </ion-nav-pop>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -121,7 +118,7 @@
class LoginPage extends HTMLElement { class LoginPage extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -136,7 +133,7 @@
<ion-button>Login</ion-button> <ion-button>Login</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -162,7 +159,7 @@
class TabOnePageOne extends HTMLElement { class TabOnePageOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -177,7 +174,7 @@
<ion-button class="next">Go to Tab One Page Two</ion-button> <ion-button class="next">Go to Tab One Page Two</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -185,7 +182,7 @@
class TabOnePageTwo extends HTMLElement { class TabOnePageTwo extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -202,7 +199,7 @@
</ion-nav-push> </ion-nav-push>
</div> </div>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -210,7 +207,7 @@
class TabOnePageThree extends HTMLElement { class TabOnePageThree extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -222,7 +219,7 @@
<ion-content padding> <ion-content padding>
<h1>Tab One Page Three</h1> <h1>Tab One Page Three</h1>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -230,7 +227,7 @@
class TabTwoPageOne extends HTMLElement { class TabTwoPageOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -245,7 +242,7 @@
<ion-button class="next">Go to Tab Two Page Two</ion-button> <ion-button class="next">Go to Tab Two Page Two</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -253,7 +250,7 @@
class TabTwoPageTwo extends HTMLElement { class TabTwoPageTwo extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -270,7 +267,7 @@
</ion-nav-push> </ion-nav-push>
</div> </div>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -278,7 +275,7 @@
class TabTwoPageThree extends HTMLElement { class TabTwoPageThree extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -290,7 +287,7 @@
<ion-content padding> <ion-content padding>
<h1>Tab Two Page Three</h1> <h1>Tab Two Page Three</h1>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -298,7 +295,7 @@
class TabThreePageOne extends HTMLElement { class TabThreePageOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -313,7 +310,7 @@
<ion-button class="next">Go to Tab Three Page Two</ion-button> <ion-button class="next">Go to Tab Three Page Two</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -321,7 +318,7 @@
class TabThreePageTwo extends HTMLElement { class TabThreePageTwo extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -338,7 +335,7 @@
</ion-nav-push> </ion-nav-push>
</div> </div>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -346,7 +343,7 @@
class TabThreePageThree extends HTMLElement { class TabThreePageThree extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -358,7 +355,7 @@
<ion-content padding> <ion-content padding>
<h1>Tab Three Page Three</h1> <h1>Tab Three Page Three</h1>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }

12
packages/core/src/components/nav/test/simple-nested-navs/index.html
View File

@ -10,7 +10,7 @@
class PageOne extends HTMLElement { class PageOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -25,7 +25,6 @@
<ion-button class="next">Go to Page Two</ion-button> <ion-button class="next">Go to Page Two</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -41,7 +40,7 @@
class PageTwoSectionOne extends HTMLElement { class PageTwoSectionOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -59,7 +58,6 @@
<ion-button class="previous">Go Back</ion-button> <ion-button class="previous">Go Back</ion-button>
</div> </div>
</ion-content> </ion-content>
</ion-page>
`; `;
const button = this.querySelector('ion-button.previous'); const button = this.querySelector('ion-button.previous');
@ -75,7 +73,7 @@
class PageTwoSectionTwo extends HTMLElement { class PageTwoSectionTwo extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -90,7 +88,6 @@
<ion-button class="next">Go to Page Three</ion-button> <ion-button class="next">Go to Page Three</ion-button>
</ion-nav-push> </ion-nav-push>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }
@ -98,7 +95,7 @@
class PageThree extends HTMLElement { class PageThree extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -113,7 +110,6 @@
<ion-button class="previous">Go Back</ion-button> <ion-button class="previous">Go Back</ion-button>
</ion-nav-pop> </ion-nav-pop>
</ion-content> </ion-content>
</ion-page>
`; `;
} }
} }

4
packages/core/src/components/nav/transitions/transition.md.ts
View File

@ -63,10 +63,10 @@ export function buildMdTransition(rootTransition: Transition, enteringView: View
} }
function getIonPageElement(element: HTMLElement) { function getIonPageElement(element: HTMLElement) {
if (element.tagName.toLowerCase() === 'ion-page') { if (element.classList.contains('ion-page')) {
return element; return element;
} }
const ionPage = element.querySelector('ion-page'); const ionPage = element.querySelector('.ion-page');
if (ionPage) { if (ionPage) {
return ionPage; return ionPage;
} }

4
packages/core/src/components/note/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Note - Basic</ion-title> <ion-title>Note - Basic</ion-title>
@ -130,7 +130,7 @@
</ion-list> </ion-list>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

19
packages/core/src/components/page/page.tsx
View File

@ -1,19 +0,0 @@
import { Component } from '@stencil/core';
@Component({
tag: 'ion-page',
})
export class Page {
hostData() {
return {
class: {
'ion-page': true
}
};
}
render() {
return <slot></slot>;
}
}

11
packages/core/src/components/page/readme.md
View File

@ -1,11 +0,0 @@
# ion-page
<!-- Auto Generated Below -->
----------------------------------------------
*Built with [StencilJS](https://stenciljs.com/)*

4
packages/core/src/components/page/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page - Basic</ion-title> <ion-title>Page - Basic</ion-title>
@ -20,7 +20,7 @@
<ion-content padding> <ion-content padding>
Ion Page Content Ion Page Content
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>

2
packages/core/src/components/page/test/host-element/index.html
View File

@ -12,7 +12,7 @@
class PageOne extends HTMLElement { class PageOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page One</ion-title> <ion-title>Page One</ion-title>

4
packages/core/src/components/page/test/no-ion-app-basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<div style="height: 300px"> <div style="height: 300px">
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Page - No Ion App Basic</ion-title> <ion-title>Page - No Ion App Basic</ion-title>
@ -20,8 +20,6 @@
<ion-content padding> <ion-content padding>
Ion Page Content Ion Page Content
</ion-content> </ion-content>
</ion-page>
</div>
</body> </body>
</html> </html>

2
packages/core/src/components/page/test/no-ion-app-host-element/index.html
View File

@ -12,7 +12,7 @@
class PageOne extends HTMLElement { class PageOne extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>No Ion App Page One</ion-title> <ion-title>No Ion App Page One</ion-title>

4
packages/core/src/components/platform/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body onload="initialize()"> <body onload="initialize()">
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Platform - basic</ion-title> <ion-title>Platform - basic</ion-title>
@ -29,7 +29,7 @@
<h2>The ready event has fired: <span class="ready"></span></h2> <h2>The ready event has fired: <span class="ready"></span></h2>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/popover/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar color="primary"> <ion-toolbar color="primary">
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -41,7 +41,7 @@
<ion-title>Popover</ion-title> <ion-title>Popover</ion-title>
</ion-toolbar> </ion-toolbar>
</ion-footer> </ion-footer>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/radio-group/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
@ -47,8 +47,6 @@
<ion-button onClick="toggleDisabled()">Toggle Disabled</ion-button> <ion-button onClick="toggleDisabled()">Toggle Disabled</ion-button>
</ion-content> </ion-content>
</ion-page>
<script> <script>
var dynamicDisabled = document.getElementById('dynamicDisabled'); var dynamicDisabled = document.getElementById('dynamicDisabled');

4
packages/core/src/components/radio-group/test/form/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
@ -67,8 +67,6 @@
</ion-content> </ion-content>
</ion-page>
<script> <script>
var changes = 0; var changes = 0;

3
packages/core/src/components/radio/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Radio - Basic</ion-title> <ion-title>Radio - Basic</ion-title>
@ -135,7 +135,6 @@
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
<script> <script>
var radioValues = ['fruitRadio', 'pizzaRadio', 'veggiesRadio']; var radioValues = ['fruitRadio', 'pizzaRadio', 'veggiesRadio'];

4
packages/core/src/components/range/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Range - Basic</ion-title> <ion-title>Range - Basic</ion-title>
@ -99,7 +99,7 @@
<ion-button onclick="elTest()">Test</ion-button> <ion-button onclick="elTest()">Test</ion-button>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/refresher/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
@ -31,7 +31,7 @@
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<ion-menu-controller></ion-menu-controller> <ion-menu-controller></ion-menu-controller>

4
packages/core/src/components/reorder/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Reorder - Basic</ion-title> <ion-title>Reorder - Basic</ion-title>
@ -106,7 +106,7 @@
</ion-reorder-group> </ion-reorder-group>
</ion-list> </ion-list>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/ripple-effect/test/basic/index.html
View File

@ -19,7 +19,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Button Effect - Basic</ion-title> <ion-title>Button Effect - Basic</ion-title>
@ -55,7 +55,7 @@
<ion-ripple-effect></ion-ripple-effect> <ion-ripple-effect></ion-ripple-effect>
</div> </div>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>
function blockClicked() { function blockClicked() {

4
packages/core/src/components/searchbar/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Searchbar - Basic</ion-title> <ion-title>Searchbar - Basic</ion-title>
@ -111,7 +111,7 @@
} }
</script> </script>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>

4
packages/core/src/components/searchbar/test/toolbar/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header no-border translucent> <ion-header no-border translucent>
<ion-toolbar> <ion-toolbar>
<ion-title>Searchbar - Toolbar</ion-title> <ion-title>Searchbar - Toolbar</ion-title>
@ -88,7 +88,7 @@
</ion-toolbar> </ion-toolbar>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<style> <style>

4
packages/core/src/components/segment/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body onload="listenForEvent()"> <body onload="listenForEvent()">
<ion-app> <ion-app>
<ion-page>
<ion-header no-border> <ion-header no-border>
<ion-toolbar> <ion-toolbar>
<ion-title>Segment - Basic</ion-title> <ion-title>Segment - Basic</ion-title>
@ -189,7 +189,7 @@
</script> </script>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
</body> </body>

3
packages/core/src/components/select/test/basic/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Select - Basic</ion-title> <ion-title>Select - Basic</ion-title>
@ -246,7 +246,6 @@
</div> </div>
</ion-content> </ion-content>
</ion-page>
<script> <script>
var pets = document.getElementById('pets'); var pets = document.getElementById('pets');

3
packages/core/src/components/select/test/multiple-value/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Select Item: Multiple Value</ion-title> <ion-title>Select Item: Multiple Value</ion-title>
@ -111,7 +111,6 @@
</ion-item> </ion-item>
</ion-content> </ion-content>
</ion-page>
<script> <script>
var toppings = document.getElementById('toppings'); var toppings = document.getElementById('toppings');

3
packages/core/src/components/select/test/single-value/index.html
View File

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Select Item: Single Value</ion-title> <ion-title>Select Item: Single Value</ion-title>
@ -155,7 +155,6 @@
<br> <br>
</p> </p>
</ion-content> </ion-content>
</ion-page>
<script> <script>
let selects = document.querySelectorAll('ion-select'); let selects = document.querySelectorAll('ion-select');

4
packages/core/src/components/show-when/test/basic/index.html
View File

@ -10,7 +10,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-title>Show when - Basic</ion-title> <ion-title>Show when - Basic</ion-title>
@ -94,7 +94,7 @@
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>

4
packages/core/src/components/slides/test/app-intro/index.html
View File

@ -29,7 +29,7 @@
<body> <body>
<ion-app> <ion-app>
<ion-page>
<ion-header> <ion-header>
<ion-toolbar> <ion-toolbar>
<ion-buttons slot="start"> <ion-buttons slot="start">
@ -79,7 +79,7 @@
</ion-slide> </ion-slide>
</ion-slides> </ion-slides>
</ion-content> </ion-content>
</ion-page>
</ion-app> </ion-app>
<script> <script>
const slides = document.querySelector('.slides') const slides = document.querySelector('.slides')

Some files were not shown because too many files have changed in this diff Show More