Attemp to get jidoujisho support working

This commit is contained in:
ZXY101
2024-02-07 11:19:18 +02:00
parent 28155496fc
commit 50ef5c9f40
3 changed files with 21 additions and 9 deletions

View File

@@ -11,6 +11,9 @@
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover" class="bg-white dark:bg-gray-950 dark:text-white">
<div style="display: contents">%sveltekit.body%</div>
<div
id="popupAbout"
class="pageContainer"
style="display: contents; background-image: url('https://fastly.picsum.photos/id/824/200/300.jpg?hmac=CPaWVapi5aRxRDN0wSZfBeD_w8iiddSi1zhfyLj7AnA');">%sveltekit.body%</div>
</body>
</html>

View File

@@ -9,9 +9,18 @@
$: url = src ? `url(${URL.createObjectURL(src)})` : '';
let legacy: HTMLElement | null;
onMount(() => {
legacy = document.getElementById('popupAbout');
zoomDefault();
});
$: {
if (legacy) {
legacy.style.backgroundImage = url;
}
}
</script>
<div

View File

@@ -67,9 +67,9 @@
}
</script>
{#each textBoxes as { fontSize, height, left, lines, top, width, writingMode }, index (`text-box-${index}`)}
{#each textBoxes as { fontSize, height, left, lines, top, width, writingMode }, index (`textBox-${index}`)}
<div
class="text-box"
class="textBox"
style:width
style:height
style:left
@@ -91,7 +91,7 @@
{/each}
<style>
.text-box {
.textBox {
color: black;
padding: 0;
position: absolute;
@@ -102,13 +102,13 @@
z-index: 11;
}
.text-box:focus,
.text-box:hover {
.textBox:focus,
.textBox:hover {
background: rgb(255, 255, 255);
border: 1px solid rgba(0, 0, 0, 0);
}
.text-box p {
.textBox p {
display: none;
white-space: nowrap;
letter-spacing: 0.1em;
@@ -119,8 +119,8 @@
z-index: 11;
}
.text-box:focus p,
.text-box:hover p {
.textBox:focus p,
.textBox:hover p {
display: table;
}
</style>