Web Inspector: Timelines Tab: Screenshots: images should have somethi…

…ng to make them "pop" when not selected

https://bugs.webkit.org/show_bug.cgi?id=240850

Reviewed by Patrick Angle.

* Source/WebInspectorUI/UserInterface/Views/ScreenshotsTimelineView.css:
(.timeline-view.screenshots > img):
(.timeline-view.screenshots > img.selected):

Canonical link: https://commits.webkit.org/250937@main
git-svn-id: https://svn.webkit.org/repository/webkit/trunk@294772 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Source/WebInspectorUI/UserInterface/Views/ScreenshotsTimelineView.css

@@ -34,17 +34,18 @@
     max-width: calc(80% - (var(--margin) * 2));
     max-height: calc(100% - (var(--margin) * 2));
     margin: var(--margin);
-    border: 2px solid transparent;
+    box-shadow: var(--shadow);
 
     --margin: 20px;
+    --shadow: 1px 2px 6px rgba(0, 0, 0, 0.58);
 }
 
 .timeline-view.screenshots > img + img {
     margin-inline-start: 0;
 }
 
 .timeline-view.screenshots > img.selected {
-    border-color: var(--glyph-color-active);
+    box-shadow: 0 0 0 2px var(--glyph-color-active), var(--shadow);
     scroll-snap-align: center;
 }