From 20af652a1be5e1aff2836422489642c8baed6939 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Wed, 26 Feb 2020 12:06:37 -0500 Subject: [PATCH] fix(slides): set height to 100% for vertical slides (#20603) fixes #17341 --- core/src/components/slides/slides-vendor.scss | 3 ++ .../components/slides/test/vertical/e2e.ts | 10 ++++ .../slides/test/vertical/index.html | 50 +++++++++++++++++++ 3 files changed, 63 insertions(+) create mode 100644 core/src/components/slides/test/vertical/e2e.ts create mode 100644 core/src/components/slides/test/vertical/index.html diff --git a/core/src/components/slides/slides-vendor.scss b/core/src/components/slides/slides-vendor.scss index 0b9954558d..549f361a95 100644 --- a/core/src/components/slides/slides-vendor.scss +++ b/core/src/components/slides/slides-vendor.scss @@ -21,6 +21,9 @@ .swiper-container-no-flexbox .swiper-slide { float: left; } +.swiper-container-vertical { + height: 100%; +} .swiper-container-vertical > .swiper-wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; diff --git a/core/src/components/slides/test/vertical/e2e.ts b/core/src/components/slides/test/vertical/e2e.ts new file mode 100644 index 0000000000..2a3ce9bebd --- /dev/null +++ b/core/src/components/slides/test/vertical/e2e.ts @@ -0,0 +1,10 @@ +import { newE2EPage } from '@stencil/core/testing'; + +test('slides: vertical', async () => { + const page = await newE2EPage({ + url: '/src/components/slides/test/vertical?ionic:_testing=true' + }); + + const compare = await page.compareScreenshot(); + expect(compare).toMatchScreenshot(); +}); diff --git a/core/src/components/slides/test/vertical/index.html b/core/src/components/slides/test/vertical/index.html new file mode 100644 index 0000000000..b6fc19eaa9 --- /dev/null +++ b/core/src/components/slides/test/vertical/index.html @@ -0,0 +1,50 @@ + + + + + + Slides - Vertical + + + + + + + + + + + + + + +

Slide 1

+
+ +

Slide 2

+
+ +

Slide 3

+
+
+
+ +
+ + + + + + +