feat(reset): allow customize default border color, close #2961

packages/reset/tailwind-compat.css

@@ -5,6 +5,7 @@ Please read: https://github.com/unocss/unocss/blob/main/packages/reset/tailwind-
 /*
 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
+2. [UnoCSS]: allow to override the default border color with css var `--un-default-border-color`
 */
 
 *,
@@ -13,7 +14,7 @@ Please read: https://github.com/unocss/unocss/blob/main/packages/reset/tailwind-
   box-sizing: border-box; /* 1 */
   border-width: 0; /* 2 */
   border-style: solid; /* 2 */
-  border-color: #e5e7eb; /* 2 */
+  border-color: var(--un-default-border-color, #e5e7eb); /* 2 */
 }
 
 /*

packages/reset/tailwind-compat.md

@@ -4,6 +4,8 @@ Based on [tailwind.css](./tailwind.css), with some styles clean up to avoid conf
 
 ### Changes
 
+#### [Changes inherit from `tailwind.css`](./tailwind.md)
+
 #### Remove background color override for buttons
 
 Linked issue: [#2127](https://github.com/unocss/unocss/issues/2127)

packages/reset/tailwind.css

@@ -1,6 +1,7 @@
 /*
 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
+2. [UnoCSS]: allow to override the default border color with css var `--un-default-border-color`
 */
 
 *,
@@ -9,7 +10,7 @@
   box-sizing: border-box; /* 1 */
   border-width: 0; /* 2 */
   border-style: solid; /* 2 */
-  border-color: #e5e7eb; /* 2 */
+  border-color: var(--un-default-border-color, #e5e7eb); /* 2 */
 }
 
 /*

packages/reset/tailwind.md

@@ -0,0 +1,21 @@
+# @unocss/reset/tailwind.css
+
+Based on [Tailwind's preflight](https://tailwindcss.com/docs/preflight), in static forms.
+
+## Changes
+
+### Static
+
+This is provided as a static version of Tailwind's preflight, so it doesn't inherit any styles from the theme.
+
+#### Border color
+
+In Tailwind's preflight, the border color default border color is read from the theme `borderColor.DEFAULT`. To customize it in Uno's reset, we use CSS variable instead:
+
+```css
+@import '@unocss/reset/tailwind.css';
+
+:root {
+  --un-default-border-color: #e5e7eb;
+}
+```