the tags form is now a dialog. see #183
This commit is contained in:
parent
9907d35233
commit
ddb8ef223f
1 changed files with 21 additions and 11 deletions
|
|
@ -220,6 +220,21 @@ switch (message.command) {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.div_btns{
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
:root {
|
||||||
|
--dialog-bg-color: #2e2e2e;
|
||||||
|
--dialog-text-color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Darker overlay for the page background */
|
||||||
.mzta_dialog_overlay {
|
.mzta_dialog_overlay {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
|
|
@ -229,24 +244,17 @@ switch (message.command) {
|
||||||
background: rgba(0, 0, 0, 0.7);
|
background: rgba(0, 0, 0, 0.7);
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.div_btns{
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
margin-top: 20px;
|
|
||||||
}
|
|
||||||
`;
|
`;
|
||||||
document.head.appendChild(style);
|
document.head.appendChild(style);
|
||||||
|
|
||||||
function createDialog(inputString, onSubmit) {
|
function createDialog(inputString, onSubmit) {
|
||||||
// Create the overlay
|
// Create the overlay
|
||||||
const overlay = document.createElement('div');
|
// const overlay = document.createElement('div');
|
||||||
overlay.className = 'mzta_dialog_overlay';
|
// overlay.className = 'mzta_dialog_overlay';
|
||||||
document.body.appendChild(overlay);
|
// document.body.appendChild(overlay);
|
||||||
|
|
||||||
// Create the dialog
|
// Create the dialog
|
||||||
const dialog = document.createElement('div');
|
const dialog = document.createElement('dialog');
|
||||||
dialog.className = 'mzta_dialog';
|
dialog.className = 'mzta_dialog';
|
||||||
|
|
||||||
// Create the content
|
// Create the content
|
||||||
|
|
@ -304,6 +312,8 @@ switch (message.command) {
|
||||||
document.body.removeChild(dialog);
|
document.body.removeChild(dialog);
|
||||||
document.body.removeChild(overlay);
|
document.body.removeChild(overlay);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
dialog.showModal();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Example usage
|
// Example usage
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue