Change default button border color

Author: gjmooney

packages/base/src/panelview/components/story-maps/StoryNavBar.tsx

@@ -13,20 +13,10 @@ interface IStoryNavBarProps {
 function StoryNavBar({ onPrev, onNext, hasPrev, hasNext }: IStoryNavBarProps) {
   return (
     <div style={{ display: 'flex', gap: '8px', justifyContent: 'center' }}>
-      <Button
-        onClick={onPrev}
-        disabled={!hasPrev}
-        aria-label="Previous slide"
-        style={{ border: '1px solid var(--jp-layout-color0)' }}
-      >
+      <Button onClick={onPrev} disabled={!hasPrev} aria-label="Previous slide">
         <ChevronLeft />
       </Button>
-      <Button
-        onClick={onNext}
-        disabled={!hasNext}
-        aria-label="Next slide"
-        style={{ border: '1px solid var(--jp-layout-color0)' }}
-      >
+      <Button onClick={onNext} disabled={!hasNext} aria-label="Next slide">
         <ChevronRight />
       </Button>
     </div>

packages/base/style/shared/button.css

@@ -10,7 +10,7 @@
   background-color: var(--jp-layout-color0);
   color: var(--jp-ui-font-color0);
   border: 0.0375rem solid
-    color-mix(in srgb, var(--jp-accent-color0), transparent 20%);
+    color-mix(in srgb, var(--jp-border-color1), transparent 20%);
   transition: background-color 0.2s ease;
   height: 2.5rem;
   padding-left: 1rem;