atomic-load-more-results

This is for:

Developer

In this article

The atomic-load-more-results component allows the user to load additional results if more are available.

Shadow Parts

Part Description

Part	Description
`container`	The container of the component.
`highlight`	The highlighted number of results displayed and number of results available.
`load-more-results-button`	The "Load more results" button.
`progress-bar`	The progress bar displaying a percentage of results shown over the total number of results available.
`ripple`	The ripple effect of the component’s interactive elements.
`showing-results`	The summary displaying which results are shown and how many are available.

container

The container of the component.

highlight

The highlighted number of results displayed and number of results available.

load-more-results-button

The "Load more results" button.

progress-bar

The progress bar displaying a percentage of results shown over the total number of results available.

ripple

The ripple effect of the component’s interactive elements.

showing-results

The summary displaying which results are shown and how many are available.

Name Description

Name	Description
`--atomic-more-results-progress-bar-color-from`	Color of the start of the gradient for the load more results progress bar.
`--atomic-more-results-progress-bar-color-to`	Color of the end of the gradient for the load more results progress bar.

--atomic-more-results-progress-bar-color-from

Color of the start of the gradient for the load more results progress bar.

--atomic-more-results-progress-bar-color-to

Color of the end of the gradient for the load more results progress bar.