Rev 7268 | AutorÃa | Comparar con el anterior | Ultima modificación | Ver Log |
import React from 'react'
import { styled } from 'styled-components'
import WidgetLayout from '../widgets/WidgetLayout'
const StyledContainer = styled(WidgetLayout)`
padding: 1rem;
h2 {
font-size: 1.1rem;
font-weight: 600;
color: var(--title-color);
}
h4 {
font-weight: 600;
color: var(--subtitle-color);
}
.info {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
`
const ClientInfo = ({
companyIndustry,
companySize,
companyAddress,
companyWebsite,
companyFoundationYear,
}) => {
return (
<StyledContainer>
<h2>Sobre el cliente</h2>
<div className="info">
<h4>{companyIndustry}</h4>
<p>{companySize} empleados</p>
</div>
{companyAddress && (
<div className="info">
<p>{companyAddress}</p>
</div>
)}
{companyWebsite && (
<div className="info">
<h4>URL del sitio web de la empresa</h4>
<a href={`http://${companyWebsite}`} target="_blank" rel="noreferrer">
{companyWebsite}
</a>
</div>
)}
{companyFoundationYear && (
<div className="info">
<h4>Fundada</h4>
<p>{companyFoundationYear}</p>
</div>
)}
</StyledContainer>
)
}
export default ClientInfo