pathways: hover a direction to preview the next photo as a translucent ghost, click to place it (choosePlacement refactor, ghost cleared on move)

1 files changed, 5 insertions, 0 deletions

diff --git a/public/app.css b/public/app.css
index ceac2aa..e1f3db0 100644
--- a/public/app.css
+++ b/public/app.css
@@ -44,6 +44,11 @@ html, body {
 }
 .tile img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 6px; }
 .tile.lock { animation: lock .5s cubic-bezier(.22, 1, .36, 1); }
+.tile.ghost {
+  opacity: .5;
+  pointer-events: none;
+  box-shadow: 0 0 0 2px rgba(125, 211, 252, .65);
+}
 
 @keyframes lock {
   0%   { transform: scale(.2); opacity: 0; }