| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>text to image models playground</title> |
| <style> |
| body, html { |
| margin: 0; |
| padding: 0; |
| height: 100%; |
| overflow: hidden; |
| } |
| iframe { |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| border: none; |
| } |
| </style> |
| </head> |
| <body> |
| <dialog id="myDialog" style="border: none; border-radius: 5px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); padding: 20px; max-width: 300px;"> |
| <form method="dialog" style="position: relative;"> |
| <button id="closeDialogButton" class="close-button" style="position: absolute; top: 10px; right: 10px; background: none; border: none; font-size: 18px; cursor: pointer;">✖</button> |
| <p style="margin: 20px 0 0;">Visit <a href="https://xyplon.web.app" target="_blank" style="color: #007BFF; text-decoration: none;">official website</a> for more tools and faster inference.</p> |
| </form> |
| </dialog> |
|
|
| <script> |
| const dialog = document.getElementById('myDialog'); |
| const closeDialogButton = document.getElementById('closeDialogButton'); |
| window.addEventListener('load', () => { |
| dialog.showModal(); |
| }); |
| closeDialogButton.addEventListener('click', () => { |
| dialog.close(); |
| }); |
| </script> |
| <iframe src="https://xyplon.web.app/models"></iframe> |
| </body> |
| </html> |
|
|
