diff options
author | Thibaut Girka <thib@sitedethib.com> | 2019-01-10 20:19:45 +0100 |
---|---|---|
committer | Thibaut Girka <thib@sitedethib.com> | 2019-01-10 21:00:33 +0100 |
commit | 2b2584a37b50d94ae6a48d90879228fc7e5b0a9d (patch) | |
tree | 7d62d334548b680b3de694d04f5c7d29318483eb /app/javascript/flavours | |
parent | a2a64ecd3e3551707412c47f0d16e484dea25632 (diff) |
[Glitch] Display fallback link card thumbnail when none is given
Port 1512af2811cb5b2ffccac5452eb291b1af46f89d to glitch-soc
Diffstat (limited to 'app/javascript/flavours')
-rw-r--r-- | app/javascript/flavours/glitch/features/status/components/card.js | 6 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/styles/components/status.scss | 9 |
2 files changed, 15 insertions, 0 deletions
diff --git a/app/javascript/flavours/glitch/features/status/components/card.js b/app/javascript/flavours/glitch/features/status/components/card.js index 743fe779a..1e1604d5c 100644 --- a/app/javascript/flavours/glitch/features/status/components/card.js +++ b/app/javascript/flavours/glitch/features/status/components/card.js @@ -195,6 +195,12 @@ export default class Card extends React.PureComponent { {thumbnail} </div> ); + } else { + embed = ( + <div className='status-card__image'> + <i className='fa fa-file-text' /> + </div> + ); } return ( diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss index 38ead06cf..7b240224c 100644 --- a/app/javascript/flavours/glitch/styles/components/status.scss +++ b/app/javascript/flavours/glitch/styles/components/status.scss @@ -740,6 +740,15 @@ a.status-card { flex: 0 0 100px; background: lighten($ui-base-color, 8%); position: relative; + + .fa { + font-size: 21px; + position: absolute; + transform-origin: 50% 50%; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + } } .status-card.horizontal { |