Khan / Khan/aphrodite

CSS Custom Properties Should not be kebabified

Open
#339 0 comments 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
5.3k
Forks
187
PR merge metrics
No merged PRs in 30d

Description

Currently if a user tries to overwrite css custom properties using aphrodite the key will run through kebabify, and could possibily end up with the wrong value.

Example:
###In
```js
const styles = StyleSheet.create({
item: {
'--Some-Custom_Property': '#fff',
}
});
```
Out
```css
.item_someHash {
---some--custom_-property: #fff;
}
```

The issue lies in the `kebabifyStyleName` utility.

Contributor guide

No contributing guide indexed for this repository

Research direction

Start with the kebabifyStyleName utility identified in the issue and reproduce the shown custom-property example. Verify how the utility transforms names beginning with --, then confirm that CSS custom property names retain their intended spelling while regular style names are still kebabified.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, javascript
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.