nearby: animate devices appearing in share target list

animation is per element without chaining as noted in the bug.

Bug: 1155674
Change-Id: I42cc7447c2552007a37ab01c0d22ab7a143a912b
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2575719Reviewed-by: James Vecore <vecore@google.com>
Commit-Queue: Joon Ahn <joonbug@chromium.org>
Cr-Commit-Position: refs/heads/master@{#834272}

chrome/browser/resources/nearby_share/nearby_discovery_page.html

@@ -119,6 +119,21 @@
     line-height: 20px;
     margin-inline-end: var(--nearby-page-space-large-inline);
   }
+
+  nearby-device {
+    animation: 200ms cubic-bezier(0.4, 0, 0.2, 1) slide-up;
+    animation: 200ms linear fade-in;
+  }
+
+  @keyframes fade-in {
+    0% { opacity: 0; }
+    100% { opacity: 1; }
+  }
+
+  @keyframes slide-up {
+    0% { transform: translateY(2px); }
+    100% { transform: translateY(0); }
+  }
 </style>
 
 <nearby-page-template title="$i18n{nearbyShareDiscoveryPageTitle}"