diff --git a/docs/api/item.md b/docs/api/item.md index c479d57bc88..5aaa4a16304 100644 --- a/docs/api/item.md +++ b/docs/api/item.md @@ -25,7 +25,7 @@ Items are elements that can contain text, icons, avatars, images, inputs, and an ## Basic Usage -Items left align text and add an ellipsis when the text is wider than the item. We can modify this behavior using the CSS Utilities provided by Ionic Framework, such as using `.ion-text-wrap` in the below example. See the [CSS Utilities Documentation](/docs/layout/css-utilities) for more classes that can be added to an item to transform the text. +Items left align text and wrap when the text is wider than the item. We can modify this behavior using the CSS Utilities provided by Ionic Framework, such as using `.ion-text-nowrap` in the below example. See the [CSS Utilities Documentation](/docs/layout/css-utilities) for more classes that can be added to an item to transform the text. import Basic from '@site/static/usage/v8/item/basic/index.md'; diff --git a/static/usage/v7/item/basic/angular.md b/static/usage/v7/item/basic/angular.md index b975f267d90..3f50edc287e 100644 --- a/static/usage/v7/item/basic/angular.md +++ b/static/usage/v7/item/basic/angular.md @@ -5,14 +5,14 @@ - Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur + Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. - - Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur + + Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. diff --git a/static/usage/v7/item/basic/demo.html b/static/usage/v7/item/basic/demo.html index 9eccd18a724..28a51c2a89f 100644 --- a/static/usage/v7/item/basic/demo.html +++ b/static/usage/v7/item/basic/demo.html @@ -26,14 +26,14 @@ - Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, + Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. - - Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, + + Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. diff --git a/static/usage/v7/item/basic/javascript.md b/static/usage/v7/item/basic/javascript.md index b975f267d90..3f50edc287e 100644 --- a/static/usage/v7/item/basic/javascript.md +++ b/static/usage/v7/item/basic/javascript.md @@ -5,14 +5,14 @@ - Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur + Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. - - Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur + + Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. diff --git a/static/usage/v7/item/basic/react.md b/static/usage/v7/item/basic/react.md index 6154239cbf1..2c78219aee4 100644 --- a/static/usage/v7/item/basic/react.md +++ b/static/usage/v7/item/basic/react.md @@ -11,14 +11,14 @@ function Example() { - Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, + Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. - - Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, + + Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. diff --git a/static/usage/v7/item/basic/vue.md b/static/usage/v7/item/basic/vue.md index 37b32f7c2ca..c8e25a1819a 100644 --- a/static/usage/v7/item/basic/vue.md +++ b/static/usage/v7/item/basic/vue.md @@ -6,15 +6,15 @@ - Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, - consectetur adipiscing elit. + Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur + adipiscing elit. - - Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur - adipiscing elit. + + Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, + consectetur adipiscing elit. diff --git a/static/usage/v8/item/basic/angular.md b/static/usage/v8/item/basic/angular.md index b975f267d90..3f50edc287e 100644 --- a/static/usage/v8/item/basic/angular.md +++ b/static/usage/v8/item/basic/angular.md @@ -5,14 +5,14 @@ - Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur + Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. - - Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur + + Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. diff --git a/static/usage/v8/item/basic/demo.html b/static/usage/v8/item/basic/demo.html index 9eccd18a724..28a51c2a89f 100644 --- a/static/usage/v8/item/basic/demo.html +++ b/static/usage/v8/item/basic/demo.html @@ -26,14 +26,14 @@ - Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, + Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. - - Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, + + Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. diff --git a/static/usage/v8/item/basic/javascript.md b/static/usage/v8/item/basic/javascript.md index b975f267d90..3f50edc287e 100644 --- a/static/usage/v8/item/basic/javascript.md +++ b/static/usage/v8/item/basic/javascript.md @@ -5,14 +5,14 @@ - Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur + Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. - - Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur + + Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. diff --git a/static/usage/v8/item/basic/react.md b/static/usage/v8/item/basic/react.md index 6154239cbf1..2c78219aee4 100644 --- a/static/usage/v8/item/basic/react.md +++ b/static/usage/v8/item/basic/react.md @@ -11,14 +11,14 @@ function Example() { - Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, + Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. - - Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, + + Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur adipiscing elit. diff --git a/static/usage/v8/item/basic/vue.md b/static/usage/v8/item/basic/vue.md index 37b32f7c2ca..c8e25a1819a 100644 --- a/static/usage/v8/item/basic/vue.md +++ b/static/usage/v8/item/basic/vue.md @@ -6,15 +6,15 @@ - Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, - consectetur adipiscing elit. + Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur + adipiscing elit. - - Multi-line text that should wrap when it is too long to fit on one line. Lorem ipsum dolor sit amet, consectetur - adipiscing elit. + + Multi-line text that should ellipsis when it is too long to fit on one line. Lorem ipsum dolor sit amet, + consectetur adipiscing elit. diff --git a/versioned_docs/version-v7/api/item.md b/versioned_docs/version-v7/api/item.md index fc37d54f5db..2f7376694fa 100644 --- a/versioned_docs/version-v7/api/item.md +++ b/versioned_docs/version-v7/api/item.md @@ -28,7 +28,7 @@ Items are elements that can contain text, icons, avatars, images, inputs, and an ## Basic Usage -Items left align text and add an ellipsis when the text is wider than the item. We can modify this behavior using the CSS Utilities provided by Ionic Framework, such as using `.ion-text-wrap` in the below example. See the [CSS Utilities Documentation](/docs/layout/css-utilities) for more classes that can be added to an item to transform the text. +Items left align text and wrap when the text is wider than the item. We can modify this behavior using the CSS Utilities provided by Ionic Framework, such as using `.ion-text-nowrap` in the below example. See the [CSS Utilities Documentation](/docs/layout/css-utilities) for more classes that can be added to an item to transform the text. import Basic from '@site/static/usage/v7/item/basic/index.md';