Skip to content

Commit 1f8fbcf

Browse files
author
Pooya Parsa
committed
fix(f7-router): children ~> routes
1 parent ff53bdd commit 1f8fbcf

19 files changed

+642
-19
lines changed

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-3d-coverflow.vue

-1
This file was deleted.

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-3d-coverflow.vue

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<template>
2+
<f7-page>
3+
<f7-navbar title="3D Coverflow Effect" back-link="Back"></f7-navbar>
4+
<div class="page-content">
5+
<div data-pagination='{"el": ".swiper-pagination"}' data-effect="coverflow" data-slides-per-view="auto" data-centered-slides="true" class="swiper-container swiper-init demo-swiper demo-swiper-coverflow">
6+
<div class="swiper-pagination"></div>
7+
<div class="swiper-wrapper">
8+
<div style="background-image:url(http://lorempixel.com/800/800/nature/1/)" class="swiper-slide">Slide 1</div>
9+
<div style="background-image:url(http://lorempixel.com/800/800/nature/2/)" class="swiper-slide">Slide 2</div>
10+
<div style="background-image:url(http://lorempixel.com/800/800/nature/3/)" class="swiper-slide">Slide 3</div>
11+
<div style="background-image:url(http://lorempixel.com/800/800/nature/4/)" class="swiper-slide">Slide 4</div>
12+
<div style="background-image:url(http://lorempixel.com/800/800/nature/5/)" class="swiper-slide">Slide 5</div>
13+
<div style="background-image:url(http://lorempixel.com/800/800/nature/6/)" class="swiper-slide">Slide 6</div>
14+
<div style="background-image:url(http://lorempixel.com/800/800/nature/7/)" class="swiper-slide">Slide 7</div>
15+
<div style="background-image:url(http://lorempixel.com/800/800/nature/8/)" class="swiper-slide">Slide 8</div>
16+
<div style="background-image:url(http://lorempixel.com/800/800/nature/9/)" class="swiper-slide">Slide 9</div>
17+
</div>
18+
</div>
19+
</div>
20+
</f7-page>
21+
</template>
22+
<script>
23+
import { f7Navbar, f7Page } from 'framework7-vue';
24+
25+
export default {}
26+
</script>

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-3d-cube.vue

-1
This file was deleted.

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-3d-cube.vue

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<template>
2+
<f7-page>
3+
<f7-navbar title="3D Cube" back-link="Back"></f7-navbar>
4+
<div class="page-content">
5+
<div data-effect="cube" class="swiper-container swiper-init demo-swiper demo-swiper-cube">
6+
<div class="swiper-wrapper">
7+
<div style="background-image:url(http://lorempixel.com/800/800/people/1/)" class="swiper-slide">Slide 1</div>
8+
<div style="background-image:url(http://lorempixel.com/800/800/people/2/)" class="swiper-slide">Slide 2</div>
9+
<div style="background-image:url(http://lorempixel.com/800/800/people/3/)" class="swiper-slide">Slide 3</div>
10+
<div style="background-image:url(http://lorempixel.com/800/800/people/4/)" class="swiper-slide">Slide 4</div>
11+
<div style="background-image:url(http://lorempixel.com/800/800/people/5/)" class="swiper-slide">Slide 5</div>
12+
<div style="background-image:url(http://lorempixel.com/800/800/people/6/)" class="swiper-slide">Slide 6</div>
13+
<div style="background-image:url(http://lorempixel.com/800/800/people/7/)" class="swiper-slide">Slide 7</div>
14+
<div style="background-image:url(http://lorempixel.com/800/800/people/8/)" class="swiper-slide">Slide 8</div>
15+
<div style="background-image:url(http://lorempixel.com/800/800/people/9/)" class="swiper-slide">Slide 9</div>
16+
</div>
17+
</div>
18+
</div>
19+
</f7-page>
20+
</template>
21+
<script>
22+
import { f7Navbar, f7Page } from 'framework7-vue';
23+
24+
export default {}
25+
</script>

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-3d-flip.vue

-1
This file was deleted.

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-3d-flip.vue

