1
0
Fork 0
mirror of https://github.com/kkapsner/CanvasBlocker synced 2025-07-04 04:26:35 +02:00

Unified action pages and fixed display issues

For #341
This commit is contained in:
kkapsner 2019-05-03 23:17:35 +02:00
parent c870fb6720
commit 6ffd537a58
19 changed files with 69 additions and 143 deletions

View file

@ -71,6 +71,8 @@
document.body.innerHTML = "";
document.body.className = "modal";
document.body.appendChild(document.createTextNode(messageText));
const stack = document.createElement("div");
stack.className = "stackedInputs";
choices.forEach(function(choice){
const button = document.createElement("button");
button.addEventListener("click", function(){
@ -78,8 +80,9 @@
message("modal choice closed with value", choice.value || choice);
});
button.appendChild(document.createTextNode(choice.text || choice));
document.body.appendChild(button);
stack.appendChild(button);
});
document.body.append(stack);
});
};
@ -89,16 +92,19 @@
document.body.innerHTML = "";
document.body.className = "modal";
document.body.appendChild(document.createTextNode(messageText));
var input = document.createElement("input");
const stack = document.createElement("div");
stack.className = "stackedInputs";
const input = document.createElement("input");
input.value = defaultValue;
document.body.appendChild(input);
var button = document.createElement("button");
stack.appendChild(input);
const button = document.createElement("button");
button.textContent = "OK";
button.addEventListener("click", function(){
resolve(input.value);
message("modal prompt closed with value", input.value);
});
document.body.appendChild(button);
stack.appendChild(button);
document.body.append(stack);
});
};
}());

View file

@ -5,7 +5,6 @@
body {
margin: 0.5em;
padding: 2px;
padding-right: 23px;
padding-bottom: 1.5em;
white-space: nowrap;
position: relative;
@ -15,6 +14,7 @@ body {
list-style: none;
padding: 0;
margin: 0;
float: left;
}
button.action.isIcon {
@ -60,9 +60,7 @@ button.action img {
#globalActions {
position: absolute;
right: 0;
top: 0;
float: right;
width: 23px;
text-align: right;
line-height: 0;
@ -134,39 +132,6 @@ body.modal {
padding: 2px;
}
.modal input {
display: block;
box-sizing: border-box;
width: 100%;
}
.modal button {
display: block;
padding: 0.5em;
background-color: transparent;
border: 1px solid currentColor;
cursor: pointer;
width: 100%;
text-align: left;
height: auto;
z-index: 1;
position: relative;
white-space: nowrap;
color: currentColor;
}
.modal button + .modal button {
border-top-width: 0;
}
.modal button:first-child {
border-radius: 3px 3px 0 0;
}
.modal button:last-child {
border-radius: 0 0 3px 3px;
}
.modal button:active, .modal button:hover, .modal button:focus {
z-index: 10;
body.modal .stackedInputs {
margin-top: 0.5em;
}