Skip to content
This repository has been archived by the owner on Dec 11, 2019. It is now read-only.

Compare: Refactoring styles to Aphrodite

Showing with 157 additions and 43 deletions.
  1. +73 −0 All-About-Ad-Blocking.md
  2. +45 −37 Desired-extensions.md
  3. +21 −2 Install-on-Linux.md
  4. +2 −1 Manual-Tests.md
  5. +13 −0 Refactoring-styles-to-Aphrodite.md
  6. +1 −1 Reviewer-guideline.md
  7. +2 −2 Troubleshooting.md
13 changes: 13 additions & 0 deletions Refactoring-styles-to-Aphrodite.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,19 @@ const styles = StyleSheet.create({

While refactoring please bear in mind to avoid using hardcoded values (width, height, size, etc) and consider to import from `globalStyles` as far as possible.

If your style is conditional and has more than one condition, consider putting them in a constant to make it clearer/more readable:

```
// Bad
className={css(this.navBar && this.braveLogo && styles.braveLogoImage)}
```

```
// Good
const navBarBraveLogo = this.navBar && this.braveLogo
className={css(navBarBraveLogo && styles.braveLogoImage)}
```

Also, please search `commonStyles` for the styles you are going to specify. If they were already specified, please import them from it like this way:

```jsx
Expand Down