+24
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<template>
2+
<f7-page>
3+
<f7-navbar title="3D Flip Effect" back-link="Back"></f7-navbar>
4+
<div class="page-content">
5+
<div data-effect="flip" class="swiper-container swiper-init demo-swiper demo-swiper-cube">
6+
<div class="swiper-wrapper">
7+
<div style="background-image:url(http://lorempixel.com/800/800/people/1/)" class="swiper-slide">Slide 1</div>
8+
<div style="background-image:url(http://lorempixel.com/800/800/people/2/)" class="swiper-slide">Slide 2</div>
9+
<div style="background-image:url(http://lorempixel.com/800/800/people/3/)" class="swiper-slide">Slide 3</div>
10+
<div style="background-image:url(http://lorempixel.com/800/800/people/4/)" class="swiper-slide">Slide 4</div>
11+
<div style="background-image:url(http://lorempixel.com/800/800/people/5/)" class="swiper-slide">Slide 5</div>
12+
<div style="background-image:url(http://lorempixel.com/800/800/people/6/)" class="swiper-slide">Slide 6</div>
13+
<div style="background-image:url(http://lorempixel.com/800/800/people/7/)" class="swiper-slide">Slide 7</div>
14+
<div style="background-image:url(http://lorempixel.com/800/800/people/8/)" class="swiper-slide">Slide 8</div>
15+
</div>
16+
</div>
17+
</div>
18+
</f7-page>
19+
</template>
20+
<script>
21+
import { f7Navbar, f7Page } from 'framework7-vue';
22+
23+
export default {}
24+
</script>

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-custom-controls.vue

-1
This file was deleted.

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-custom-controls.vue

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<template>
2+
<f7-page>
3+
<f7-navbar title="Custom Controls" back-link="Back"></f7-navbar>
4+
<div class="page-content">
5+
<div class="demo-swiper-custom">
6+
<div data-pagination='{"el": ".swiper-pagination", "clickable": true}' data-navigation='{"nextEl": ".swiper-button-next", "prevEl": ".swiper-button-prev"}' data-space-between="0" class="swiper-container swiper-init">
7+
<div class="swiper-pagination"></div>
8+
<div class="swiper-wrapper">
9+
<div style="background-image:url(http://lorempixel.com/1024/1024/nightlife/1/)" class="swiper-slide"></div>
10+
<div style="background-image:url(http://lorempixel.com/1024/1024/nightlife/2/)" class="swiper-slide"></div>
11+
<div style="background-image:url(http://lorempixel.com/1024/1024/nightlife/3/)" class="swiper-slide"></div>
12+
<div style="background-image:url(http://lorempixel.com/1024/1024/nightlife/4/)" class="swiper-slide"></div>
13+
<div style="background-image:url(http://lorempixel.com/1024/1024/nightlife/5/)" class="swiper-slide"></div>
14+
<div style="background-image:url(http://lorempixel.com/1024/1024/nightlife/6/)" class="swiper-slide"></div>
15+
</div>
16+
<div class="swiper-button-prev"></div>
17+
<div class="swiper-button-next"></div>
18+
</div>
19+
</div>
20+
</div>
21+
</f7-page>
22+
</template>
23+
<script>
24+
import { f7Navbar, f7Page } from 'framework7-vue';
25+
26+
export default {}
27+
</script>

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-fade.vue

-1
This file was deleted.

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-fade.vue

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<template>
2+
<f7-page>
3+
<f7-navbar title="Fade Effect" back-link="Back"></f7-navbar>
4+
<div class="page-content">
5+
<div data-pagination='{"el": ".swiper-pagination"}' data-effect="fade" class="swiper-container swiper-init demo-swiper demo-swiper-fade">
6+
<div class="swiper-pagination"></div>
7+
<div class="swiper-wrapper">
8+
<div style="background-image:url(http://lorempixel.com/1024/1024/people/1/)" class="swiper-slide"></div>
9+
<div style="background-image:url(http://lorempixel.com/1024/1024/people/2/)" class="swiper-slide"></div>
10+
<div style="background-image:url(http://lorempixel.com/1024/1024/people/3/)" class="swiper-slide"></div>
11+
<div style="background-image:url(http://lorempixel.com/1024/1024/people/4/)" class="swiper-slide"></div>
12+
</div>
13+
</div>
14+
</div>
15+
</f7-page>
16+
</template>
17+
<script>
18+
import { f7Navbar, f7Page } from 'framework7-vue';
19+
20+
export default {}
21+
</script>

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-gallery.vue

