From 737344a72d23dc97b0d0e73cc4ab7fdffd0fbf49 Mon Sep 17 00:00:00 2001 From: Brendan F Date: Sun, 14 May 2023 23:12:27 -0700 Subject: Merge in react app code From sluchajfun and youtube-heardle-template --- src/components/Button/index.styled.ts | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) create mode 100644 src/components/Button/index.styled.ts (limited to 'src/components/Button/index.styled.ts') diff --git a/src/components/Button/index.styled.ts b/src/components/Button/index.styled.ts new file mode 100644 index 0000000..1bb964f --- /dev/null +++ b/src/components/Button/index.styled.ts @@ -0,0 +1,23 @@ +import styled from "styled-components"; +import { theme } from "../../constants"; + +export const Button = styled.button<{ variant?: keyof typeof theme }>` + background-color: ${({ theme, variant }) => + variant ? theme[variant] : theme.background100}; + + border-radius: 5px; + border: none; + + color: ${({ theme }) => theme.text}; + font-size: 1rem; + font-weight: 800; + + width: max-content; + padding: 12.5px 20px; + + &:hover { + opacity: 0.8; + } + + cursor: pointer; +`; -- cgit v1.2.3