diff options
| author | Stephen Kraus <8003332+stephenmk@users.noreply.github.com> | 2024-01-27 03:12:29 -0600 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-01-27 09:12:29 +0000 |
| commit | 1c258f7207faad0c1489fb24fb31694e32064914 (patch) | |
| tree | 5e00732b76f7d13572fa7a103d72e3b4cf25db7b /ext | |
| parent | 3c76b878e9ddcc8fa52d00fc85f561bbb72c5dd1 (diff) | |
Add border styling options for structured content images (#577)
* Add border styling options for structured content images
* Replace border style, width, and color properties with shorthand
---------
Co-authored-by: stephenmk <stephenmk@users.noreply.github.com>
Diffstat (limited to 'ext')
| -rw-r--r-- | ext/data/schemas/dictionary-term-bank-v3-schema.json | 12 | ||||
| -rw-r--r-- | ext/js/dictionary/dictionary-importer.js | 9 | ||||
| -rw-r--r-- | ext/js/display/sandbox/structured-content-generator.js | 4 |
3 files changed, 22 insertions, 3 deletions
diff --git a/ext/data/schemas/dictionary-term-bank-v3-schema.json b/ext/data/schemas/dictionary-term-bank-v3-schema.json index bcb1d5ed..f85f893b 100644 --- a/ext/data/schemas/dictionary-term-bank-v3-schema.json +++ b/ext/data/schemas/dictionary-term-bank-v3-schema.json @@ -152,7 +152,7 @@ }, "height": { "type": "number", - "description": "Preferred width of the image.", + "description": "Preferred height of the image.", "minimum": 0 }, "title": { @@ -204,6 +204,14 @@ "description": "The vertical alignment of the image.", "enum": ["baseline", "sub", "super", "text-top", "text-bottom", "middle", "top", "bottom"] }, + "border": { + "type": "string", + "description": "Shorthand for border width, style, and color." + }, + "borderRadius": { + "type": "string", + "description": "Roundness of the corners of the image's outer border edge." + }, "sizeUnits": { "type": "string", "description": "The units for the width and height.", @@ -485,7 +493,7 @@ }, "height": { "type": "integer", - "description": "Preferred width of the image.", + "description": "Preferred height of the image.", "minimum": 1 }, "title": { diff --git a/ext/js/dictionary/dictionary-importer.js b/ext/js/dictionary/dictionary-importer.js index c8f68d78..0feed8b2 100644 --- a/ext/js/dictionary/dictionary-importer.js +++ b/ext/js/dictionary/dictionary-importer.js @@ -486,9 +486,16 @@ export class DictionaryImporter { * @param {import('dictionary-database').DatabaseTermEntry} entry */ async _resolveStructuredContentImage(context, target, source, entry) { - const {verticalAlign, sizeUnits} = source; + const { + verticalAlign, + border, + borderRadius, + sizeUnits + } = source; await this._createImageData(context, target, source, entry); if (typeof verticalAlign === 'string') { target.verticalAlign = verticalAlign; } + if (typeof border === 'string') { target.border = border; } + if (typeof borderRadius === 'string') { target.borderRadius = borderRadius; } if (typeof sizeUnits === 'string') { target.sizeUnits = sizeUnits; } } diff --git a/ext/js/display/sandbox/structured-content-generator.js b/ext/js/display/sandbox/structured-content-generator.js index f73d790a..ee86a7f4 100644 --- a/ext/js/display/sandbox/structured-content-generator.js +++ b/ext/js/display/sandbox/structured-content-generator.js @@ -73,6 +73,8 @@ export class StructuredContentGenerator { collapsed, collapsible, verticalAlign, + border, + borderRadius, sizeUnits } = data; @@ -130,6 +132,8 @@ export class StructuredContentGenerator { } imageContainer.style.width = `${usedWidth}em`; + if (typeof border === 'string') { imageContainer.style.border = border; } + if (typeof borderRadius === 'string') { imageContainer.style.borderRadius = borderRadius; } if (typeof title === 'string') { imageContainer.title = title; } |