summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--ext/css/structured-content.css21
-rw-r--r--ext/js/display/structured-content-generator.js2
2 files changed, 16 insertions, 7 deletions
diff --git a/ext/css/structured-content.css b/ext/css/structured-content.css
index 4dd164a5..cff2c83c 100644
--- a/ext/css/structured-content.css
+++ b/ext/css/structured-content.css
@@ -62,16 +62,24 @@
padding: 0.25em;
}
.gloss-image-background {
+ --image: none;
+
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: var(--text-color);
-
- --image: none;
- --icon-size: contain;
- --icon-image: var(--image);
+ -webkit-mask-repeat: no-repeat;
+ -webkit-mask-position: center center;
+ -webkit-mask-mode: alpha;
+ -webkit-mask-size: contain;
+ -webkit-mask-image: var(--image);
+ mask-repeat: no-repeat;
+ mask-position: center center;
+ mask-mode: alpha;
+ mask-size: contain;
+ mask-image: var(--image);
}
.gloss-image {
display: inline-block;
@@ -192,7 +200,6 @@
.gloss-sc-table {
table-layout: auto;
border-collapse: collapse;
- border-spacing: 0;
}
.gloss-sc-tbody {
background-color: transparent;
@@ -205,7 +212,9 @@
}
.gloss-sc-th,
.gloss-sc-td {
- border: calc(1em / var(--font-size-no-units)) solid var(--text-color-light2);
+ border-width: calc(1em / var(--font-size-no-units));
+ border-style: solid;
+ border-color: var(--text-color-light2);
padding: 0.25em;
vertical-align: top;
}
diff --git a/ext/js/display/structured-content-generator.js b/ext/js/display/structured-content-generator.js
index 28f63f54..5b10811f 100644
--- a/ext/js/display/structured-content-generator.js
+++ b/ext/js/display/structured-content-generator.js
@@ -104,7 +104,7 @@ class StructuredContentGenerator {
const aspectRatioSizer = this._createElement('span', 'gloss-image-aspect-ratio-sizer');
imageContainer.appendChild(aspectRatioSizer);
- const imageBackground = this._createElement('span', 'gloss-image-background icon');
+ const imageBackground = this._createElement('span', 'gloss-image-background');
imageContainer.appendChild(imageBackground);
const image = this._createElement('img', 'gloss-image');