chore: improve color documentation

tomcru · Sep 19, 2024 · 76ce716 · 76ce716
1 parent d8073d2
commit 76ce716
Showing 1 changed file with 5 additions and 5 deletions.
diff --git a/README.md b/README.md
@@ -75,7 +75,7 @@ export default function RootLayout({ children }) {
   return (
     <html lang="en">
       <HolyLoader
-        color="#ff4500"
+        color="linear-gradient(to right, #ff7e5f, #feb47b)"
         height="1rem"
         speed={250}
         easing="linear"
@@ -87,7 +87,7 @@ export default function RootLayout({ children }) {
 }
 ```
 
-### Programmatic Control (Client Components)
+### Manual Control (Client Components)
 
 Have an async operation before an eventual route change? You might be interested in holy-loader's manual controls. These only work in client components!
 
@@ -125,13 +125,13 @@ onClick={(e) => {
 
 | Prop                 | Type                 | Description                                                                                                  | Default      |
 |----------------------|----------------------|--------------------------------------------------------------------------------------------------------------|--------------|
-| `color`              | `string`             | Specifies the color of the top-loading bar.                                                                  | `"#59a2ff"`  |
+| `color`              | `string`             | Specifies the color of the top-loading bar. Accepts any valid CSS `background` value, including gradients.   | `#59a2ff`  |
 | `initialPosition`    | `number`             | Sets the initial position of the top-loading bar as a percentage of the total width.                         | `0.08`       |
 | `height`             | `number` or `string` | Defines the height of the top-loading bar in pixels or CSS unit.                                             | `4px`        |
-| `easing`             | `string`             | Specifies the easing function to use for the loading animation. Accepts any valid CSS easing string.         | `"ease"`     |
+| `easing`             | `string`             | Specifies the easing function to use for the loading animation. Accepts any valid CSS easing string.         | `ease`     |
 | `speed`              | `number`             | Sets the animation speed of the top-loading bar in milliseconds.                                             | `200`        |
 | `zIndex`             | `number`             | Defines the z-index property of the top-loading bar, controlling its stacking order.                         | `2147483647` |
 | `boxShadow`          | `string`             | Sets the box-shadow property of the top-loading bar. Turned off by default.                                  | `null`       |
 | `showSpinner`        | `boolean`            | Determines whether to accompany the loading bar with a spinner. Turned off by default.                       | `false`      |
 | `ignoreSearchParams` | `boolean`            | Determines whether to ignore search parameters in the URL when triggering the loader. Turned off by default. | `false`      |
-| `dir`                | `ltr` or `rtl`       | Sets the direction of the top-loading bar.                                                                   | `'ltr'`      |
+| `dir`                | `ltr` or `rtl`       | Sets the direction of the top-loading bar.                                                                   | `ltr`      |