diff --git a/core/api.txt b/core/api.txt index 3db9b064b25..2c51469de6c 100644 --- a/core/api.txt +++ b/core/api.txt @@ -747,7 +747,7 @@ ion-datetime-button,part,native ion-divider,shadow ion-divider,prop,inset,boolean,false,false,false -ion-divider,prop,spacing,"large" | "medium" | "small" | "xlarge" | "xsmall" | "xxlarge" | "xxsmall" | undefined,'xxsmall',false,true +ion-divider,prop,spacing,"large" | "medium" | "small" | "xlarge" | "xsmall" | "xxlarge" | "xxsmall" | undefined,'medium',false,true ion-divider,css-prop,--margin-bottom,ionic ion-divider,css-prop,--margin-bottom,ios ion-divider,css-prop,--margin-bottom,md diff --git a/core/src/components.d.ts b/core/src/components.d.ts index 1ce0b2fba36..43ae3a07dc7 100644 --- a/core/src/components.d.ts +++ b/core/src/components.d.ts @@ -1170,7 +1170,7 @@ export namespace Components { */ "inset": boolean; /** - * Set to `"xxsmall"` for the smallest spacing. Set to "xsmall" for very small spacing. Set to `"small"` for small spacing. Set to "medium" for medium spacing. Set to "large" for large spacing. Set to `"xlarge"` for the largest spacing. Defaults to `"xxsmall"`. + * Set to `"xxsmall"` for the smallest spacing. Set to "xsmall" for very small spacing. Set to `"small"` for small spacing. Set to "medium" for medium spacing. Set to "large" for large spacing. Set to `"xlarge"` for the largest spacing. Defaults to `"medium"`. */ "spacing"?: 'xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'; } @@ -6642,7 +6642,7 @@ declare namespace LocalJSX { */ "inset"?: boolean; /** - * Set to `"xxsmall"` for the smallest spacing. Set to "xsmall" for very small spacing. Set to `"small"` for small spacing. Set to "medium" for medium spacing. Set to "large" for large spacing. Set to `"xlarge"` for the largest spacing. Defaults to `"xxsmall"`. + * Set to `"xxsmall"` for the smallest spacing. Set to "xsmall" for very small spacing. Set to `"small"` for small spacing. Set to "medium" for medium spacing. Set to "large" for large spacing. Set to `"xlarge"` for the largest spacing. Defaults to `"medium"`. */ "spacing"?: 'xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'; } diff --git a/core/src/components/divider/divider.common.scss b/core/src/components/divider/divider.common.scss index 3a86da68a17..e87befe01b8 100644 --- a/core/src/components/divider/divider.common.scss +++ b/core/src/components/divider/divider.common.scss @@ -12,21 +12,11 @@ --padding-start: 0px; --padding-end: 0px; + @include padding-horizontal(var(--padding-start), var(--padding-end)); + display: block; width: 100%; - - /* stylelint-disable */ - @include ltr() { - padding-right: calc(var(--padding-end) + var(--ion-safe-area-right, 0px)); - padding-left: calc(var(--padding-start) + var(--ion-safe-area-left, 0px)); - } - - @include rtl() { - padding-right: calc(var(--padding-start) + var(--ion-safe-area-right, 0px)); - padding-left: calc(var(--padding-end) + var(--ion-safe-area-left, 0px)); - } - /* stylelint-enable */ } :host hr { diff --git a/core/src/components/divider/divider.tsx b/core/src/components/divider/divider.tsx index ef3c70a06d6..5ed105c333e 100644 --- a/core/src/components/divider/divider.tsx +++ b/core/src/components/divider/divider.tsx @@ -20,10 +20,10 @@ export class Divider implements ComponentInterface { * Set to "large" for large spacing. * Set to `"xlarge"` for the largest spacing. * - * Defaults to `"xxsmall"`. + * Defaults to `"medium"`. */ @Prop({ reflect: true }) spacing?: 'xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' = - 'xxsmall'; + 'medium'; /** * If `true`, the divider will have horizontal margins diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Chrome-linux.png index 9cd4dd79328..c3fd547399c 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Firefox-linux.png index a51dd78b111..77ab8875021 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Safari-linux.png index 39b8b98e7cd..b8a4ff74d9c 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Chrome-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Chrome-linux.png index bad7dab1d67..0298384c66d 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Firefox-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Firefox-linux.png index fa8835c0fdc..79e460d4207 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Safari-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Safari-linux.png index 7ab3103c8db..8081998d648 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Safari-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-default-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png index 078b5e4eba7..ac99223a9f9 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png index 0f73bd7f9f1..5f2c612ac92 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Safari-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Safari-linux.png index b4b6894c993..aa1f0ba9356 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Safari-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-ltr-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png index e8a03c16ebc..6b254e5e8d3 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Chrome-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png index 9d7ddfdc8ed..7602fddaecf 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Firefox-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Safari-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Safari-linux.png index 763673be09d..09299b7d94c 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Safari-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-ionic-md-rtl-light-Mobile-Safari-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Chrome-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Chrome-linux.png index 2ba47496a27..9e16eca7fa2 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Firefox-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Firefox-linux.png index f9e2d4b24af..f7cbf8e4e42 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Safari-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Safari-linux.png index 033d187d41d..f0f40d22a94 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Safari-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Chrome-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Chrome-linux.png index a80270fc368..07f9da58c4f 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Firefox-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Firefox-linux.png index c2f995e9f47..effc78ad600 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Safari-linux.png b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Safari-linux.png index 208cd7183a2..7df9e90b78e 100644 Binary files a/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Safari-linux.png and b/core/src/components/divider/test/basic/divider.e2e.ts-snapshots/divider-basic-inset-md-rtl-Mobile-Safari-linux.png differ