Commit Graph

12 Commits

Author SHA1 Message Date
Tim Abbott 2de0e1eec4 lightbox: Remove use of unicode in CSS.
This caused errors in `manage.py collectstatic`.
2017-01-10 17:11:34 -08:00
brockwhittaker 4d10c4274b Fix text overflow in lightbox.
This fixes the user’s name to not fall on the next line. Instead it
appears on the same line and overflows properly into an ellipsis so it
theoretically should never overflow on to the next line.
2017-01-10 12:50:11 -08:00
Brock Whittaker 51153a6ce2 Change scope of pointer events for lightbox overlay.
This was intercepting pointer events even though the lightbox was
closed. This fixes the issue with the streams exit not working in some
responsive cases.

Fixes: #2818.
2016-12-26 18:31:18 -08:00
Brock Whittaker 1562f9fe76 lightbox: Fix Z-Index for Proper Ordering.
This fixes the z-index of the lightbox overlay, which previously
appeared behind the header, and the muting notification to be above
everything else on the page.
2016-10-28 13:57:37 -07:00
Brock Whittaker 2ce601ebd1 Fix Multiple Lightbox Issues.
This fixes the following issues:
1. Photos are no longer resized larger than their native resolution.
2. Photos with transparency now have a checkerboard behind them to
signal an alpha of less than one.
2016-10-25 14:51:35 -07:00
Brock Whittaker 10f7146ddd Change Lightbox to Support YouTube Videos.
The lightbox will now distinguish between whether or not something is a
photo and a YouTube video by the class name of the message inline
preview. It embeds the YouTube video in the lightbox as an iFrame
rather than previewing the video screenshot.
2016-10-18 14:45:47 -07:00
Brock Whittaker 3494fa0635 Add lightbox media queries.
Add media queries to hide the image actions if on mobile (probably
unnecessary to have), and make the image description (name, author)
close to full width.
2016-10-11 15:22:31 -07:00
Brock Whittaker 162ee29aee Lightbox Overlay Style Fixes.
This fixes two minor issues with the lightbox styling:

1. The width was not supposed to be calc(100% - 20px) anymore. It now
should just be full width.

2. The exit button was not vertically aligned exactly nor horizontally
centered between the edge of the nearest button and the edge of the
screen. Both are fixed with the new margin.
2016-10-11 15:22:14 -07:00
Brock Whittaker a550399f7d lightbox: Change aesthetic to white-on-blue design.
No longer is there a white information bar at the bottom. Now it is all
aligned to the top.
2016-09-30 16:44:40 -07:00
Brock Whittaker 6b3aded32d Aesthetic Changes for Overlay.
This includes reduced title font size to bring the total info bar
height to the same height as the buttons, and an image preview that
doesn’t hit the walls of the container.
2016-09-30 16:42:26 -07:00
Tim Abbott aaa221233a lint: Ban 2-space indentation in our CSS.
Probably most properly we should check for any number of spaces that
isn't 4, but that's a bit more work to do with our linter framework,
and in practice basically every CSS whitespace error we see is 2-space.
2016-09-27 18:06:44 -07:00
Brock Whittaker 87afe61860 Add overlay lightbox for displaying inline image previews.
This adds an event listener (by way of delegation) to the
.message_inline_image elements that pops up the overlay and hides it
when the overlay exit is clicked.

Fixes #654.
2016-09-27 17:50:51 -07:00