const listPrice = css` h4 { background: ${accentColor}; color: #ffffff; border-radius: 5px; width: 147px; padding: 6px 13px; } `; <div css={listPrice}> <h4>{accounting.formatMoney(price, 'RM ', 0)}</h4> </div>
import { css, jsx } from '@emotion/react'; <div css={css` width: 300px; padding: 16px; border: 1px solid #000; `} >
import React from 'react'; import { css } from '@emotion/react'; const ColTest = () => { const containerStyles = css` display: flex; flex-direction: row; /* Change to row */ width: 100%; max-width: 700px; margin: 0 auto; `; const buttonStyles = css` width: 20%; `; const inputStyles = css` width: 80%; `; return ( <div css={containerStyles}> <button css={buttonStyles}>New Topic</button> <input type="text" css={inputStyles} placeholder="Enter your topic..." /> </div> ); }; export default ColTest;