# give/4.16.4/blocks/components/placeholder-animation/index.js

GiveWP – Donation Plugin and Fundraising Platform, version 4.16.4. 58 lines.

- Page: https://pluginprobe.com/plugins/give/4.16.4/code/blocks/components/placeholder-animation/index.js
- Raw: https://pluginprobe.com/plugins/give/4.16.4/raw/blocks/components/placeholder-animation/index.js
- Modified: 2018-10-25T07:18:32+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/give/4.16.4/code/blocks/components/placeholder-animation/index.js#L10-L20`.

```javascript
/**
 * Internal dependencies
 */
import './style.scss';

const PlaceholderAnimation = () => {
	return (
		<div className="placeholder-animation">
			<div className="timeline-wrapper">
				<div className="timeline-item">
					<div className="animated-background">

						<div className="layer label layer-4">
							<div className="layer-item"></div>
							<div className="layer-item opaque"></div>
							<div className="layer-item opaque"></div>
							<div className="layer-item"></div>
							<div className="layer-item opaque"></div>
						</div>
						<div className="layer-gap small"></div>

						<div className="layer h2 layer-5">
							<div className="layer-item"></div>
							<div className="layer-item opaque"></div>
							<div className="layer-item opaque"></div>
							<div className="layer-item"></div>
							<div className="layer-item opaque"></div>
						</div>
						<div className="layer-gap medium"></div>

						<div className="layer label layer-6">
							<div className="layer-item"></div>
							<div className="layer-item opaque"></div>
						</div>
						<div className="layer-gap small"></div>

						<div className="layer h2 layer-7">
							<div className="layer-item"></div>
							<div className="layer-item opaque"></div>
						</div>

						<div className="layer-gap medium"></div>
						<div className="layer-gap medium"></div>

						<div className="layer h1 layer-8">
							<div className="layer-item opaque"></div>
							<div className="layer-item"></div>
							<div className="layer-item opaque"></div>
						</div>
					</div>
				</div>
			</div>
		</div>
	);
};

export default PlaceholderAnimation;

```
