Skip to content
This repository has been archived by the owner on Nov 21, 2023. It is now read-only.

Fix blurry images in Safari #178

Merged
merged 1 commit into from
Oct 21, 2016
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 4 additions & 3 deletions src/css/_fluidbox.scss
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,10 @@ $fluidbox__animation-bg-color: $fluidbox__overlay-bg-color !default;
opacity: 0;
pointer-events: none;
position: fixed;
top: 0;
/* Negative top and bottom is to fix some Safari cases where image got blurry */
top: -100%;
left: 0;
bottom: 0;
bottom: -100%;
right: 0;
/* Transition time for overlay is halved to ensure that flickering doesn't happen */
transition: all $fluidbox__transition-duration ease-in-out;
Expand Down Expand Up @@ -101,4 +102,4 @@ $fluidbox__animation-bg-color: $fluidbox__overlay-bg-color !default;
&::before {
animation: fluidboxLoading 1s 0s infinite ease-in-out forwards;
}
}
}