feat: agregar botón para ver perfil público del servicio y mejorar el diseño de los íconos de acción
This commit is contained in:
@@ -16,6 +16,7 @@ import { getServiceImage } from "@core/helpers/getServiceImage";
|
|||||||
import ServiceRatingSummary from "@components/ServiceRatingSummary/ServiceRatingSummary";
|
import ServiceRatingSummary from "@components/ServiceRatingSummary/ServiceRatingSummary";
|
||||||
|
|
||||||
import ShareOutlinedIcon from "@mui/icons-material/ShareOutlined";
|
import ShareOutlinedIcon from "@mui/icons-material/ShareOutlined";
|
||||||
|
import OpenInNewIcon from "@mui/icons-material/OpenInNew";
|
||||||
import Dialog from "@mui/material/Dialog";
|
import Dialog from "@mui/material/Dialog";
|
||||||
import DialogContent from "@mui/material/DialogContent";
|
import DialogContent from "@mui/material/DialogContent";
|
||||||
import DialogTitle from "@mui/material/DialogTitle";
|
import DialogTitle from "@mui/material/DialogTitle";
|
||||||
@@ -118,18 +119,30 @@ export default function Org() {
|
|||||||
</div>
|
</div>
|
||||||
<div className={style.serviceActions}>
|
<div className={style.serviceActions}>
|
||||||
<span className={style.servicePrice}>{formatPrice(data.price)}</span>
|
<span className={style.servicePrice}>{formatPrice(data.price)}</span>
|
||||||
<IconButton
|
<div className={style.iconsRow}>
|
||||||
className={style.shareButton}
|
<IconButton
|
||||||
sx={{ position: "absolute", top: "15px", right: "15px" }}
|
onClick={(e) => {
|
||||||
onClick={(e) => {
|
e.stopPropagation();
|
||||||
e.stopPropagation();
|
goTo(`/landing/service/${data.id}`);
|
||||||
setShareService(data);
|
}}
|
||||||
}}
|
size="small"
|
||||||
size="small"
|
title="Ver perfil público del servicio"
|
||||||
title="Compartir servicio"
|
className={style.iconButton}
|
||||||
>
|
>
|
||||||
<ShareOutlinedIcon fontSize="small" />
|
<OpenInNewIcon fontSize="small" />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
<IconButton
|
||||||
|
onClick={(e) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
setShareService(data);
|
||||||
|
}}
|
||||||
|
size="small"
|
||||||
|
title="Compartir servicio"
|
||||||
|
className={style.iconButton}
|
||||||
|
>
|
||||||
|
<ShareOutlinedIcon fontSize="small" />
|
||||||
|
</IconButton>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
+11
-8
@@ -71,26 +71,29 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: flex-end;
|
align-items: flex-end;
|
||||||
justify-content: flex-end; /* changed from space-between */
|
justify-content: center;
|
||||||
min-width: 100px;
|
gap: 12px;
|
||||||
|
min-width: 60px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.servicePrice {
|
.servicePrice {
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
font-weight: 800;
|
font-weight: 800;
|
||||||
color: #1e293b;
|
color: #1e293b;
|
||||||
margin-bottom: 0; /* removed bottom margin */
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.shareButton {
|
.iconsRow {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconButton {
|
||||||
color: #94a3b8;
|
color: #94a3b8;
|
||||||
transition: color 0.2s ease;
|
transition: color 0.2s ease;
|
||||||
position: absolute;
|
|
||||||
top: 15px;
|
|
||||||
right: 15px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.shareButton:hover {
|
.iconButton:hover {
|
||||||
color: var(--wine-dark);
|
color: var(--wine-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user