@feliperohdee/satori 0.0.12 → 0.0.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -0
- package/dist/index.cjs +5 -5
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +5 -5
- package/dist/index.js.map +1 -1
- package/dist/standalone.cjs +5 -5
- package/dist/standalone.cjs.map +1 -1
- package/dist/standalone.js +5 -5
- package/dist/standalone.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -6,6 +6,8 @@ This fork extends the [original Satori](https://github.com/vercel/satori) with t
|
|
|
6
6
|
|
|
7
7
|
- **`background-position` with keyword sizes** — correct positioning when combined with `background-size: cover`, `contain`, or `auto`
|
|
8
8
|
- **`mix-blend-mode`** — full support
|
|
9
|
+
- **`backdrop-filter`** — simulated via SVG filter primitives (`blur`, `saturate`, `brightness`, `contrast`, `grayscale`). Uses `<use>` to reference background content with `feGaussianBlur` and `feOffset` edge-extension for consistent blur without transparent edges. Supports `mask-image` for blurred fades and `border-radius` on the clip path
|
|
10
|
+
- **Faux bold (synthetic bold)** — when only a regular weight font (e.g., 400) is loaded and bold text is requested (e.g., `fontWeight: 700`), glyphs are automatically thickened using an SVG stroke matching the fill color, replicating browser font synthesis. Stroke width scales with the weight difference. Explicit `-webkit-text-stroke` takes precedence
|
|
9
11
|
|
|
10
12
|
## Overview
|
|
11
13
|
|
|
@@ -291,6 +293,12 @@ Satori uses the same Flexbox [layout engine](https://yogalayout.com) as React Na
|
|
|
291
293
|
<td></td>
|
|
292
294
|
</tr>
|
|
293
295
|
|
|
296
|
+
<tr>
|
|
297
|
+
<td colspan="2"><code>backdropFilter</code></td>
|
|
298
|
+
<td>Supported (<code>blur</code>, <code>saturate</code>, <code>brightness</code>, <code>contrast</code>, <code>grayscale</code>). Works with <code>maskImage</code> for faded blur effects</td>
|
|
299
|
+
<td></td>
|
|
300
|
+
</tr>
|
|
301
|
+
|
|
294
302
|
<tr>
|
|
295
303
|
<td colspan="2"><code>mixBlendMode</code></td>
|
|
296
304
|
<td>Supported</td>
|