Story
As a reader, I want Page Previews to have unified design.
Follow-on story: As a reader, I do not want Page Previews to end abruptly as it is confusing. From T132522:
Currently, there is either a character count or word count limiting hovercard text. In the case that the text ends mid-sentence, there should be an [ellipsis] to indicate there is more text.
Description
Page previews need visual design improvement in the following areas:
- Shadow depth.
- No border.
- Transition time.
- Long extract handling.
Acceptance Criteria
- Reduce the fade-in animation delay from 0.3s to 0.2s.
- As in the Cards extension, use a pseudo element to fade out a long text extract as truncating multiline text in CSS is hard.
- Apply the following to all previews (including generic previews).
.mwe-popups { box-shadow: box-shadow: 0 30px 90px -20px rgba(0,0,0,0.3), 0px 0px 1px rgba(0,0,0,0.5); border: none; border-radius: 2px; }