diff options
author | HombreLaser <sebastian-440@live.com> | 2023-05-24 20:18:00 -0600 |
---|---|---|
committer | HombreLaser <sebastian-440@live.com> | 2023-05-24 20:18:00 -0600 |
commit | da2631822f902094e691143302d6fc6b68e1cf56 (patch) | |
tree | 68b893c04233f779f5a65151ea21d673b6f7a8fc /src/components/info_modal.tsx | |
parent | 21508a3514500f8f38ddaa8bef7a9cd420d76628 (diff) |
Añade lógica de carrito
Diffstat (limited to 'src/components/info_modal.tsx')
-rw-r--r-- | src/components/info_modal.tsx | 37 |
1 files changed, 37 insertions, 0 deletions
diff --git a/src/components/info_modal.tsx b/src/components/info_modal.tsx new file mode 100644 index 0000000..1123901 --- /dev/null +++ b/src/components/info_modal.tsx @@ -0,0 +1,37 @@ +import { Modal } from "flowbite"; +import "./stylesheets/shared.css"; + +function createModal() { + const target = document.getElementById('info-modal'); + const button = document.getElementById('modal-button'); + const options = { + placement: 'center-center', + backdrop: 'dynamic', + backdropClasses: 'bg-gray-900 bg-opacity-50 dark:bg-opacity-80 fixed inset-0 z-40', + closable: true + }; + + const new_modal = new Modal(target, options); + button?.addEventListener('click', () => new_modal.hide()); + + return new_modal; +} + +export function InfoModal({ text }) { + + return ( + <div id="info-modal" tabIndex="-1" aria-hidden="true" className="fixed top-0 left-0 right-0 z-50 hidden w-full p-4 overflow-x-hidden overflow-y-auto md:inset-0 h-[calc(100%-1rem)] max-h-full"> + <div className="relative bg-white w-full max-w-2xl max-h-full"> + <div className="p-6 space-y-6"> + <p className="text-base leading-relaxed text-gray-900 dark:text-gray-400"> + {text} + </p> + </div> + + <div className="flex items-center p-6 space-x-2 border-t border-gray-200 rounded-b dark:border-gray-600"> + <button id='modal-button' type="button" className=" button text-white hover:bg-blue-800 focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:focus:ring-blue-800">Ok</button> + </div> + </div> + </div> + ); +}
\ No newline at end of file |