File tree Expand file tree Collapse file tree 3 files changed +6
-3
lines changed Expand file tree Collapse file tree 3 files changed +6
-3
lines changed Original file line number Diff line number Diff line change @@ -59,6 +59,7 @@ npm install react-dot-cursor
5959## Getting Started
6060
6161Add the ` Cursor ` component to your app:
62+
6263``` tsx
6364import { Cursor } from ' react-dot-cursor' ;
6465
@@ -72,6 +73,7 @@ const App = () => {
7273```
7374
7475Then remove the default cursor with CSS:
76+
7577``` css
7678* {
7779 cursor : none !important ;
Original file line number Diff line number Diff line change @@ -48,7 +48,7 @@ You can change the z-index of the cursor by modifying the `zIndex` prop. Default
4848The theme prop allows you to customize the cursor's appearance and behavior through variants and rules.
4949
5050``` tsx
51- const theme = {
51+ const theme: CursorTheme = {
5252 variants: {
5353 custom: {
5454 style: {
@@ -77,6 +77,7 @@ const theme = {
7777
7878<Cursor theme = { theme } />;
7979```
80+ > It is also possible to add several selectors in this way ` selector: ['.custom-element1', '.custom-element2'] `
8081
8182### ` defaultColor ` Prop
8283
Original file line number Diff line number Diff line change @@ -35,7 +35,7 @@ The cursor automatically detects system dark mode preferences and adjusts its co
3535Each variant can have its own unique styling through the theme configuration:
3636
3737``` tsx
38- const theme = {
38+ const theme: CursorTheme = {
3939 variants: {
4040 custom: {
4141 style: {
@@ -67,7 +67,7 @@ const theme = {
6767The cursor uses Motion for animations. You can customize the animation properties in your variants:
6868
6969``` tsx
70- const theme = {
70+ const theme: CursorTheme = {
7171 variants: {
7272 custom: {
7373 style: {
You can’t perform that action at this time.
0 commit comments