Просмотр исходного кода

tweak(ui): use chevron icons for review diff rows

David Hill 6 месяцев назад
Родитель
Сommit
40f00ccc1c

+ 11 - 0
packages/ui/src/components/session-review.css

@@ -213,6 +213,17 @@
     justify-content: flex-end;
   }
 
+  [data-slot="session-review-diff-chevron"] {
+    display: inline-flex;
+    color: var(--icon-weaker);
+    transform: rotate(-90deg);
+    transition: transform 0.15s ease;
+  }
+
+  [data-slot="accordion-item"][data-expanded] [data-slot="session-review-diff-chevron"] {
+    transform: rotate(0deg);
+  }
+
   [data-slot="session-review-change-group"] {
     display: inline-flex;
     align-items: center;

+ 3 - 1
packages/ui/src/components/session-review.tsx

@@ -570,7 +570,9 @@ export const SessionReview = (props: SessionReviewProps) => {
                                   <DiffChanges changes={diff} />
                                 </Match>
                               </Switch>
-                              <Icon name="chevron-grabber-vertical" size="small" />
+                              <span data-slot="session-review-diff-chevron">
+                                <Icon name="chevron-down" size="small" />
+                              </span>
                             </div>
                           </div>
                         </Accordion.Trigger>