Skip to content

Commit e639616

Browse files
committed
Updated markdown
1 parent 356b0fb commit e639616

File tree

3 files changed

+4
-14
lines changed

3 files changed

+4
-14
lines changed

styling/03.style-functions.md

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,7 @@
11
# Style Functions
22
Since we’re using JavaScript, we can also employ helper functions for styling elements.
33

4-
### Reference:
5-
- http://jxnblk.com/writing/posts/patterns-for-style-composition-in-react/
6-
7-
1. EXAMPLE 1
4+
#### Example 1
85

96
A function to create rgba values of black
107
```javascript
@@ -26,7 +23,7 @@ const shade = [
2623
// shade[4] is 'rgba(0, 0, 0, 0.5)'
2724
```
2825

29-
2. EXAMPLE 2
26+
#### Example 2
3027

3128
Creating a scale for margin and padding to help keep visual rhythm consistent
3229
```javascript

styling/04.using-npm-modules.md

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,7 @@
11
# Using npm modules
22
For more complex color/style transformation logic, it's always god to use it from a separate npm module (or) create one.
33

4-
### Reference:
5-
- http://jxnblk.com/writing/posts/patterns-for-style-composition-in-react/
6-
7-
8-
Example:
4+
#### Example
95

106
For darkening scales in CSS you can use `chroma-js` module
117
```javascript

styling/05.base-component.md

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,6 @@
33
There is tremendous amount of flexibility when it comes to composition in React – since components are essentially just functions.
44
By changing style details in a component to props we can make it more reusable.
55

6-
### Reference:
7-
- http://jxnblk.com/writing/posts/patterns-for-style-composition-in-react/
8-
96
The color and backgroundColor properties have been moved up to the component’s props.
107
Additionally, we’ve added a big prop to adjust the padding top and bottom.
118
```javascript
@@ -38,7 +35,7 @@ const Button = ({
3835
)
3936
};
4037
```
41-
Usage Example
38+
#### Usage
4239
```javascript
4340
const Button = () => (
4441
<div>

0 commit comments

Comments
 (0)