Добавление изображения к кнопке с помощью Emotion css - PullRequest
Новая
       6

Добавление изображения к кнопке с помощью Emotion css

3 голосов
/ 18 января 2020

Я хочу стилизовать две кнопки: вверх и вниз с изображением, используя эмоции css, но не могу этого сделать. В настоящее время я обычно оформляю свои элементы внутри функции. Как я могу добиться этого, используя эмоции css? Я следовал https://emotion.sh/docs/introduction, но я не могу правильно его реализовать. 

    import up from "../img/up.png";

    function PostButton(props) {
    let style = {
    backgroundRepeat: 'no-repeat',
    background: `url(${up})`,
    paddingRight: 24,
    paddingTop: 26,
    paddingLeft: 26,
    paddingBottom: 26.6
    };
    return (
    <button style={style} onClick={() => props.handleClick()}>{props.background}</button>
    );
    }

//I have written similar code for PostButton2


function Post(props) {
    return (
    <div>
                    <Up >
                        <PostButton src={"../images/up.png"} handleClick= . 
     {props.incrementScore} />
                    </Up>                    >

                    <Down >
                        <PostButton2 src={"../images/down.png"} 
 handleClick{props.decrementScore} />
                    </Down>
                </Col>
            </Row>
        </Container>
    </div>
    );
}
...