-
- {sync.data.path.directory}
+
+
+ {getFilename(sync.data.path.directory)}
-
-
-
-
+
+
- x.id}
diff --git a/packages/ui/src/components/button.css b/packages/ui/src/components/button.css
index 7bf09685..0db3fcf3 100644
--- a/packages/ui/src/components/button.css
+++ b/packages/ui/src/components/button.css
@@ -45,6 +45,10 @@
border-color: var(--border-focus);
background-color: var(--surface-focus);
}
+
+ [data-slot="icon"] {
+ color: var(--icon-strong-base);
+ }
}
&[data-variant="ghost"] {
@@ -66,7 +70,10 @@
}
&[data-size="normal"] {
- padding: 0 6px 0 6px;
+ padding: 0 6px;
+ &[data-icon] {
+ padding: 0 6px 0 4px;
+ }
font-size: var(--font-size-small);
line-height: var(--line-height-large);
@@ -75,7 +82,12 @@
&[data-size="large"] {
height: 32px;
- padding: 0 8px 0 6px;
+ padding: 0 8px;
+
+ &[data-icon] {
+ padding: 0 8px 0 6px;
+ }
+
gap: 8px;
font-family: var(--font-family-sans);
diff --git a/packages/ui/src/components/button.tsx b/packages/ui/src/components/button.tsx
index cae65843..d28e25af 100644
--- a/packages/ui/src/components/button.tsx
+++ b/packages/ui/src/components/button.tsx
@@ -1,26 +1,32 @@
import { Button as Kobalte } from "@kobalte/core/button"
-import { type ComponentProps, splitProps } from "solid-js"
+import { type ComponentProps, Show, splitProps } from "solid-js"
+import { Icon, IconProps } from "./icon"
export interface ButtonProps
extends ComponentProps