diff --git a/src/components/ManageList.jsx b/src/components/ManageList.jsx index e69de29..15f7e87 100644 --- a/src/components/ManageList.jsx +++ b/src/components/ManageList.jsx @@ -0,0 +1,65 @@ +import styled from '@emotion/native'; +import { COLORS } from '../shared/color'; +import { TouchableOpacity } from 'react-native'; + +const ManageList = ({ pillName, id }) => { + return ( + + {pillName} + + console.log('편집', id)} + /> + console.log('삭제', id)} + /> + + + ); +}; + +const TextButton = ({ buttonColor, buttonText, onPress }) => { + return ( + + {buttonText} + + ); +}; + +const ManageListContainer = styled.View` + background-color: white; + margin: 8px 16px; + padding: 12px 16px; + height: 80px; + border-radius: 16px; + box-shadow: 0px 0px 8px rgba(202, 202, 202, 0.23); + flex-direction: row; + justify-content: space-between; + align-items: center; +`; + +const ManageListTitle = styled.Text` + font-size: 28px; + text-overflow: ellipsis; +`; + +const ButtonGroupContainer = styled.View` + flex-direction: row; + justify-content: end; + gap: 16px; +`; + +const ManageButton = styled.Text` + font-size: 20px; + line-height: 24px; + margin: 0 0 0 16px; + color: ${(props) => props.buttonColor}; +`; + +export default ManageList; diff --git a/src/components/index.js b/src/components/index.js index e69de29..44aeabd 100644 --- a/src/components/index.js +++ b/src/components/index.js @@ -0,0 +1,3 @@ +import ManageList from './ManageList'; + +export { ManageList };