Fix coloring of the “Split Transaction” button in the category picker (#640)

packages/loot-design/src/components/CategorySelect.js

@@ -66,7 +66,11 @@ export function CategoryList({
                 data-testid="split-transaction-button"
               >
                 <Text style={{ lineHeight: 0 }}>
-                  <Split width={10} height={10} style={{ marginRight: 5 }} />
+                  <Split
+                    width={10}
+                    height={10}
+                    style={{ marginRight: 5, color: 'inherit' }}
+                  />
                 </Text>
                 Split Transaction
               </View>

packages/loot-design/src/svg/v0/Delete.js

@@ -12,7 +12,7 @@ const SvgDelete = props => (
   >
     <path
       fill="none"
-      stroke="#000"
+      stroke="currentColor"
       strokeWidth={4}
       strokeLinecap="round"
       strokeMiterlimit={10}

packages/loot-design/src/svg/v0/Delete.svg

@@ -7,7 +7,7 @@
 >
   <line
     fill="none"
-    stroke="black"
+    stroke="currentColor"
     strokeWidth="4"
     strokeLinecap="round"
     strokeMiterlimit="10"
@@ -18,7 +18,7 @@
   />
   <line
     fill="none"
-    stroke="black"
+    stroke="currentColor"
     strokeWidth="4"
     strokeLinecap="round"
     strokeMiterlimit="10"

packages/loot-design/src/svg/v0/Merge.js

@@ -13,11 +13,11 @@ const SvgMerge = props => (
   >
     <path
       d="M24 29h5.333M8 29H2.667M16 21l-8 8M16 21l8 8M16 2.667v18.666M16 2.667 8 9.333M16 2.667l8 6.666"
-      stroke="#000"
+      fill="none"
+      stroke="currentColor"
       strokeWidth={3.5}
       strokeMiterlimit={10}
       strokeLinecap="round"
-      fill="currentColor"
     />
   </svg>
 );

packages/loot-design/src/svg/v0/Split.js

@@ -13,11 +13,11 @@ const SvgSplit = props => (
   >
     <path
       d="m30 9-4-4M30 9l-4 4M6 5 2 9M2 9l4 4M10 9H3M22 9h7M16 15l6-6M16 15l-6-6M16 28V15"
-      stroke="#000"
+      fill="none"
+      stroke="currentColor"
       strokeWidth={3.5}
       strokeMiterlimit={10}
       strokeLinecap="round"
-      fill="currentColor"
     />
   </svg>
 );

packages/loot-design/src/svg/v0/merge.svg

 <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M24 29H29.3333" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M8.00002 29H2.66669" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M16 21L8 29" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M16 21L24 29" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M16 2.66669V21.3334" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M16 2.66669L8 9.33335" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M16 2.66669L24 9.33335" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M24 29H29.3333" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M8.00002 29H2.66669" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M16 21L8 29" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M16 21L24 29" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M16 2.66669V21.3334" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M16 2.66669L8 9.33335" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M16 2.66669L24 9.33335" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
 </svg>

packages/loot-design/src/svg/v0/split.svg

 <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M30 9L26 5" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M30 9L26 13" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M6 5L2 9" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M2 9L6 13" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M10 9H3" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M22 9H29" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M16 15L22 9" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M16 15L10 9" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
-<path d="M16 28L16 15" stroke="black" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M30 9L26 5" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M30 9L26 13" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M6 5L2 9" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M2 9L6 13" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M10 9H3" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M22 9H29" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M16 15L22 9" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M16 15L10 9" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M16 28L16 15" fill="none" stroke="currentColor" stroke-width="3.5" stroke-miterlimit="10" stroke-linecap="round"/>
 </svg>