Skip to content

Commit 5f2515b

Browse files
opensrc0opensrc0
committed
feat(configColor): added dark color
1 parent a72755e commit 5f2515b

5 files changed

Lines changed: 82 additions & 75 deletions

File tree

‎__application/component/Button/Button.js‎

Lines changed: 55 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -1,55 +1,55 @@
1-
import React from 'react';
2-
import PropTypes from 'prop-types';
3-
import styled from 'styled-components';
4-
import cx from 'classnames';
5-
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
1+
import React from "react"
2+
import PropTypes from "prop-types"
3+
import styled from "styled-components"
4+
import cx from "classnames"
5+
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
66

77
const styles = {
8-
size: { s: 'xs', m: 's', l: 's' },
9-
padding: { s: [1, 2], m: [1.5, 2], l: [2, 2] },
8+
"size": { "s": "xs", "m": "s", "l": "s" },
9+
"padding": { "s": [1, 2], "m": [1.5, 2], "l": [2, 2] },
1010

1111
pointerEvents(props) {
1212
if (props.disabled) {
13-
return 'none';
13+
return "none"
1414
}
15-
return '';
15+
return ""
1616
},
1717
opacity(props) {
1818
if (props.disabled) {
19-
return '0.5';
19+
return "0.5"
2020
}
21-
return '';
21+
return ""
2222
},
23-
hover: {
23+
"hover": {
2424
color(props) {
25-
if (props.kind === 'filled') {
26-
return props.theme.color.white;
25+
if (props.kind === "filled") {
26+
return props.theme.color.white
2727
}
28-
if (props.kind === 'outlined') {
29-
return props.theme.color.white;
28+
if (props.kind === "outlined") {
29+
return props.theme.color.white
3030
}
31-
return '';
31+
return ""
3232
},
3333
backgroundColor(props) {
34-
if (props.kind === 'filled') {
35-
return props.theme.color[`${props.color}Dark`];
34+
if (props.kind === "filled") {
35+
return props.theme.color[`${props.color}Dark`]
3636
}
37-
if (props.kind === 'outlined') {
38-
return props.theme.color[props.color];
37+
if (props.kind === "outlined") {
38+
return props.theme.color[props.color]
3939
}
40-
return '';
40+
return ""
4141
},
4242
borderColor(props) {
43-
if (props.kind === 'filled') {
44-
return props.theme.color[`${props.color}Dark`];
43+
if (props.kind === "filled") {
44+
return props.theme.color[`${props.color}Dark`]
4545
}
46-
if (props.kind === 'outlined') {
47-
return props.theme.color[props.color];
46+
if (props.kind === "outlined") {
47+
return props.theme.color[props.color]
4848
}
49-
return '';
50-
},
51-
},
52-
};
49+
return ""
50+
}
51+
}
52+
}
5353

5454
const StyledButton = styled(
5555
({
@@ -60,7 +60,7 @@ const StyledButton = styled(
6060
fluid,
6161
isLoading,
6262
...props
63-
}) => <button {...props} />,
63+
}) => <button {...props} />
6464
)`
6565
display: inline-flex;
6666
align-items: center;
@@ -71,7 +71,7 @@ const StyledButton = styled(
7171
background-color: ${(props) => props.theme.Universal.Color[props.variant]};
7272
font-size: ${(props) => props.theme.Universal.FontSize[styles.size[props.size]]};
7373
padding: ${(props) => props.theme.Universal.PXL(styles.padding[props.size])};
74-
width: ${(props) => props.fluid ? '100%' : ''};
74+
width: ${(props) => props.fluid ? "100%" : ""};
7575
border-width: 1px;
7676
border-style: solid;
7777
border-color: ${(props) => props.theme.Button[props.variant].borderColor};
@@ -84,7 +84,7 @@ const StyledButton = styled(
8484
background-color: ${styles.hover.backgroundColor};
8585
border-color: ${styles.hover.borderColor};
8686
}
87-
`;
87+
`
8888

8989
function Button({ label, disabled, className, onClick, spin, ...props }) {
9090
return (
@@ -108,31 +108,31 @@ function Button({ label, disabled, className, onClick, spin, ...props }) {
108108
}
109109
{label}
110110
</StyledButton>
111-
);
111+
)
112112
}
113113

114114
Button.propTypes = {
115-
label: PropTypes.string,
116-
onClick: PropTypes.func,
117-
fluid: PropTypes.bool,
118-
disabled: PropTypes.bool,
119-
spin: PropTypes.bool,
120-
className: PropTypes.string,
121-
type: PropTypes.oneOf(['submit', 'button']),
122-
variant: PropTypes.string,
123-
size: PropTypes.oneOf(['s', 'm', 'l']),
124-
};
115+
"label": PropTypes.string,
116+
"onClick": PropTypes.func,
117+
"fluid": PropTypes.bool,
118+
"disabled": PropTypes.bool,
119+
"spin": PropTypes.bool,
120+
"className": PropTypes.string,
121+
"type": PropTypes.oneOf(["submit", "button"]),
122+
"variant": PropTypes.string,
123+
"size": PropTypes.oneOf(["s", "m", "l"])
124+
}
125125

126126
Button.defaultProps = {
127-
label: 'Button',
128-
onClick: () => {},
129-
fluid: false,
130-
disabled: false,
131-
spin: false,
132-
className: '',
133-
type: 'submit',
134-
variant: 'secondary',
135-
size: 'm',
136-
};
127+
"label": "Button",
128+
"onClick": () => {},
129+
"fluid": false,
130+
"disabled": false,
131+
"spin": false,
132+
"className": "",
133+
"type": "submit",
134+
"variant": "secondary",
135+
"size": "m"
136+
}
137137

138-
export default Button;
138+
export default Button

‎__appset/configColor.js‎

Lines changed: 18 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,20 @@
1-
const color = {
2-
"primary": "#00364e",
3-
"secondary": "#03567b",
4-
5-
"white": "#ffffff",
6-
"black": "#000000",
7-
8-
"info": "#1976d2",
9-
"success": "#43a047",
10-
"warning": "#ffa000",
11-
"danger": "#d32f2f",
12-
"orange": "#fc6027"
1+
const Color = {
2+
"default": {
3+
"bgColor": "#ffffff",
4+
"primary": "#00364e",
5+
"secondary": "#03567b"
6+
},
7+
"dark": {
8+
"bgColor": "#0a0a0a",
9+
"primary": "#0a0a0a",
10+
"secondary": "#1f1f1f"
11+
}
1312
}
1413

15-
export default color
14+
export default window && Color[localStorage.getItem("themeType")] ? Color[localStorage.getItem("themeType")] : Color.default
15+
16+
// "info": "#1976d2",
17+
// "success": "#43a047",
18+
// "warning": "#ffa000",
19+
// "danger": "#d32f2f",
20+
// "orange": "#fc6027"

‎__appset/themePrepare.js‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -48,16 +48,19 @@ mkdirp(createDir).then(() => {
4848
let appDir
4949
let defaultDirData
5050
let componentFile
51+
let exportSplit
5152
const replaceComponentName = component.replace("config", "").replace(".js", "")
5253

5354
if (process.env.ENVI === "local") {
5455
defaultDir = path.resolve(`${__dirname}`)
55-
defaultDirData = fs.readFileSync(`${defaultDir}/${component}`).toString().split("export")[0].split(/=(.*)/s)[1]
56+
exportSplit = fs.readFileSync(`${defaultDir}/${component}`).toString().split("export")
57+
defaultDirData = exportSplit[0].split(/=(.*)/s)[1]
5658
appDir = `${process.env.CURRENT_APP_DIR}/${process.env.COMPONENT_CONFIG_PATH}/fe-theme`
5759
componentFile = `${appDir}/${component}`
5860
} else {
5961
defaultDir = path.resolve(`${__dirname}`, "../../../node_modules/fe-theme/__appset")
60-
defaultDirData = fs.readFileSync(`${defaultDir}/${component}`).toString().split("export")[0].split(/=(.*)/s)[1]
62+
exportSplit = fs.readFileSync(`${defaultDir}/${component}`).toString().split("export")
63+
defaultDirData = exportSplit[0].split(/=(.*)/s)[1]
6164
appDir = path.resolve(`${__dirname}`, `../../../${process.env.COMPONENT_CONFIG_PATH}/fe-theme`)
6265
componentFile = path.resolve(createDir, component)
6366
}
@@ -102,10 +105,10 @@ export default theme;\n`
102105
const userAppConfig = data.split("export")[0].split(/=(.*)/s)[1]
103106
componentContent = `/* eslint-disable */
104107
const ${replaceComponentName} = ${JSON.stringify(mergeObj(JSON.parse(defaultDirData), JSON.parse(userAppConfig)), null, "\t")}
105-
\nexport default ${replaceComponentName};\n`
108+
\nexport${exportSplit[1]}\n`
106109
} else {
107110
componentContent = `/* eslint-disable */
108-
const ${replaceComponentName} =${defaultDirData}export default ${replaceComponentName};\n`
111+
const ${replaceComponentName} =${defaultDirData}export${exportSplit[1]}\n`
109112
}
110113

111114
fs.writeFile(componentFile, componentContent, (writeFileErr) => {

‎package-lock.json‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -113,8 +113,7 @@
113113
"peerDependencies": {
114114
"react": "^18.2.0",
115115
"react-dom": "^18.2.0",
116-
"styled-components": "^6.1.6",
117-
"scheduler": "^0.23.0"
116+
"styled-components": "^6.1.6"
118117
},
119118
"files": [
120119
"__build-es/**",

0 commit comments

Comments
 (0)