diff options
author | flu0r1ne <flu0r1ne@flu0r1ne.net> | 2023-08-28 21:33:44 -0500 |
---|---|---|
committer | flu0r1ne <flu0r1ne@flu0r1ne.net> | 2023-08-28 21:33:44 -0500 |
commit | f0c03a9b8e15387c4defd0a0e3e0298324406fae (patch) | |
tree | 564011d0265666953b17258954ff68614ff6566a /components/Button | |
parent | 2f0439621cff059e414d67f6ce43a7a6c4de13bc (diff) | |
download | homepage-f0c03a9b8e15387c4defd0a0e3e0298324406fae.tar.xz homepage-f0c03a9b8e15387c4defd0a0e3e0298324406fae.zip |
Add wg2nd
Diffstat (limited to 'components/Button')
-rw-r--r-- | components/Button/index.tsx | 39 |
1 files changed, 39 insertions, 0 deletions
diff --git a/components/Button/index.tsx b/components/Button/index.tsx new file mode 100644 index 0000000..9eb2e95 --- /dev/null +++ b/components/Button/index.tsx @@ -0,0 +1,39 @@ +import React, { TextareaHTMLAttributes } from 'react'; +import { getSystemStyle, SystemProps } from '../utils/systemProps'; + +interface ButtonProps + extends React.ButtonHTMLAttributes<HTMLButtonElement>, + SystemProps +{ } + +const Button: React.FC<ButtonProps> = ({ style, ...props }) => { + style = { + margin: '0.25rem 0.125rem', + cursor: 'pointer', + padding: '0.375rem 0.75rem', + borderRadius: '0.25rem', + textAlign: 'center', + verticalAlign: 'middle', + display: 'inline-block', + userSelect: 'none', + + fontFamily: 'inherit', + fontSize: '.95rem', + lineHeight: '1.15', + + // Color + color: '#fff', + backgroundColor: '#1473ff', + border: '1px solid #1473ff', + boxSizing: 'border-box', + + transition: 'color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out', + ...style, + }; + + const systemStyle = getSystemStyle(props, style); + + return (<button style={systemStyle} {...props} />); +}; + +export default Button; |