dynamic.js

import React from 'react';
import styled from 'styled-componets';

const Button = styled.button`
  background: ${props => props.primary ? 'blue': 'white'};
  color: ${props => props.primary ? 'white' : 'green}
  cursor: pointer;
  font-size: 16px;
  border-radius: 3px;
  border: 2px solid palevioletred;
  margin: 0 1em;
  padding: 0.25em 1em;
  transition: 0.5s all ease-out;
  &:hover {
    background-color: palevioletred;
    color: white;
  }
`
const App = () => {
  return (
    <div>
      <h1> Stlyed Button </h1>
      <Button>Custom button</Button>
    </div>
  )
}