remove styles

This commit is contained in:
Ray Elliott 2020-04-27 23:18:34 +01:00
parent 953a189588
commit 7df50fd44a
1 changed files with 12 additions and 13 deletions

View File

@ -18,13 +18,7 @@ class Shade extends React.Component {
}
S.Shade = styled(Shade)`
width: 100%;
height: 100%;
background-color: ${props => props.color};
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
span {
font-weight: bold;
@ -38,7 +32,8 @@ span {
`;
S.ShadeBase = styled(S.Shade)`
border: 3px solid rgba(0, 0, 0, 0.5);
border-top: 3px solid rgba(0, 0, 0, 0.5);
border-bottom: 3px solid rgba(0, 0, 0, 0.5);
`;
function IncDecButton(props) {
@ -179,10 +174,10 @@ Color.defaultProps = {
darkenAmount: 3,
scaleShadeStart: 0.2,
scaleShadeEnd: 0.8,
scaleShadeStepCount: 5,
scaleShadeStepCount: 4,
scaleTintStart: 0.2,
scaleTintEnd: 0.8,
scaleTintStepCount: 5,
scaleTintStepCount: 4,
}
S.Color = styled(Color)`
@ -215,17 +210,21 @@ class Palette extends React.Component {
constructor(props) {
super(props);
this.state = {
palette: palette[0],
palette: [],
}
this.randomizePalette = this.randomizePalette.bind(this);
this.randomFivePalette = this.randomFivePalette.bind(this);
}
randomizePalette() {
randomFivePalette() {
const newPalette = palette[Math.floor(Math.random() * palette.length)];
this.setState({palette: newPalette});
}
componentDidMount() {
this.randomFivePalette();
}
render() {
const colors = this.state.palette.map(color =>
<li key={color}>
@ -237,7 +236,7 @@ class Palette extends React.Component {
);
return (
<article>
<button onClick={this.randomizePalette}>Random Palette</button>
<button onClick={this.randomFivePalette}>Random Five Colour Palette</button>
<ul className={this.props.className}>
{colors}
</ul>