From 8a5825d52271d712ec7c8348447d433067e13ef2 Mon Sep 17 00:00:00 2001 From: Wes Bos Date: Thu, 13 Sep 2018 14:18:56 -0400 Subject: DONE --- .../frontend/components/styles/ItemStyles.js | 39 ++++++++++++++++++++++ 1 file changed, 39 insertions(+) create mode 100644 stepped-solutions/FINISHED/frontend/components/styles/ItemStyles.js (limited to 'stepped-solutions/FINISHED/frontend/components/styles/ItemStyles.js') diff --git a/stepped-solutions/FINISHED/frontend/components/styles/ItemStyles.js b/stepped-solutions/FINISHED/frontend/components/styles/ItemStyles.js new file mode 100644 index 0000000..b117d5f --- /dev/null +++ b/stepped-solutions/FINISHED/frontend/components/styles/ItemStyles.js @@ -0,0 +1,39 @@ +import styled from 'styled-components'; + +const Item = styled.div` + background: white; + border: 1px solid ${props => props.theme.offWhite}; + box-shadow: ${props => props.theme.bs}; + position: relative; + display: flex; + flex-direction: column; + img { + width: 100%; + height: 400px; + object-fit: cover; + } + p { + font-size: 12px; + line-height: 2; + font-weight: 300; + flex-grow: 1; + padding: 0 3rem; + font-size: 1.5rem; + } + .buttonList { + display: grid; + width: 100%; + border-top: 1px solid ${props => props.theme.lightgrey}; + grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); + grid-gap: 1px; + background: ${props => props.theme.lightgrey}; + & > * { + background: white; + border: 0; + font-size: 1rem; + padding: 1rem; + } + } +`; + +export default Item; -- cgit v1.3