diff --git a/src/components/contactItem/ContactItem.styled.jsx b/src/components/contactItem/ContactItem.styled.jsx index 0403f30..4c6d4bb 100644 --- a/src/components/contactItem/ContactItem.styled.jsx +++ b/src/components/contactItem/ContactItem.styled.jsx @@ -5,13 +5,14 @@ export const Item = styled.li` display: flex; align-items: center; margin-top: 10px; - padding-bottom: 10px; + padding: 10px; + font-size: 20px; + /* background-color: ${props => ` ${props.theme.colors.bd}`}; */ + border: ${props => `1px solid ${props.theme.colors.bd}`}; :first-child { margin-top: 0; } - font-size: 20px; - border-bottom: ${props => `1px solid ${props.theme.colors.bd}`}; `; export const ButtonDelete = styled(ButtonSubmit)` @@ -21,7 +22,7 @@ export const ButtonDelete = styled(ButtonSubmit)` `; export const FirstLetterBox = styled.div` - margin-left: 15px; + margin-left: 5px; width: 40px; height: 40px; border-radius: 50%; diff --git a/src/pages/contacts/ContactsPage.js b/src/pages/contacts/ContactsPage.js index 37f335f..dcc91f4 100644 --- a/src/pages/contacts/ContactsPage.js +++ b/src/pages/contacts/ContactsPage.js @@ -22,7 +22,7 @@ import { ShowIcon, HideIcon, Phonebook, - SecondTitle, + Title, UpperBox, Headers, Name, @@ -55,7 +55,7 @@ const ContactsPage = () => {
- Contacts + Contacts {isLoading && !error && } {!isAddFormOpen ? : } diff --git a/src/pages/contacts/ContactsPage.styled.jsx b/src/pages/contacts/ContactsPage.styled.jsx index accbc6b..9380df7 100644 --- a/src/pages/contacts/ContactsPage.styled.jsx +++ b/src/pages/contacts/ContactsPage.styled.jsx @@ -7,9 +7,10 @@ export const Phonebook = styled.div` padding: 30px; border: ${props => `1px solid ${props.theme.colors.bd}`}; border-top: 0px; + /* background-color: ${props => ` ${props.theme.colors.primary}`}; */ `; -export const SecondTitle = styled.h2` +export const Title = styled.h2` display: inline; color: ${props => `${props.theme.colors.hover}`}; `;