Untitled
unknown
plain_text
a year ago
2.4 kB
4
Indexable
import { usePDVCustomer } from "layouts/AppLayout/components/PDV/hooks/usePDVCustomer"; import { DataDisplay } from "../DataDisplay"; export function CustomerInformation() { const { customerData } = usePDVCustomer(); return ( <DataDisplay> <thead> <tr> <th colSpan={4}>Informações do cliente</th> </tr> </thead> <tbody> <tr> <td><b>Endereço: </b></td> <td>{customerData ? `${customerData.address.street} - ${customerData.address.number}` : ""}</td> <td><b>Cadastrado em: </b></td> <td>17/06/2024</td> </tr> <tr> <td><b>Endereço: </b></td> <td>Rua Maria F. de Jesus, 36</td> <td><b>Cadastrado em: </b></td> <td>17/06/2024</td> </tr> <tr> <td><b>Endereço: </b></td> <td>Rua Maria F. de Jesus, 36</td> <td><b>Cadastrado em: </b></td> <td>17/06/2024</td> </tr> <tr> <td><b>Endereço: </b></td> <td>Rua Maria F. de Jesus, 36</td> <td><b>Cadastrado em: </b></td> <td>17/06/2024</td> </tr> </tbody> </DataDisplay> ); } import styled from "styled-components"; export const Container = styled.div` margin-top: 1.25rem; flex: 1; background: ${({ theme }) => theme.white}; border-radius: 4px; border: 1px solid ${({ theme }) => theme["border-color"]}; `; export const Table = styled.table` width: 100%; border-collapse: collapse; table-layout: fixed; thead { tr { background: ${({ theme }) => theme["light-gray-100"]}; th { color: ${({ theme }) => theme["gray-400"]}; font-weight: 500; text-align: center; padding: ${({ theme }) => theme["p-sm"]}; font-size: ${({ theme }) => theme["text-sm"]}; } } } tbody { tr { background: rgba(0, 0, 0, 0.005); &:nth-child(even) { background: rgba(0, 0, 0, 0.010); } &:hover { background: rgba(0, 0, 0, 0.015); } td { padding: ${({ theme }) => theme["p-sm"]}; font-size: ${({ theme }) => theme["text-sm"]}; color: ${({ theme }) => theme["gray-400"]}; white-space: nowrap; b { } } } } `;
Editor is loading...
Leave a Comment