Skip to content

Commit 81c2d6c

Browse files
authored
Merge pull request #110 from opensrc0/develop
Changed lint and themePrapare
2 parents 6c05718 + a72755e commit 81c2d6c

21 files changed

Lines changed: 309 additions & 304 deletions

.eslintrc

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,11 @@
4040
"react/jsx-filename-extension": ["error", { "extensions": [".js"] }],
4141
"react/require-default-props": ["off"],
4242
"react/jsx-props-no-spreading": ["off"],
43-
"no-restricted-exports": ["off"]
43+
"no-restricted-exports": ["off"],
44+
"comma-dangle": ["error", "never"],
45+
"quotes": ["error", "double"],
46+
"quote-props": ["error", "always"],
47+
"semi": ["error", "never"]
4448
}
4549
}
50+

.github/COMMAND.md

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
   ==> Create config file for all the component of fe-theme
2+
```js
3+
COMPONENT_CONFIG_PATH=./{PATH} CURRENT_APP_DIR=$(pwd) npm run theme-prepare --prefix ./node_modules/fe-theme
4+
```
5+
6+
<p align="center">OR</p>
7+
8+
&nbsp;&nbsp; ==> Creating config file for an individual component
9+
```js
10+
COMPONENET_NAME={COMPONENT_NAME} COMPONENT_CONFIG_PATH=./{PATH} CURRENT_APP_DIR=$(pwd) npm run theme-prepare --prefix ./node_modules/fe-theme
11+
```
12+
13+
&nbsp;&nbsp; **Note:**
14+
15+
&nbsp;&nbsp; ```1. PATH``` is a variable i.e. where you want to place config files in your application
16+
17+
&nbsp;&nbsp; ```2. COMPONENT_NAME``` is a variable i.e. name of the component ```Input```, ```button```. [Find the component list](./COMPONENT.md)

Init.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import merge from 'lodash.merge';
2-
import defaultTheme from './__appset/universal/theme';
1+
import merge from "lodash.merge"
2+
import defaultTheme from "./__appset/theme"
33

44
export default function Init(userTheme) {
5-
const mergeTheme = merge(defaultTheme, userTheme);
5+
const mergeTheme = merge(defaultTheme, userTheme)
66

7-
return mergeTheme;
7+
return mergeTheme
88
}

README.md

Lines changed: 27 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -92,25 +92,40 @@ import Button from 'fe-theme/Button';
9292

9393
Wow, the configuration is quite simple, but wait... button design is different in my application. No worry, follow step 3, 4.
9494

95-
#### 3. Creating a fe-theme folder in your application. It contains components config file.
95+
#### 3. Create your own theme
9696

97-
&nbsp;&nbsp;Create config file for all the component of fe-theme
98-
```js
99-
COMPONENT_CONFIG_PATH=./{PATH} CURRENT_APP_DIR=$(pwd) npm run theme-prepare --prefix ./node_modules/fe-theme
100-
```
101-
102-
<p align="center">OR</p>
97+
&nbsp;&nbsp; **a)** Create an empty folder called ```fe-theme``` in your application at any location.
10398

104-
&nbsp;&nbsp; Creating config file for an individual component
99+
&nbsp;&nbsp; **b)** Create configButton.js file inside fe-theme folder
105100
```js
106-
COMPONENET_NAME={COMPONENT_NAME} COMPONENT_CONFIG_PATH=./{PATH} CURRENT_APP_DIR=$(pwd) npm run theme-prepare --prefix ./node_modules/fe-theme
101+
const Button = {
102+
"borderRadius": "50px",
103+
"borderColor": "12px",
104+
"primary": {
105+
"color": "white",
106+
"borderColor": "white"
107+
},
108+
"secondary": {
109+
"color": "white",
110+
"borderColor": "white"
111+
}
112+
}
113+
114+
export default Button;
107115
```
116+
&nbsp;&nbsp; **Note** Config file name start with ```config``` keyword along with ```component Name``` like ```configButton.js```/```configInput.js```
108117

109-
&nbsp;&nbsp; **Note:**
118+
&nbsp;&nbsp; **c)** Create theme.js file and include configButton.js
119+
```js
120+
/* eslint-disable import/no-anonymous-default-export */
121+
import Button from '../configButton';
110122

111-
&nbsp;&nbsp; ```1. PATH``` is a variable i.e. where you want to place config files in your application
123+
export default {
124+
Button,
125+
};
112126

113-
&nbsp;&nbsp; ```2. COMPONENT_NAME``` is a variable i.e. name of the component ```Input```, ```button```. [Find the component list](./.github/COMPONENT.md)
127+
```
128+
Yeah, We have created config files Mannually but You can also generate config files automatically using command line [Check Commands](./.github/COMMAND.md)
114129

115130
#### 4. Passing configuration settings to the fe-theme library using ThemeProvider
116131

