[gimp-web/testing] README: update the README to account for SVG file case with CSP.
- From: Jehan Pagès <jehanp src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gimp-web/testing] README: update the README to account for SVG file case with CSP.
- Date: Thu, 27 Oct 2016 15:33:25 +0000 (UTC)
commit baba72eaf6dc290dc31725da829d2c4ab236dc5a
Author: Jehan <jehan girinstud io>
Date: Thu Oct 27 17:32:51 2016 +0200
README: update the README to account for SVG file case with CSP.
README | 27 +++++++++++++++++++++++++++
1 files changed, 27 insertions(+), 0 deletions(-)
---
diff --git a/README b/README
index 2f869e4..f43dffb 100644
--- a/README
+++ b/README
@@ -112,6 +112,7 @@ If a new directory needs to be added, like `artists/`:
### File Formats
+#### Text files
The files can be written using ReStructuredText, Markdown, or HTML.
The latest information for using these formats can be found in the documentation:
http://docs.getpelican.com/en/latest/content.html
@@ -120,6 +121,32 @@ The majority of the files here are likely Markdown, as it's what I (Pat David) u
I wrote a brief cheatsheet of the Markdown format that can be found on the site here:
`about/meta/markdown.html`
+#### SVG files
+The website is served with a strict Content Security Policy, and as a
+consequence, inline scripts and styles are ignored by compliant browsers.
+Normally according to the specification, SVG included via <img> should not apply
+the policy (https://www.w3.org/TR/CSP11/#which-policy-applies), but at least
+Firefox does not follow the spec properly right now and all SVG with inlined CSS
+end up dark.
+
+Here is the current process to add SVG images with Inkscape and keep the
+styling:
+
+1. keep the original as `some-file-name.src.svg`;
+2. from Inkscape, export it as "Optimized SVG" as `some-file-name.svg`; make
+sure that "Convert CSS attributes to XML attributes" option is checked;
+3. edit `some-file-name.svg` with a text editor and run a search and replace to
+clean the remaining style attributes: %s/style="[^"]*"//g
+4. use only the optimized SVG in the website.
+
+Further edits on the images should happen on the source file only, which should
+then be re-exported with the above process.
+
+Note: for complicated SVG images, it is possible that some features can only
+work with CSS rules though this won't be the likely case for most simple images.
+For such cases, there is no perfect solution at the time of writing (except
+moving the CSS of every SVG images out as an external file, or setting our web
+server to serve SVG images with `style-src 'unsafe-inline'`).
### Writing a News post
To write a News post, simply include your new post in the `news/` directory.
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]