mirror of
https://github.com/penpot/penpot.git
synced 2026-10-29 05:50:35 +00:00
@penpot/plugin-styles loaded Work Sans from fonts.bunny.net via a remote @import in core/fonts.css, which every plugin built with the package fetched at runtime. That broke air-gapped deployments, leaked user IPs to a third party, and forced deployments to widen the CSP style-src and font-src directives introduced in #11374. Drop the remote import and use the system-ui stack instead of 'Work Sans' in the same package (both in core/fonts.css for code blocks and in core/generic.css for the base typography, which relied on the same webfont), so plugins no longer reach any external domain and 'self' is enough for both CSP directives. Verified by bundling the package entry point with esbuild using the same options as tools/scripts/build-css.mjs: the produced styles.css is balanced, contains system-ui, and contains no external import. Closes #12023 Signed-off-by: ump45nose <1729065730@qq.com>
Penpot plugin-styles
This plugin contains a CSS file to help build the UI for Penpot plugins.
Getting started
Install the package:
npm install @penpot/plugin-styles
Import the CSS file into your project:
@import '@penpot/plugin-styles/styles.css';
Usage
For detailed examples and to see how to use the styles and components, visit the documentation at:
Penpot Plugin Styles Documentation
Icons
We recommend using Feather icons for Penpot plugins to ensure consistency with Penpot's design.
You can find Feather icons at: Feather Icons