__application/utils/constants.js

Lines changed: 28 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,35 @@
1-
/* eslint-disable */
2-
export const MONTHS_NAME = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
3-
'Jul', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec',
4-
];
1+
export const MONTHS_NAME = ["Jan", "Feb", "Mar", "Apr", "May", "Jun",
2+
"Jul", "Aug", "Sept", "Oct", "Nov", "Dec"
3+
]
54

65
export const timeMap = {
7-
1: '13',
8-
2:'14',
9-
3:'15',
10-
4:'16',
11-
5:'17',
12-
6:'18',
13-
7:'19',
14-
8:'20',
15-
9:'21',
16-
10:'22',
17-
11:'23',
18-
12:'24',
6+
"1": "13",
7+
"2": "14",
8+
"3": "15",
9+
"4": "16",
10+
"5": "17",
11+
"6": "18",
12+
"7": "19",
13+
"8": "20",
14+
"9": "21",
15+
"10": "22",
16+
"11": "23",
17+
"12": "24"
1918
}
2019

2120
// YEAR MAPPING
2221

2322
export const yearMapping = {
24-
1: 'Jan',
25-
2: 'Feb',
26-
3: 'Mar',
27-
4: 'Apr',
28-
5: 'May',
29-
6: 'Jun',
30-
7: 'Jul',
31-
8: 'Aug',
32-
9: 'Sept',
33-
10: 'Oct',
34-
11: 'Nov',
35-
12: 'Dec',
36-
};
23+
"1": "Jan",
24+
"2": "Feb",
25+
"3": "Mar",
26+
"4": "Apr",
27+
"5": "May",
28+
"6": "Jun",
29+
"7": "Jul",
30+
"8": "Aug",
31+
"9": "Sept",
32+
"10": "Oct",
33+
"11": "Nov",
34+
"12": "Dec"
35+
}

__appset/configButton.js

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
1-
/* eslint-disable */
21
const Button = {
3-
"borderRadius": "50px",
4-
"borderColor": "12px",
5-
"primary": {
6-
"color": "white",
7-
"borderColor": "white"
8-
},
9-
"secondary": {
10-
"color": "white",
11-
"borderColor": "white"
12-
}
2+
"primary": {
3+
"color": "white",
4+
"background": "#03567b",
5+
"borderColor": "white",
6+
"borderRadius": "4px"
7+
},
8+
"secondary": {
9+
"color": "white",
10+
"background": "#03567b",
11+
"borderColor": "white",
12+
"borderRadius": "4px"
13+
}
1314
}
1415

15-
export default Button;
16+
export default Button

__appset/configChip.js

Lines changed: 20 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,22 @@
1-
/* eslint-disable */
2-
const Button = {
3-
"borderRadius": "50px",
4-
"borderColor": "12px",
5-
"primary": {
6-
"color": "white",
7-
"borderColor": "white"
8-
},
9-
"secondary": {
10-
"color": "white",
11-
"borderColor": "white"
12-
},
13-
"tertiary": {
14-
"color": "white",
15-
"borderColor": "white"
16-
},
17-
"quaternary": {
18-
"color": "white",
19-
"borderColor": "white"
20-
}
1+
const Chip = {
2+
"borderRadius": "50px",
3+
"borderColor": "12px",
4+
"primary": {
5+
"color": "white",
6+
"borderColor": "white"
7+
},
8+
"secondary": {
9+
"color": "white",
10+
"borderColor": "white"
11+
},
12+
"tertiary": {
13+
"color": "white",
14+
"borderColor": "white"
15+
},
16+
"quaternary": {
17+
"color": "white",
18+
"borderColor": "white"
19+
}
2120
}
2221

23-
export default Button;
22+
export default Chip
Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/* eslint-disable */
21
const color = {
32
"primary": "#00364e",
43
"secondary": "#03567b",
@@ -13,4 +12,4 @@ const color = {
1312
"orange": "#fc6027"
1413
}
1514

16-
export default color;
15+
export default color
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
/* eslint-disable */
21
const FontFamily = {
32
"roboto": "Roboto",
43
"averta": "Averta",
54
"sans": "Open Sans,sans-serif"
65
}
76

8-
export default FontFamily;
7+
export default FontFamily

__appset/configFontSize.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
const FontSize = {
2+
"xxxxxl": "48px",
3+
"xxxxl": "32px",
4+
"xxxl": "28px",
5+
"xxl": "24px",
6+
"xl": "20px",
7+
"l": "18px",
8+
"m": "16px",
9+
"md": "15px",
10+
"s": "14px",
11+
"sm": "13px",
12+
"xs": "12px",
13+
"xxs": "11px",
14+
"xxxs": "10px",
15+
"xxxxs": "8px"
16+
}
17+
18+
export default FontSize

0 commit comments

Comments
 (0)