0
343
ViewsCómo posicionar la notificación antd: quiero que esté centrada
estoy usando esto
export function notificationWithIcon(type, title, description, placement) { notification[type]({ message: title, description: description, placement }); } Sin embargo, las únicas opciones son topRight, bottomRight, bottomLeft or topLeft
Me gustaría que apareciera en el centro de mi pantalla. ¿Hay alguna manera de lograr eso?
EDITAR: Usé la idea de Majid y así es como se ve ahora. Todavía está posicionado un poco a la derecha.
·
Juan Pablo Isaza
1 answers
Answer question0
Basado en documentaciones :
Puede aparecer un cuadro de notificación desde la parte superior derecha, inferior derecha, inferior izquierda o superior izquierda de la ventana gráfica.
Pero puedes personalizarlo tú mismo con css classes :
.ant-notification-center { left: 50%; bottom: 50% !important; margin-right: 30%; transform: translate(-50%, -50%); } y use la notification igual que la siguiente muestra:
import React from "react"; import ReactDOM from "react-dom"; import "antd/dist/antd.css"; import "./index.css"; import { Button, notification, Space } from "antd"; import { RadiusUpleftOutlined } from "@ant-design/icons"; const openNotification = (placement) => { notification.info({ message: `Notification ${placement}`, duration: 10000, description: "This is the content of the notification. This is the content of the notification. This is the content of the notification.", placement }); }; ReactDOM.render( <div> <Space> <Button type="primary" onClick={() => openNotification("center")}> <RadiusUpleftOutlined /> center </Button> </Space> </div>, document.getElementById("container") ); 
·
Juan Pablo Isaza
Report
Answer question