Fix status card close button location and margin
This commit is contained in:
parent
201efeca8c
commit
7648e49999
Binary file not shown.
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "@fwdekker/template",
|
||||
"version": "3.5.0",
|
||||
"version": "3.5.1",
|
||||
"description": "The base template for pages on fwdekker.com.",
|
||||
"author": "Florine W. Dekker",
|
||||
"license": "MIT",
|
||||
|
@ -34,10 +34,10 @@
|
|||
"grunt-contrib-watch": "^1.1.0",
|
||||
"grunt-focus": "^1.0.0",
|
||||
"grunt-webpack": "^5.0.0",
|
||||
"ts-loader": "^9.4.1",
|
||||
"ts-loader": "^9.4.2",
|
||||
"ts-node": "^10.9.1",
|
||||
"typescript": "^4.9.3",
|
||||
"typescript": "^4.9.4",
|
||||
"webpack": "^5.75.0",
|
||||
"webpack-cli": "^5.0.0"
|
||||
"webpack-cli": "^5.0.1"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,14 +1,20 @@
|
|||
.status-card {
|
||||
font-weight: bold;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.status-card output {
|
||||
display: block;
|
||||
margin-right: var(--block-spacing-horizontal);
|
||||
}
|
||||
|
||||
.status-card .close {
|
||||
float: right;
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: var(--block-spacing-horizontal);
|
||||
top: calc(var(--block-spacing-vertical) / 2);
|
||||
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
margin: 0 0 calc(var(--block-spacing-vertical) / 2) calc(var(--block-spacing-vertical) / 2);
|
||||
|
||||
background-image: var(--icon-close);
|
||||
background-position: center;
|
||||
|
|
|
@ -34,14 +34,14 @@ export function showMessageType(card: HTMLElement | HTMLFormElement,
|
|||
}
|
||||
const output = $("output", card)!;
|
||||
|
||||
card.removeAttribute("aria-busy");
|
||||
output.removeAttribute("aria-busy");
|
||||
card.classList.remove("hidden", "error", "info", "success", "warning");
|
||||
|
||||
if (message == null || type == null) {
|
||||
card.classList.add("hidden");
|
||||
output.innerHTML = "";
|
||||
} else {
|
||||
if (type === "busy") card.setAttribute("aria-busy", "true");
|
||||
if (type === "busy") output.setAttribute("aria-busy", "true");
|
||||
else card.classList.add(type);
|
||||
|
||||
output.innerHTML = message;
|
||||
|
|
Loading…
Reference in New Issue