From 8555acb397efdc2f89681add3b40a1d9e3846091 Mon Sep 17 00:00:00 2001 From: Brandy Carney Date: Thu, 5 Jul 2018 18:09:58 -0400 Subject: [PATCH] docs(infinite-scroll): update infinite scroll readme files and usage --- .../infinite-scroll-content/readme.md | 3 +-- .../infinite-scroll-content/usage/angular.md | 10 ++++++++ .../usage/javascript.md | 4 ++-- core/src/components/infinite-scroll/readme.md | 23 ++++--------------- .../infinite-scroll/usage/javascript.md | 4 ++-- 5 files changed, 20 insertions(+), 24 deletions(-) create mode 100644 core/src/components/infinite-scroll-content/usage/angular.md diff --git a/core/src/components/infinite-scroll-content/readme.md b/core/src/components/infinite-scroll-content/readme.md index f677f18597..100f6176ee 100644 --- a/core/src/components/infinite-scroll-content/readme.md +++ b/core/src/components/infinite-scroll-content/readme.md @@ -1,7 +1,6 @@ # ion-infinite-scroll-content -InfiniteScrollContent is a component that adds the content to InfiniteScroll. -You can loading icon or loading text with the component's properties. +The `ion-infinite-scroll-content` component is the default child used by the `ion-infinite-scroll`. It displays an infinite scroll spinner that looks best based on the platform and changes the look depending on the infinite scroll's state. The default spinner can be changed and text can be added by setting the `loadingSpinner` and `loadingText` properties. diff --git a/core/src/components/infinite-scroll-content/usage/angular.md b/core/src/components/infinite-scroll-content/usage/angular.md new file mode 100644 index 0000000000..e0b33be532 --- /dev/null +++ b/core/src/components/infinite-scroll-content/usage/angular.md @@ -0,0 +1,10 @@ +```html + + + + + + +``` diff --git a/core/src/components/infinite-scroll-content/usage/javascript.md b/core/src/components/infinite-scroll-content/usage/javascript.md index e0b33be532..cba9909ea0 100644 --- a/core/src/components/infinite-scroll-content/usage/javascript.md +++ b/core/src/components/infinite-scroll-content/usage/javascript.md @@ -2,8 +2,8 @@ + loading-spinner="bubbles" + loading-text="Loading more data…"> diff --git a/core/src/components/infinite-scroll/readme.md b/core/src/components/infinite-scroll/readme.md index d4bac46363..6ea5bf2a9a 100644 --- a/core/src/components/infinite-scroll/readme.md +++ b/core/src/components/infinite-scroll/readme.md @@ -1,29 +1,16 @@ # ion-infinite-scroll -The Infinite Scroll allows you to perform an action when the user -scrolls a specified distance from the bottom or top of the page. +The Infinite Scroll component calls an action to be performed when the user scrolls a specified distance from the bottom or top of the page. -The expression assigned to the `ionInfinite` event is called when -the user scrolls to the specified distance. When this expression -has finished its tasks, it should call the `complete()` method -on the infinite scroll instance. +The expression assigned to the `ionInfinite` event is called when the user reaches that defined distance. When this expression has finished any and all tasks, it should call the `complete()` method on the infinite scroll instance. ## Infinite Scroll Content -By default, Ionic uses the infinite scroll spinner that looks -best for the platform the user is on. However, you can change the -default spinner or add text by adding properties to the -`ion-infinite-scroll-content` component. +The `ion-infinite-scroll` component has the infinite scroll logic. It requires a child component in order to display content. Ionic uses its `ion-infinite-scroll-content` component by default. This component displays the infinite scroll and changes the look depending on the infinite scroll's state. It displays a spinner that looks best based on the platform the user is on. However, the default spinner can be changed and text can be added by setting properties on the `ion-infinite-scroll-content` component. -## Further Customizing Infinite Scroll Content +## Custom Content -The `ion-infinite-scroll` component holds the infinite scroll logic. -It requires a child component in order to display the content. -Ionic uses `ion-infinite-scroll-content` by default. This component -displays the infinite scroll and changes the look depending -on the infinite scroll's state. Separating these components allows -developers to create their own infinite scroll content components. -You could replace our default content with custom SVG or CSS animations. +Separating the `ion-infinite-scroll` and `ion-infinite-scroll-content` components allows developers to create their own content components, if desired. This content can contain anything, from an SVG element to elements with unique CSS animations. diff --git a/core/src/components/infinite-scroll/usage/javascript.md b/core/src/components/infinite-scroll/usage/javascript.md index bcb2e5310c..f6246480d7 100644 --- a/core/src/components/infinite-scroll/usage/javascript.md +++ b/core/src/components/infinite-scroll/usage/javascript.md @@ -3,8 +3,8 @@ + loading-spinner="bubbles" + loading-text="Loading more data...">