How to use custom colors?
ChannelJuanNews opened this issue · 2 comments
ChannelJuanNews commented
Is there a color property you can set on the components to make things a little more custom? Where in the code can I set different colors?
ChannelJuanNews commented
+1 anyone? lol
AndrewKralovec commented
@ChannelJuanNews , is there a specific component you are having problems changing the color to?
Examples of coloring
Button:
import React, { Component } from 'react';
import { Button } from 'react-desktop/windows';
export default class extends Component {
static defaultProps = {
color: '#cc7f29'
};
render() {
return (
<Button push color={this.props.color} onClick={() => console.log('Clicked!')}>
Press me!
</Button>
);
}
}
Window
import React, { Component } from 'react';
import { Window, TitleBar, Text } from 'react-desktop/windows';
export default class extends Component {
static defaultProps = {
color: '#cc7f29',
theme: 'light'
};
render() {
return (
<Window
color={this.props.color}
theme={this.props.theme}
chrome
height="300px"
padding="12px"
>
<TitleBar title="My Windows Application" controls/>
<Text color={this.props.theme === 'dark' ? 'white' : '#333'}>Hello World</Text>
</Window>
);
}
}