-1
This file was deleted.

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-gallery.vue

+74
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
<template>
2+
<f7-page>
3+
<f7-navbar title="Two Way Control Gallery" back-link="Back"></f7-navbar>
4+
<div class="swiper-container demo-swiper-gallery-top">
5+
<div class="swiper-wrapper">
6+
<div style="background-image:url(http://lorempixel.com/800/800/nature/1/)" class="swiper-slide"></div>
7+
<div style="background-image:url(http://lorempixel.com/800/800/nature/2/)" class="swiper-slide"></div>
8+
<div style="background-image:url(http://lorempixel.com/800/800/nature/3/)" class="swiper-slide"></div>
9+
<div style="background-image:url(http://lorempixel.com/800/800/nature/4/)" class="swiper-slide"></div>
10+
<div style="background-image:url(http://lorempixel.com/800/800/nature/5/)" class="swiper-slide"></div>
11+
<div style="background-image:url(http://lorempixel.com/800/800/nature/6/)" class="swiper-slide"></div>
12+
</div>
13+
<div class="swiper-button-next color-white"></div>
14+
<div class="swiper-button-prev color-white"></div>
15+
</div>
16+
<div class="swiper-container demo-swiper-gallery-thumbs">
17+
<div class="swiper-wrapper">
18+
<div class="swiper-slide">
19+
<div style="background-image:url(http://lorempixel.com/800/800/nature/1/)" class="swiper-slide-pic"></div>
20+
</div>
21+
<div class="swiper-slide">
22+
<div style="background-image:url(http://lorempixel.com/800/800/nature/2/)" class="swiper-slide-pic"></div>
23+
</div>
24+
<div class="swiper-slide">
25+
<div style="background-image:url(http://lorempixel.com/800/800/nature/3/)" class="swiper-slide-pic"></div>
26+
</div>
27+
<div class="swiper-slide">
28+
<div style="background-image:url(http://lorempixel.com/800/800/nature/4/)" class="swiper-slide-pic"></div>
29+
</div>
30+
<div class="swiper-slide">
31+
<div style="background-image:url(http://lorempixel.com/800/800/nature/5/)" class="swiper-slide-pic"></div>
32+
</div>
33+
<div class="swiper-slide">
34+
<div style="background-image:url(http://lorempixel.com/800/800/nature/6/)" class="swiper-slide-pic"></div>
35+
</div>
36+
</div>
37+
</div>
38+
</f7-page>
39+
</template>
40+
<script>
41+
import { f7Navbar, f7Page } from "framework7-vue";
42+
43+
export default {
44+
on: {
45+
pageBeforeRemove() {
46+
var self = this;
47+
self.swiperTop.destroy();
48+
self.swiperThumbs.destroy();
49+
},
50+
pageInit() {
51+
var self = this;
52+
var swiperTop = self.$f7.swiper.create(".demo-swiper-gallery-top", {
53+
spaceBetween: 10,
54+
navigation: {
55+
nextEl: ".swiper-button-next",
56+
prevEl: ".swiper-button-prev"
57+
}
58+
});
59+
var swiperThumbs = self.$f7.swiper.create(".demo-swiper-gallery-thumbs", {
60+
slidesPerView: "auto",
61+
spaceBetween: 10,
62+
centeredSlides: true,
63+
touchRatio: 0.2,
64+
slideToClickedSlide: true
65+
});
66+
swiperTop.controller.control = swiperThumbs;
67+
swiperThumbs.controller.control = swiperTop;
68+
69+
self.swiperTop = swiperTop;
70+
self.swiperThumbs = swiperThumbs;
71+
}
72+
}
73+
};
74+
</script>

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-horizontal.vue

-1
This file was deleted.

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-horizontal.vue

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<template>
2+
<f7-page>
3+
<f7-navbar title="Swiper Horizontal" back-link="Back"></f7-navbar>
4+
<div class="page-content">
5+
<div data-pagination='{"el": ".swiper-pagination", "hideOnClick": true}' class="swiper-container swiper-init demo-swiper">
6+
<div class="swiper-pagination"></div>
7+
<div class="swiper-wrapper">
8+
<div class="swiper-slide">Slide 1</div>
9+
<div class="swiper-slide">Slide 2</div>
10+
<div class="swiper-slide">Slide 3</div>
11+
<div class="swiper-slide">Slide 4</div>
12+
<div class="swiper-slide">Slide 5</div>
13+
<div class="swiper-slide">Slide 6</div>
14+
<div class="swiper-slide">Slide 7</div>
15+
<div class="swiper-slide">Slide 8</div>
16+
<div class="swiper-slide">Slide 9</div>
17+
<div class="swiper-slide">Slide 10</div>
18+
</div>
19+
</div>
20+
</div>
21+
</f7-page>
22+
</template>
23+
<script>
24+
import { f7Navbar, f7Page } from 'framework7-vue';
25+
26+
export default {}
27+
</script>

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-lazy.vue

