feat(warehouse) add warehouse grid item style.

This commit is contained in:
elforjani13
2022-01-30 18:29:10 +02:00
parent 2aa26959e9
commit 0d11ea7c5e
2 changed files with 12 additions and 4 deletions

View File

@@ -13,6 +13,7 @@ const WAREHOUSE = [
title: 'Warehouse #1',
code: '1001',
city: 'City',
country: 'Country',
email: 'email@emial.com',
phone: '09xxxxxxxx',
},
@@ -20,6 +21,7 @@ const WAREHOUSE = [
title: 'Warehouse #2',
code: '100',
city: 'City',
country: 'Country',
email: 'email@emial.com',
phone: '09xxxxxxxx',
},
@@ -27,6 +29,7 @@ const WAREHOUSE = [
title: 'Warehouse #2',
code: '100',
city: 'City',
country: 'Country',
email: 'email@emial.com',
phone: '09xxxxxxxx',
},

View File

@@ -4,8 +4,10 @@ import styled from 'styled-components';
function WarehousesGrid({ warehouse }) {
return (
<WarehouseGrid>
<WarehouseTitle>{warehouse.title}</WarehouseTitle>
<WarehouseCode>{warehouse.code}</WarehouseCode>
<WarehouseHeader>
<WarehouseTitle>{warehouse.title}</WarehouseTitle>
<WarehouseCode>{warehouse.code}</WarehouseCode>
</WarehouseHeader>
<WarehouseInfoItem>{warehouse.city}</WarehouseInfoItem>
<WarehouseInfoItem>{warehouse.country}</WarehouseInfoItem>
<WarehouseInfoItem>{warehouse.email}</WarehouseInfoItem>
@@ -33,7 +35,7 @@ const WarehouseGrid = styled.div`
height: 160px; //225px
background: #fff;
margin: 5px;
padding: 10px 12px;
padding: 16px 12px 10px;
border: 1px solid #c8cad0; //#CFD1D6
transition: all 0.1s ease-in-out;
@@ -51,11 +53,14 @@ const WarehouseTitle = styled.div`
line-height: 1;
`;
const WarehouseHeader = styled.div`
margin: 4px 0px 15px;
`;
const WarehouseCode = styled.div`
display: inline-block;
font-size: 11px;
color: #6b7176;
margin: 4px 0px 15px;
`;
const WarehouseInfoItem = styled.div`