Making of LLemMings

Modal dialog (used for keybinds)

ChatGPT: 2 prompts


>>> Prompt 1:
Using plain HTML and no dependencies.

Give me a very simple modal pop-over with a close icon in top-left corner.

The modal should be initialized with javascript, using e.g.:
openDialog(title, htmlContent)

It should also:
- center on the screen and be responsive (e.g. using max-width, min-width etc)

Only give me the code, I don't need an explanation this time.

>>> Prompt 2:
Given this CSS:

.modal-content {
display: block;
background-color: #333;
margin: auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
max-width: 600px;
}

Give it:
- shadow
- rounded corners
- thicker borders
- background color should have 0.5 opacity