-1
This file was deleted.

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-lazy.vue

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<template>
2+
<f7-page>
3+
<f7-navbar title="Slider Lazy Loading" back-link="Back"></f7-navbar>
4+
<div class="page-content">
5+
<div data-pagination='{"el": ".swiper-pagination"}' data-navigation='{"nextEl": ".swiper-button-next", "prevEl": ".swiper-button-prev"}' data-lazy='{"enabled": true}' class="swiper-container swiper-init demo-swiper-lazy">
6+
<div class="swiper-wrapper">
7+
<div class="swiper-slide"><img data-src="http://lorempixel.com/1600/1200/nature/1/" class="swiper-lazy"/>
8+
<div class="preloader swiper-lazy-preloader"></div>
9+
</div>
10+
<div class="swiper-slide"><img data-src="http://lorempixel.com/1600/1200/nature/2/" class="swiper-lazy"/>
11+
<div class="preloader swiper-lazy-preloader"></div>
12+
</div>
13+
<div class="swiper-slide"><img data-src="http://lorempixel.com/1600/1200/nature/3/" class="swiper-lazy"/>
14+
<div class="preloader swiper-lazy-preloader"></div>
15+
</div>
16+
<div class="swiper-slide"><img data-src="http://lorempixel.com/1600/1200/nature/4/" class="swiper-lazy"/>
17+
<div class="preloader swiper-lazy-preloader"></div>
18+
</div>
19+
<div class="swiper-slide"><img data-src="http://lorempixel.com/1600/1200/nature/5/" class="swiper-lazy"/>
20+
<div class="preloader swiper-lazy-preloader"></div>
21+
</div>
22+
<div class="swiper-slide"><img data-src="http://lorempixel.com/1600/1200/nature/6/" class="swiper-lazy"/>
23+
<div class="preloader swiper-lazy-preloader"></div>
24+
</div>
25+
</div>
26+
<div class="swiper-pagination"></div>
27+
<div class="swiper-button-prev"></div>
28+
<div class="swiper-button-next"></div>
29+
</div>
30+
</div>
31+
</f7-page>
32+
</template>
33+
<script>
34+
import { f7Navbar, f7Page } from 'framework7-vue';
35+
36+
export default {}
37+
</script>

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-loop.vue

-1
This file was deleted.

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-loop.vue

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<template>
2+
<f7-page>
3+
<f7-navbar title="Infinite Loop Mode" back-link="Back"></f7-navbar>
4+
<div class="page-content">
5+
<div data-pagination='{"el": ".swiper-pagination"}' data-loop="true" class="swiper-container swiper-init demo-swiper">
6+
<div class="swiper-pagination"></div>
7+
<div class="swiper-wrapper">
8+
<div class="swiper-slide">Slide 1</div>
9+
<div class="swiper-slide">Slide 2</div>
10+
<div class="swiper-slide">Slide 3</div>
11+
<div class="swiper-slide">Slide 4</div>
12+
<div class="swiper-slide">Slide 5</div>
13+
<div class="swiper-slide">Slide 6</div>
14+
<div class="swiper-slide">Slide 7</div>
15+
<div class="swiper-slide">Slide 8</div>
16+
<div class="swiper-slide">Slide 9</div>
17+
<div class="swiper-slide">Slide 10</div>
18+
</div>
19+
</div>
20+
</div>
21+
</f7-page>
22+
</template>
23+
<script>
24+
import { f7Navbar, f7Page } from 'framework7-vue';
25+
26+
export default {}
27+
</script>

Diff for: ‎examples/kitchen-sink/pages/swiper/swiper-multiple.vue

-1
This file was deleted.

0 commit comments

Comments
 (0)