docbrown/app/javascript/articles/LoadingArticle.jsx
Nick Taylor 5e677daac1
Homepage feed components (#6052)
* wip - <PodcastArticle /> component.

* Added filler user avatar for other article types.

* Added <LoadingArticle /> component.

* wip

* wip on <Article /> component.

* Added <Article /> component to barrel file.

* Deleted assets from dummy storybook assets folder.

* Updated podcast article story avatar.

* More work on <Article /> component.

* Refactoring Storybook stories.

* Refactored so main component is just the <Article /> component.

* Added a missing video article property.

* Some refactoring of <Article /> component.

* Added Storybook knobs addon.

* Now <Article /> component supports an isBookmarked prop.

* Fixed podcast Storybook story.

* Made the knobs Storybook addon the first tab

* Added more <Article /> Storybook stories.

* More <Article /> component tweaks.

* Added publish time to <Article /> component stories.

* Made the timeAgo function compatible with Preact.

* Added loading="lazy" attribute to <img /> in <Article /> component.

* Added <Article /> Storybook story for past published date.

* Fixed publish date for <Article /> story data.

* Scrapped random avatars.

* Added snapshots for <Article /> component.

* Added snapshots for <LoadingArticle /> component.

* Now test article entities are shared.

* Fixed some wording of Storybook stories.

* Breaking up Article.jsx to make codeclimate happy.

* Now <Article /> component receives icon props.

* Added knobs for <Article /> icon props.

* Added *.stories.jsx to codeclimate exclusion list.

* Added **/*.stories.jsx to codeclimate exclusion list.

* Alright now we have the good glob for excluding Storybook from codeclimate 😆

* Added org headline changes from low hanging fruit PR.

* Updated <Article /> snapshot for org headline.
2020-02-19 11:39:13 -06:00

16 lines
504 B
JavaScript

import { h } from 'preact';
export const LoadingArticle = () => (
<div className="single-article single-article-small-pic">
<div className="small-pic">
<div className="color single-article-loading" />
</div>
<div className="content">
<h3 className="single-article-loading">&nbsp;</h3>
</div>
<h4 className="single-article-loading" style={{ width: '46%' }}>
&nbsp;
</h4>
<div className="tags single-article-loading" style={{ width: '56%' }} />
</div>
);