vlitejs / vlite

🦋 vLitejs is a fast and lightweight Javascript library for customizing video and audio player in Javascript with a minimalist theme (HTML5, Youtube, Vimeo, Dailymotion)
https://vlite.js.org
MIT License
268 stars 18 forks source link

CSS variables name #54

Closed michey85 closed 3 years ago

michey85 commented 3 years ago

Description

I met a plroblem with the name style of your CSS variables.

I use Styled-components and want to customize colors for the player, but under the hood Styled-components transforms all my camelCase CSS properties to kebab-case, so it becomes impossible to customize Vlitejs (for example --vlite-colorPrimary becomes --vlite-color-primary and my custom colors doesn't work).

I understand it's difficult to save backward compatibility with CSS names, but maybe it's possible to have a mapping between two styles of CSS variables naming - kebab-style to camelCase.

yoriiis commented 3 years ago

I think we should rather look on the side of styled component or the tool used to bundle the code. Maybe it's possible to ignore the camel/kebab transformation from a regexp (vlite-), I don't know.

I am not going to manage several nomenclature of variables.