UX: increase selector specificity so that "inline" lightboxes in quotes don't get backgrounds

UX: increase selector specificity so that "inline" lightboxes in quotes don't get backgrounds

When a quote is not expanded and it contains lightboxes, those lightboxes are not displayed and instead we show a link that looks like this [image_title]

These still have the lightbox CSS class and so they still get the backgrounds we add to lightboxes while they load. Increasing the selector specificity prevents that from happening.

diff --git a/app/assets/stylesheets/common/base/lightbox.scss b/app/assets/stylesheets/common/base/lightbox.scss
index 5a9e7ee..5833152 100644
--- a/app/assets/stylesheets/common/base/lightbox.scss
+++ b/app/assets/stylesheets/common/base/lightbox.scss
@@ -1,4 +1,4 @@
-.lightbox {
+.lightbox-wrapper .lightbox {
   position: relative;
   display: inline-block;

GitHub sha: 8ef20855

2 Likes