1 files changed, 44 insertions, 0 deletions
diff --git a/sick-fits/frontend/components/styles/OrderItemStyles.js b/sick-fits/frontend/components/styles/OrderItemStyles.js
new file mode 100644
index 0000000..292c75d
--- /dev/null
+++ b/sick-fits/frontend/components/styles/OrderItemStyles.js
@@ -0,0 +1,44 @@
+import styled from 'styled-components';
+
+const OrderItemStyles = styled.li`
+  box-shadow: ${props => props.theme.bs};
+  list-style: none;
+  padding: 2rem;
+  border: 1px solid ${props => props.theme.offWhite};
+  h2 {
+    border-bottom: 2px solid red;
+    margin-top: 0;
+    margin-bottom: 2rem;
+    padding-bottom: 2rem;
+  }
+
+  .images {
+    display: grid;
+    grid-gap: 10px;
+    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
+    margin-top: 1rem;
+    img {
+      height: 200px;
+      object-fit: cover;
+      width: 100%;
+    }
+  }
+  .order-meta {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(20px, 1fr));
+    display: grid;
+    grid-gap: 1rem;
+    text-align: center;
+    & > * {
+      margin: 0;
+      background: rgba(0, 0, 0, 0.03);
+      padding: 1rem 0;
+    }
+    strong {
+      display: block;
+      margin-bottom: 1rem;
+    }
+  }
+`;
+
+export default OrderItemStyles;