docs(styled-system): color mode#33
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
codebender828
left a comment
codebender828
left a comment
There was a problem hiding this comment.
Looks good. requested a change about the color mode script
| ### Adding the `ColorModeScript` | ||
|
|
||
| The color mode script needs to be added before the content inside the `body` tag | ||
| for local storage syncing to work correctly. | ||
|
|
||
| This script will be added automatically by Chakra UI Vue. | ||
|
|
||
| > To use `ColorModeScript` on a site with strict `Content-Security-Policy`, you | ||
| > can use the `nonce` prop that will be passed to the `<script>` tag. |
There was a problem hiding this comment.
Let's remove this section. The user doesn't need to know about it. 👍🏽
codebender828
left a comment
codebender828
left a comment
There was a problem hiding this comment.
Looks good. requested a change about the color mode script
This comment was marked as duplicate.
This comment was marked as duplicate.
Sorry, something went wrong.
This comment was marked as duplicate.
This comment was marked as duplicate.
Sorry, something went wrong.
| scenarios, you might need to make your component respond to color mode. | ||
|
|
||
| > **Tip:** Chakra stores the color mode in `localStorage` or in `cookies` and appends a | ||
| > className to the `body` to ensure the color mode is persistent. |
There was a problem hiding this comment.
| > className to the `body` to ensure the color mode is persistent. | |
| > class to the `body` to ensure the color mode is persistent. |
Maybe this is better since it's not React ?
| Here's an example that changes the `background-color` and `color` using the | ||
| `useColorModeValue` composable. | ||
|
|
||
| ```js |
There was a problem hiding this comment.
| ```js | |
| ```vue |
Or html works
| `useColorMode` is a composable that gives you access to the current color mode, | ||
| and a function to toggle the color mode. | ||
|
|
||
| ```js |
There was a problem hiding this comment.
| ```js | |
| ```vue |
|
@carwack Looks good, great work ! I just added a few comments, nothing important, just some nitpicks |
3 participants
Docs for Color mode in Chakra UI Vue.
Color Mode components are not completely working so far, testing out here: https://codesandbox.io/p/sandbox/intelligent-carlos-oyji8q?file=%2Fsrc%2Fcomponents%2FHelloChakra.vue%3A22%2C21