Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add cursor (.cur) format to build-in assets type list #18679

Open
4 tasks done
otomad opened this issue Nov 15, 2024 · 0 comments · May be fixed by #18680
Open
4 tasks done

Add cursor (.cur) format to build-in assets type list #18679

otomad opened this issue Nov 15, 2024 · 0 comments · May be fixed by #18680

Comments

@otomad
Copy link

otomad commented Nov 15, 2024

Description

It is useful when you want to use your own cursor file in the CSS cursor property.

https://developer.mozilla.org/en-US/docs/Web/CSS/cursor

Suggested solution

Add "cur" type in

// images
declare module '*.apng' {
const src: string
export default src
}
declare module '*.bmp' {
const src: string
export default src
}
declare module '*.png' {
const src: string
export default src
}
declare module '*.jpg' {
const src: string
export default src
}
declare module '*.jpeg' {
const src: string
export default src
}
declare module '*.jfif' {
const src: string
export default src
}
declare module '*.pjpeg' {
const src: string
export default src
}
declare module '*.pjp' {
const src: string
export default src
}
declare module '*.gif' {
const src: string
export default src
}
declare module '*.svg' {
const src: string
export default src
}
declare module '*.ico' {
const src: string
export default src
}
declare module '*.webp' {
const src: string
export default src
}
declare module '*.avif' {
const src: string
export default src
}

// images
'apng',
'bmp',
'png',
'jpe?g',
'jfif',
'pjpeg',
'pjp',
'gif',
'svg',
'ico',
'webp',
'avif',

Alternative

No response

Additional context

Usage

import myFancyCursor from "src/assets/cursors/my_fancy_cursor.cur";

const ComponentWithFancyCursor = styled.div`
    cursor: url("${myFancyCursor}"), default;
`;

In fact, I'd like to add the animated cursor (.ani) format as well, which unfortunately doesn't seem to be supported by CSS.

Validations

otomad added a commit to otomad/vite that referenced this issue Nov 15, 2024
@otomad otomad linked a pull request Nov 15, 2024 that will close this issue
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant