From 5a20e51d649d0d0b0fb8e1b0a863fbd5203e2900 Mon Sep 17 00:00:00 2001 From: Jude Agboola Date: Thu, 25 Aug 2022 10:10:09 +0100 Subject: [PATCH 1/9] upgrade svgo --- packages/gatsby-plugin-sharp/package.json | 2 +- .../src/__tests__/__snapshots__/index.js.snap | 8 +++--- packages/gatsby-plugin-sharp/src/trace-svg.js | 11 ++++---- yarn.lock | 26 +++++++++---------- 4 files changed, 24 insertions(+), 23 deletions(-) diff --git a/packages/gatsby-plugin-sharp/package.json b/packages/gatsby-plugin-sharp/package.json index 1093ca9088f76..28923a70a5331 100644 --- a/packages/gatsby-plugin-sharp/package.json +++ b/packages/gatsby-plugin-sharp/package.json @@ -21,7 +21,7 @@ "probe-image-size": "^7.2.3", "semver": "^7.3.7", "sharp": "^0.30.7", - "svgo": "1.3.2" + "svgo": "2.8.0" }, "devDependencies": { "@babel/cli": "^7.15.4", diff --git a/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap b/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap index ea17e500aba82..5d1766c7135c9 100644 --- a/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap +++ b/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap @@ -5,7 +5,7 @@ Object { "aspectRatio": 1, "height": 20, "originalName": "test.png", - "src": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAACXBIWXMAAAsTAAALEwEAmpwYAAABP0lEQVQ4y2P4r8ZANmKgvuZ/agy/VaHojyopmv+CNf/XQCCoCEHNf1VBqv+oM5yVY1giwbBakuG2AkjknzoW/eh2/tdgOCPHYM7OwMDAwAgiGFgYGMJ5GF4og43ApRmuk58JqpMJRjIwMBizMbxTZviPaj8ihCD6rThAStkgljJATWEHc3P5wT5SxdD8B2ztERmQIiYGdAAxSpaF4T2q5TDN4HCaLgZSxMyAE1yQgwY+Fs1zxQloviSPTTMktM7JgVzIiKEH4hElFoavKogAQgltiJA3F0gdOyPC58yw8GsUwhFgUMvVGR4oMqiwogQbhOHLxfBLDcVabIlEneGxEkMMLwMvTLc4M0OdEMN3VfRIxp48/6mDnPdCieGkHCiRflRh+K+JPXljz1IQJ0AzhjrRGQPZC5As+ZeuhQGRmgHU8mT34D0STQAAAABJRU5ErkJggg==", + "src": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAACXBIWXMAAAsTAAALEwEAmpwYAAABRElEQVQ4y7WUzUrDQBSFT37aij8UFFqFNmriZFy7s8/QF+iiz+ArCL6EGzeufBDBRVEQV67ciLgR3YgoyVju3IkxTaa2osNw4Yb57pmcOzP4jPHrib+HVYwkRiIopnPBBtjNZ2opMZnTIomPGKMuTts4W8ftFn1JJW1nGsyClwH2GwDgUIDvYLCMx4hKKBvM5ChA0yXGBTwddYa9Op5KfO4Qx94CLa2xaDbqOj1oUvWkDCda9rxjNCcGl+r4eC6KZ7Ag+LhFizxYx3VgzK+AT9o/wDebVTC7dRXQDp0Swz8S1vC6kxtUcFvpDveXtEPfSriZf0dr2jBha5XE3TYi35jEk2X7i3gXBdmqQyJxH2K4YrrtABseDlfxJqYeki9eSdreQ4iLLp2Zl8iYpGa5GCm3XWYXQ1Kq5rrPXMKG/dtjMCM8Br7rZPFvbj2AAAAAAElFTkSuQmCC", "width": 20, } `; @@ -1014,7 +1014,7 @@ exports[`gatsby-plugin-sharp fluid ensure maxWidth is in srcSet breakpoints 1`] exports[`gatsby-plugin-sharp fluid includes responsive image properties, e.g. sizes, srcset, etc. 1`] = ` Object { "aspectRatio": 1, - "base64": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAACXBIWXMAAAsTAAALEwEAmpwYAAABP0lEQVQ4y2P4r8ZANmKgvuZ/agy/VaHojyopmv+CNf/XQCCoCEHNf1VBqv+oM5yVY1giwbBakuG2AkjknzoW/eh2/tdgOCPHYM7OwMDAwAgiGFgYGMJ5GF4og43ApRmuk58JqpMJRjIwMBizMbxTZviPaj8ihCD6rThAStkgljJATWEHc3P5wT5SxdD8B2ztERmQIiYGdAAxSpaF4T2q5TDN4HCaLgZSxMyAE1yQgwY+Fs1zxQloviSPTTMktM7JgVzIiKEH4hElFoavKogAQgltiJA3F0gdOyPC58yw8GsUwhFgUMvVGR4oMqiwogQbhOHLxfBLDcVabIlEneGxEkMMLwMvTLc4M0OdEMN3VfRIxp48/6mDnPdCieGkHCiRflRh+K+JPXljz1IQJ0AzhjrRGQPZC5As+ZeuhQGRmgHU8mT34D0STQAAAABJRU5ErkJggg==", + "base64": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAACXBIWXMAAAsTAAALEwEAmpwYAAABRElEQVQ4y7WUzUrDQBSFT37aij8UFFqFNmriZFy7s8/QF+iiz+ArCL6EGzeufBDBRVEQV67ciLgR3YgoyVju3IkxTaa2osNw4Yb57pmcOzP4jPHrib+HVYwkRiIopnPBBtjNZ2opMZnTIomPGKMuTts4W8ftFn1JJW1nGsyClwH2GwDgUIDvYLCMx4hKKBvM5ChA0yXGBTwddYa9Op5KfO4Qx94CLa2xaDbqOj1oUvWkDCda9rxjNCcGl+r4eC6KZ7Ag+LhFizxYx3VgzK+AT9o/wDebVTC7dRXQDp0Swz8S1vC6kxtUcFvpDveXtEPfSriZf0dr2jBha5XE3TYi35jEk2X7i3gXBdmqQyJxH2K4YrrtABseDlfxJqYeki9eSdreQ4iLLp2Zl8iYpGa5GCm3XWYXQ1Kq5rrPXMKG/dtjMCM8Br7rZPFvbj2AAAAAAElFTkSuQmCC", "density": 72, "originalImg": "/static/1234/7e516/test.png", "originalName": "test.png", @@ -1405,7 +1405,7 @@ Object { "originalName": "test.png", "src": "/static/1234/7e516/test.png", "srcSet": "/static/1234/7e516/test.png 1x", - "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20viewBox='0%200%20100%20100'%20preserveAspectRatio='none'%3e%3cpath%20d='M41%2024c-18%207-24%2029-11%2043%2015%2017%2044%208%2046-15%201-19-17-34-35-28'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", + "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20version='1.1'%20preserveAspectRatio='none'%3e%3cpath%20d='M%2040.627%2024.468%20C%2023.010%2030.748%2c%2017.338%2053.384%2c%2029.891%2067.311%20C%2045.080%2084.160%2c%2073.671%2074.751%2c%2075.713%2052.231%20C%2077.463%2032.931%2c%2058.650%2018.044%2c%2040.627%2024.468'%20stroke='none'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", "width": 100, } `; @@ -1425,6 +1425,6 @@ Object { /static/1234/a1812/test.png 50w, /static/1234/7e516/test.png 100w", "srcSetType": "image/png", - "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20viewBox='0%200%20100%20100'%20preserveAspectRatio='none'%3e%3cpath%20d='M41%2024c-18%207-24%2029-11%2043%2015%2017%2044%208%2046-15%201-19-17-34-35-28'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", + "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20version='1.1'%20preserveAspectRatio='none'%3e%3cpath%20d='M%2040.627%2024.468%20C%2023.010%2030.748%2c%2017.338%2053.384%2c%2029.891%2067.311%20C%2045.080%2084.160%2c%2073.671%2074.751%2c%2075.713%2052.231%20C%2077.463%2032.931%2c%2058.650%2018.044%2c%2040.627%2024.468'%20stroke='none'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", } `; diff --git a/packages/gatsby-plugin-sharp/src/trace-svg.js b/packages/gatsby-plugin-sharp/src/trace-svg.js index 0a039a50734bd..3cbadfaa8cd46 100644 --- a/packages/gatsby-plugin-sharp/src/trace-svg.js +++ b/packages/gatsby-plugin-sharp/src/trace-svg.js @@ -72,16 +72,17 @@ exports.notMemoizedPrepareTraceSVGInputFile = async ({ } const optimize = svg => { - const SVGO = require(`svgo`) - const svgo = new SVGO({ + const { optimize } = require(`svgo`) + const svgo = optimize(svg, { multipass: true, floatPrecision: 0, plugins: [ { - removeViewBox: false, + name: `removeViewBox`, }, { - addAttributesToSVGElement: { + name: `addAttributesToSVGElement`, + params: { attributes: [ { preserveAspectRatio: `none`, @@ -91,7 +92,7 @@ const optimize = svg => { }, ], }) - return svgo.optimize(svg).then(({ data }) => data) + return svgo.data } exports.notMemoizedtraceSVG = async ({ file, args, fileArgs, reporter }) => { diff --git a/yarn.lock b/yarn.lock index 0a71c69d7bd54..a4e4b5f0b8dd8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -23629,19 +23629,7 @@ svgo@1.3.2, svgo@^1.0.0: unquote "~1.1.1" util.promisify "~1.0.0" -svgo@^0.7.2: - version "0.7.2" - resolved "https://registry.yarnpkg.com/svgo/-/svgo-0.7.2.tgz#9f5772413952135c6fefbf40afe6a4faa88b4bb5" - dependencies: - coa "~1.0.1" - colors "~1.1.2" - csso "~2.3.1" - js-yaml "~3.7.0" - mkdirp "~0.5.1" - sax "~1.2.1" - whet.extend "~0.9.9" - -svgo@^2.3.0, svgo@^2.8.0: +svgo@2.8.0, svgo@^2.3.0, svgo@^2.8.0: version "2.8.0" resolved "https://registry.yarnpkg.com/svgo/-/svgo-2.8.0.tgz#4ff80cce6710dc2795f0c7c74101e6764cfccd24" integrity sha512-+N/Q9kV1+F+UeWYoSiULYo4xYSDQlTgb+ayMobAXPwMnLvop7oxKMo9OzIrX5x3eS4L4f2UHhc9axXwY8DpChg== @@ -23654,6 +23642,18 @@ svgo@^2.3.0, svgo@^2.8.0: picocolors "^1.0.0" stable "^0.1.8" +svgo@^0.7.2: + version "0.7.2" + resolved "https://registry.yarnpkg.com/svgo/-/svgo-0.7.2.tgz#9f5772413952135c6fefbf40afe6a4faa88b4bb5" + dependencies: + coa "~1.0.1" + colors "~1.1.2" + csso "~2.3.1" + js-yaml "~3.7.0" + mkdirp "~0.5.1" + sax "~1.2.1" + whet.extend "~0.9.9" + sw-precache@^5.2.0: version "5.2.1" resolved "https://registry.yarnpkg.com/sw-precache/-/sw-precache-5.2.1.tgz#06134f319eec68f3b9583ce9a7036b1c119f7179" From cec38533551afe80d068d4d389c107530a553c0c Mon Sep 17 00:00:00 2001 From: Jude Agboola Date: Thu, 25 Aug 2022 10:32:12 +0100 Subject: [PATCH 2/9] use 2.7.0 --- packages/gatsby-plugin-sharp/package.json | 2 +- yarn.lock | 28 +++++++++++++++++++---- 2 files changed, 24 insertions(+), 6 deletions(-) diff --git a/packages/gatsby-plugin-sharp/package.json b/packages/gatsby-plugin-sharp/package.json index 28923a70a5331..ca36ff742a47b 100644 --- a/packages/gatsby-plugin-sharp/package.json +++ b/packages/gatsby-plugin-sharp/package.json @@ -21,7 +21,7 @@ "probe-image-size": "^7.2.3", "semver": "^7.3.7", "sharp": "^0.30.7", - "svgo": "2.8.0" + "svgo": "2.7.0" }, "devDependencies": { "@babel/cli": "^7.15.4", diff --git a/yarn.lock b/yarn.lock index a4e4b5f0b8dd8..17c804276044e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -17257,6 +17257,11 @@ nan@^2.10.0, nan@^2.14.2: resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.2.tgz#f5376400695168f4cc694ac9393d0c9585eeea19" integrity sha512-M2ufzIiINKCuDfBSAUr1vWQ+vuVcA9kqx8JJUsbQi6yf1uGRyb7HfpdfUr5qLXf3B/t8dPvcjhKMmlfnP47EzQ== +nanocolors@^0.1.12: + version "0.1.12" + resolved "https://registry.yarnpkg.com/nanocolors/-/nanocolors-0.1.12.tgz#8577482c58cbd7b5bb1681db4cf48f11a87fd5f6" + integrity sha512-2nMHqg1x5PU+unxX7PGY7AuYxl2qDx7PSrTRjizr8sxdd3l/3hBuWWaki62qmtYm2U5i4Z5E7GbjlyDFhs9/EQ== + nanoid@^3.1.30, nanoid@^3.1.32: version "3.3.4" resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.4.tgz#730b67e3cd09e2deacf03c027c81c9d9dbc5e8ab" @@ -23629,17 +23634,17 @@ svgo@1.3.2, svgo@^1.0.0: unquote "~1.1.1" util.promisify "~1.0.0" -svgo@2.8.0, svgo@^2.3.0, svgo@^2.8.0: - version "2.8.0" - resolved "https://registry.yarnpkg.com/svgo/-/svgo-2.8.0.tgz#4ff80cce6710dc2795f0c7c74101e6764cfccd24" - integrity sha512-+N/Q9kV1+F+UeWYoSiULYo4xYSDQlTgb+ayMobAXPwMnLvop7oxKMo9OzIrX5x3eS4L4f2UHhc9axXwY8DpChg== +svgo@2.7.0: + version "2.7.0" + resolved "https://registry.yarnpkg.com/svgo/-/svgo-2.7.0.tgz#e164cded22f4408fe4978f082be80159caea1e2d" + integrity sha512-aDLsGkre4fTDCWvolyW+fs8ZJFABpzLXbtdK1y71CKnHzAnpDxKXPj2mNKj+pyOXUCzFHzuxRJ94XOFygOWV3w== dependencies: "@trysound/sax" "0.2.0" commander "^7.2.0" css-select "^4.1.3" css-tree "^1.1.3" csso "^4.2.0" - picocolors "^1.0.0" + nanocolors "^0.1.12" stable "^0.1.8" svgo@^0.7.2: @@ -23654,6 +23659,19 @@ svgo@^0.7.2: sax "~1.2.1" whet.extend "~0.9.9" +svgo@^2.3.0, svgo@^2.8.0: + version "2.8.0" + resolved "https://registry.yarnpkg.com/svgo/-/svgo-2.8.0.tgz#4ff80cce6710dc2795f0c7c74101e6764cfccd24" + integrity sha512-+N/Q9kV1+F+UeWYoSiULYo4xYSDQlTgb+ayMobAXPwMnLvop7oxKMo9OzIrX5x3eS4L4f2UHhc9axXwY8DpChg== + dependencies: + "@trysound/sax" "0.2.0" + commander "^7.2.0" + css-select "^4.1.3" + css-tree "^1.1.3" + csso "^4.2.0" + picocolors "^1.0.0" + stable "^0.1.8" + sw-precache@^5.2.0: version "5.2.1" resolved "https://registry.yarnpkg.com/sw-precache/-/sw-precache-5.2.1.tgz#06134f319eec68f3b9583ce9a7036b1c119f7179" From 805c2c52d032b22cf2fe0a9b2bb267bcec55e0d2 Mon Sep 17 00:00:00 2001 From: pieh Date: Thu, 25 Aug 2022 12:03:33 +0200 Subject: [PATCH 3/9] update snapshots --- .../src/__tests__/__snapshots__/index.js.snap | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap b/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap index 5d1766c7135c9..1d3dc1a9310d2 100644 --- a/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap +++ b/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap @@ -5,7 +5,7 @@ Object { "aspectRatio": 1, "height": 20, "originalName": "test.png", - "src": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAACXBIWXMAAAsTAAALEwEAmpwYAAABRElEQVQ4y7WUzUrDQBSFT37aij8UFFqFNmriZFy7s8/QF+iiz+ArCL6EGzeufBDBRVEQV67ciLgR3YgoyVju3IkxTaa2osNw4Yb57pmcOzP4jPHrib+HVYwkRiIopnPBBtjNZ2opMZnTIomPGKMuTts4W8ftFn1JJW1nGsyClwH2GwDgUIDvYLCMx4hKKBvM5ChA0yXGBTwddYa9Op5KfO4Qx94CLa2xaDbqOj1oUvWkDCda9rxjNCcGl+r4eC6KZ7Ag+LhFizxYx3VgzK+AT9o/wDebVTC7dRXQDp0Swz8S1vC6kxtUcFvpDveXtEPfSriZf0dr2jBha5XE3TYi35jEk2X7i3gXBdmqQyJxH2K4YrrtABseDlfxJqYeki9eSdreQ4iLLp2Zl8iYpGa5GCm3XWYXQ1Kq5rrPXMKG/dtjMCM8Br7rZPFvbj2AAAAAAElFTkSuQmCC", + "src": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAACXBIWXMAAAsTAAALEwEAmpwYAAABP0lEQVQ4y2P4r8ZANmKgvuZ/agy/VaHojyopmv+CNf/XQCCoCEHNf1VBqv+oM5yVY1giwbBakuG2AkjknzoW/eh2/tdgOCPHYM7OwMDAwAgiGFgYGMJ5GF4og43ApRmuk58JqpMJRjIwMBizMbxTZviPaj8ihCD6rThAStkgljJATWEHc3P5wT5SxdD8B2ztERmQIiYGdAAxSpaF4T2q5TDN4HCaLgZSxMyAE1yQgwY+Fs1zxQloviSPTTMktM7JgVzIiKEH4hElFoavKogAQgltiJA3F0gdOyPC58yw8GsUwhFgUMvVGR4oMqiwogQbhOHLxfBLDcVabIlEneGxEkMMLwMvTLc4M0OdEMN3VfRIxp48/6mDnPdCieGkHCiRflRh+K+JPXljz1IQJ0AzhjrRGQPZC5As+ZeuhQGRmgHU8mT34D0STQAAAABJRU5ErkJggg==", "width": 20, } `; @@ -1014,7 +1014,7 @@ exports[`gatsby-plugin-sharp fluid ensure maxWidth is in srcSet breakpoints 1`] exports[`gatsby-plugin-sharp fluid includes responsive image properties, e.g. sizes, srcset, etc. 1`] = ` Object { "aspectRatio": 1, - "base64": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAACXBIWXMAAAsTAAALEwEAmpwYAAABRElEQVQ4y7WUzUrDQBSFT37aij8UFFqFNmriZFy7s8/QF+iiz+ArCL6EGzeufBDBRVEQV67ciLgR3YgoyVju3IkxTaa2osNw4Yb57pmcOzP4jPHrib+HVYwkRiIopnPBBtjNZ2opMZnTIomPGKMuTts4W8ftFn1JJW1nGsyClwH2GwDgUIDvYLCMx4hKKBvM5ChA0yXGBTwddYa9Op5KfO4Qx94CLa2xaDbqOj1oUvWkDCda9rxjNCcGl+r4eC6KZ7Ag+LhFizxYx3VgzK+AT9o/wDebVTC7dRXQDp0Swz8S1vC6kxtUcFvpDveXtEPfSriZf0dr2jBha5XE3TYi35jEk2X7i3gXBdmqQyJxH2K4YrrtABseDlfxJqYeki9eSdreQ4iLLp2Zl8iYpGa5GCm3XWYXQ1Kq5rrPXMKG/dtjMCM8Br7rZPFvbj2AAAAAAElFTkSuQmCC", + "base64": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAACXBIWXMAAAsTAAALEwEAmpwYAAABP0lEQVQ4y2P4r8ZANmKgvuZ/agy/VaHojyopmv+CNf/XQCCoCEHNf1VBqv+oM5yVY1giwbBakuG2AkjknzoW/eh2/tdgOCPHYM7OwMDAwAgiGFgYGMJ5GF4og43ApRmuk58JqpMJRjIwMBizMbxTZviPaj8ihCD6rThAStkgljJATWEHc3P5wT5SxdD8B2ztERmQIiYGdAAxSpaF4T2q5TDN4HCaLgZSxMyAE1yQgwY+Fs1zxQloviSPTTMktM7JgVzIiKEH4hElFoavKogAQgltiJA3F0gdOyPC58yw8GsUwhFgUMvVGR4oMqiwogQbhOHLxfBLDcVabIlEneGxEkMMLwMvTLc4M0OdEMN3VfRIxp48/6mDnPdCieGkHCiRflRh+K+JPXljz1IQJ0AzhjrRGQPZC5As+ZeuhQGRmgHU8mT34D0STQAAAABJRU5ErkJggg==", "density": 72, "originalImg": "/static/1234/7e516/test.png", "originalName": "test.png", From 913e7b80a95c8111dd049e1b0fa2f3981cf874bc Mon Sep 17 00:00:00 2001 From: pieh Date: Thu, 25 Aug 2022 12:12:05 +0200 Subject: [PATCH 4/9] bump back again, don't remove viewbox --- packages/gatsby-plugin-sharp/package.json | 4 ++-- .../src/__tests__/__snapshots__/index.js.snap | 4 ++-- packages/gatsby-plugin-sharp/src/trace-svg.js | 3 --- yarn.lock | 18 ------------------ 4 files changed, 4 insertions(+), 25 deletions(-) diff --git a/packages/gatsby-plugin-sharp/package.json b/packages/gatsby-plugin-sharp/package.json index ca36ff742a47b..840f5418e207a 100644 --- a/packages/gatsby-plugin-sharp/package.json +++ b/packages/gatsby-plugin-sharp/package.json @@ -21,7 +21,7 @@ "probe-image-size": "^7.2.3", "semver": "^7.3.7", "sharp": "^0.30.7", - "svgo": "2.7.0" + "svgo": "^2.8.0" }, "devDependencies": { "@babel/cli": "^7.15.4", @@ -56,4 +56,4 @@ "engines": { "node": ">=14.15.0" } -} +} \ No newline at end of file diff --git a/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap b/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap index 1d3dc1a9310d2..aacfcb05bf3ad 100644 --- a/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap +++ b/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap @@ -1405,7 +1405,7 @@ Object { "originalName": "test.png", "src": "/static/1234/7e516/test.png", "srcSet": "/static/1234/7e516/test.png 1x", - "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20version='1.1'%20preserveAspectRatio='none'%3e%3cpath%20d='M%2040.627%2024.468%20C%2023.010%2030.748%2c%2017.338%2053.384%2c%2029.891%2067.311%20C%2045.080%2084.160%2c%2073.671%2074.751%2c%2075.713%2052.231%20C%2077.463%2032.931%2c%2058.650%2018.044%2c%2040.627%2024.468'%20stroke='none'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", + "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20viewBox='0%200%20100%20100'%20version='1.1'%20preserveAspectRatio='none'%3e%3cpath%20d='M%2040.627%2024.468%20C%2023.010%2030.748%2c%2017.338%2053.384%2c%2029.891%2067.311%20C%2045.080%2084.160%2c%2073.671%2074.751%2c%2075.713%2052.231%20C%2077.463%2032.931%2c%2058.650%2018.044%2c%2040.627%2024.468'%20stroke='none'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", "width": 100, } `; @@ -1425,6 +1425,6 @@ Object { /static/1234/a1812/test.png 50w, /static/1234/7e516/test.png 100w", "srcSetType": "image/png", - "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20version='1.1'%20preserveAspectRatio='none'%3e%3cpath%20d='M%2040.627%2024.468%20C%2023.010%2030.748%2c%2017.338%2053.384%2c%2029.891%2067.311%20C%2045.080%2084.160%2c%2073.671%2074.751%2c%2075.713%2052.231%20C%2077.463%2032.931%2c%2058.650%2018.044%2c%2040.627%2024.468'%20stroke='none'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", + "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20viewBox='0%200%20100%20100'%20version='1.1'%20preserveAspectRatio='none'%3e%3cpath%20d='M%2040.627%2024.468%20C%2023.010%2030.748%2c%2017.338%2053.384%2c%2029.891%2067.311%20C%2045.080%2084.160%2c%2073.671%2074.751%2c%2075.713%2052.231%20C%2077.463%2032.931%2c%2058.650%2018.044%2c%2040.627%2024.468'%20stroke='none'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", } `; diff --git a/packages/gatsby-plugin-sharp/src/trace-svg.js b/packages/gatsby-plugin-sharp/src/trace-svg.js index 3cbadfaa8cd46..1530e1fb2b4bc 100644 --- a/packages/gatsby-plugin-sharp/src/trace-svg.js +++ b/packages/gatsby-plugin-sharp/src/trace-svg.js @@ -77,9 +77,6 @@ const optimize = svg => { multipass: true, floatPrecision: 0, plugins: [ - { - name: `removeViewBox`, - }, { name: `addAttributesToSVGElement`, params: { diff --git a/yarn.lock b/yarn.lock index 17c804276044e..0a71c69d7bd54 100644 --- a/yarn.lock +++ b/yarn.lock @@ -17257,11 +17257,6 @@ nan@^2.10.0, nan@^2.14.2: resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.2.tgz#f5376400695168f4cc694ac9393d0c9585eeea19" integrity sha512-M2ufzIiINKCuDfBSAUr1vWQ+vuVcA9kqx8JJUsbQi6yf1uGRyb7HfpdfUr5qLXf3B/t8dPvcjhKMmlfnP47EzQ== -nanocolors@^0.1.12: - version "0.1.12" - resolved "https://registry.yarnpkg.com/nanocolors/-/nanocolors-0.1.12.tgz#8577482c58cbd7b5bb1681db4cf48f11a87fd5f6" - integrity sha512-2nMHqg1x5PU+unxX7PGY7AuYxl2qDx7PSrTRjizr8sxdd3l/3hBuWWaki62qmtYm2U5i4Z5E7GbjlyDFhs9/EQ== - nanoid@^3.1.30, nanoid@^3.1.32: version "3.3.4" resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.4.tgz#730b67e3cd09e2deacf03c027c81c9d9dbc5e8ab" @@ -23634,19 +23629,6 @@ svgo@1.3.2, svgo@^1.0.0: unquote "~1.1.1" util.promisify "~1.0.0" -svgo@2.7.0: - version "2.7.0" - resolved "https://registry.yarnpkg.com/svgo/-/svgo-2.7.0.tgz#e164cded22f4408fe4978f082be80159caea1e2d" - integrity sha512-aDLsGkre4fTDCWvolyW+fs8ZJFABpzLXbtdK1y71CKnHzAnpDxKXPj2mNKj+pyOXUCzFHzuxRJ94XOFygOWV3w== - dependencies: - "@trysound/sax" "0.2.0" - commander "^7.2.0" - css-select "^4.1.3" - css-tree "^1.1.3" - csso "^4.2.0" - nanocolors "^0.1.12" - stable "^0.1.8" - svgo@^0.7.2: version "0.7.2" resolved "https://registry.yarnpkg.com/svgo/-/svgo-0.7.2.tgz#9f5772413952135c6fefbf40afe6a4faa88b4bb5" From 6dfe41f7ef86402b07541f92711fef73b041ccdd Mon Sep 17 00:00:00 2001 From: pieh Date: Thu, 25 Aug 2022 12:32:50 +0200 Subject: [PATCH 5/9] restore default preset --- .../src/__tests__/__snapshots__/index.js.snap | 4 ++-- packages/gatsby-plugin-sharp/src/trace-svg.js | 10 ++++++++++ 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap b/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap index aacfcb05bf3ad..ea17e500aba82 100644 --- a/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap +++ b/packages/gatsby-plugin-sharp/src/__tests__/__snapshots__/index.js.snap @@ -1405,7 +1405,7 @@ Object { "originalName": "test.png", "src": "/static/1234/7e516/test.png", "srcSet": "/static/1234/7e516/test.png 1x", - "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20viewBox='0%200%20100%20100'%20version='1.1'%20preserveAspectRatio='none'%3e%3cpath%20d='M%2040.627%2024.468%20C%2023.010%2030.748%2c%2017.338%2053.384%2c%2029.891%2067.311%20C%2045.080%2084.160%2c%2073.671%2074.751%2c%2075.713%2052.231%20C%2077.463%2032.931%2c%2058.650%2018.044%2c%2040.627%2024.468'%20stroke='none'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", + "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20viewBox='0%200%20100%20100'%20preserveAspectRatio='none'%3e%3cpath%20d='M41%2024c-18%207-24%2029-11%2043%2015%2017%2044%208%2046-15%201-19-17-34-35-28'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", "width": 100, } `; @@ -1425,6 +1425,6 @@ Object { /static/1234/a1812/test.png 50w, /static/1234/7e516/test.png 100w", "srcSetType": "image/png", - "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20viewBox='0%200%20100%20100'%20version='1.1'%20preserveAspectRatio='none'%3e%3cpath%20d='M%2040.627%2024.468%20C%2023.010%2030.748%2c%2017.338%2053.384%2c%2029.891%2067.311%20C%2045.080%2084.160%2c%2073.671%2074.751%2c%2075.713%2052.231%20C%2077.463%2032.931%2c%2058.650%2018.044%2c%2040.627%2024.468'%20stroke='none'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", + "tracedSVG": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='100'%20height='100'%20viewBox='0%200%20100%20100'%20preserveAspectRatio='none'%3e%3cpath%20d='M41%2024c-18%207-24%2029-11%2043%2015%2017%2044%208%2046-15%201-19-17-34-35-28'%20fill='red'%20fill-rule='evenodd'/%3e%3c/svg%3e", } `; diff --git a/packages/gatsby-plugin-sharp/src/trace-svg.js b/packages/gatsby-plugin-sharp/src/trace-svg.js index 1530e1fb2b4bc..31618114acf96 100644 --- a/packages/gatsby-plugin-sharp/src/trace-svg.js +++ b/packages/gatsby-plugin-sharp/src/trace-svg.js @@ -77,6 +77,16 @@ const optimize = svg => { multipass: true, floatPrecision: 0, plugins: [ + // "preset-default", + { + name: `preset-default`, + params: { + overrides: { + // or disable plugins + removeViewBox: false, + }, + }, + }, { name: `addAttributesToSVGElement`, params: { From 7f29c4db6f20c9bfbc09407c75bd0dad1dfc3657 Mon Sep 17 00:00:00 2001 From: pieh Date: Thu, 25 Aug 2022 12:45:18 +0200 Subject: [PATCH 6/9] drop comment --- packages/gatsby-plugin-sharp/src/trace-svg.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/gatsby-plugin-sharp/src/trace-svg.js b/packages/gatsby-plugin-sharp/src/trace-svg.js index 31618114acf96..073adb026d741 100644 --- a/packages/gatsby-plugin-sharp/src/trace-svg.js +++ b/packages/gatsby-plugin-sharp/src/trace-svg.js @@ -77,7 +77,6 @@ const optimize = svg => { multipass: true, floatPrecision: 0, plugins: [ - // "preset-default", { name: `preset-default`, params: { From 6193085931e24be12606b4676c8de062b77706cc Mon Sep 17 00:00:00 2001 From: pieh Date: Thu, 25 Aug 2022 12:47:25 +0200 Subject: [PATCH 7/9] adjust comment about disabling removeViewBox plugin --- packages/gatsby-plugin-sharp/src/trace-svg.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/gatsby-plugin-sharp/src/trace-svg.js b/packages/gatsby-plugin-sharp/src/trace-svg.js index 073adb026d741..876f6155dd249 100644 --- a/packages/gatsby-plugin-sharp/src/trace-svg.js +++ b/packages/gatsby-plugin-sharp/src/trace-svg.js @@ -81,7 +81,7 @@ const optimize = svg => { name: `preset-default`, params: { overrides: { - // or disable plugins + // disable removeViewBox plugin removeViewBox: false, }, }, From 255a47424a8236e36df53a5199cd4468ba845c6b Mon Sep 17 00:00:00 2001 From: pieh Date: Thu, 25 Aug 2022 12:55:40 +0200 Subject: [PATCH 8/9] don't name result of svgo.optimize 'svgo' to avoid confusion --- packages/gatsby-plugin-sharp/src/trace-svg.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/gatsby-plugin-sharp/src/trace-svg.js b/packages/gatsby-plugin-sharp/src/trace-svg.js index 876f6155dd249..d216b192425a9 100644 --- a/packages/gatsby-plugin-sharp/src/trace-svg.js +++ b/packages/gatsby-plugin-sharp/src/trace-svg.js @@ -73,7 +73,7 @@ exports.notMemoizedPrepareTraceSVGInputFile = async ({ const optimize = svg => { const { optimize } = require(`svgo`) - const svgo = optimize(svg, { + const { data } = optimize(svg, { multipass: true, floatPrecision: 0, plugins: [ @@ -98,7 +98,7 @@ const optimize = svg => { }, ], }) - return svgo.data + return data } exports.notMemoizedtraceSVG = async ({ file, args, fileArgs, reporter }) => { From f219581e45bef973321b3b47b5d15544dc0800a8 Mon Sep 17 00:00:00 2001 From: Jude Agboola Date: Thu, 25 Aug 2022 16:46:52 +0100 Subject: [PATCH 9/9] update snap --- .../src/__tests__/__snapshots__/gatsby-plugin-image.js.snap | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/gatsby-source-contentful/src/__tests__/__snapshots__/gatsby-plugin-image.js.snap b/packages/gatsby-source-contentful/src/__tests__/__snapshots__/gatsby-plugin-image.js.snap index ca23ed7eb3b1c..4a949fcad7511 100644 --- a/packages/gatsby-source-contentful/src/__tests__/__snapshots__/gatsby-plugin-image.js.snap +++ b/packages/gatsby-source-contentful/src/__tests__/__snapshots__/gatsby-plugin-image.js.snap @@ -81,7 +81,7 @@ https://images.ctfassets.net:443/k8iqpp6u0ior/3ljGfnpegOnBTFGhV07iC1/94257340bda }, "layout": "constrained", "placeholder": Object { - "fallback": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='82'%20viewBox='0%200%20400%2082'%20preserveAspectRatio='none'%3e%3cpath%20d='M27%203C15%208%2010%2013%2010%2019c0%208%209%2011%2015%205%2010-8%2022-8%2032%200%204%204%209%204%2012%201C82%2012%2048-6%2027%203m305%207c-5%203-6%208-6%2029s0%2022%205%2022%205-1%205-16V32h4c4%200%206-2%206-5-1-3-2-3-6-3s-4%200-4-2c0-3%203-6%206-6%204%200%205-2%205-5-1-4-10-4-15-1m-130%205l-1%2019v19l3%203c3%203%203%203%209%203l6%201v-4c0-3-1-3-4-4-4-1-5-4-5-13%200-7%201-7%203-7%206%201%209-3%207-7-1-2-2-2-5-2h-5v-4c0-4-1-5-4-5l-4%201m102%200c-2%202-1%2034%200%2038%203%206%207%208%2015%207%205%200%203-8-1-8s-5-2-5-11v-9h4c4%200%206-1%206-4%200-4-2-5-6-5s-4%200-4-3l-1-5h-8m87%200v45l4%201%204-1V15h-8M96%2024c-14%207-15%2027-2%2034%207%204%2019%203%2023-2%201-2%201-2-1-5-3-2-3-2-7-1-10%204-17-3-14-12%202-6%208-9%2014-6%203%201%208-2%208-5%200-4-16-7-21-3m32%200c-15%208-12%2032%204%2036%2015%204%2028-9%2024-24-3-11-17-17-28-12m49-1l-5%202c-3%202-3%202-4%200s-2-2-4-2l-3%201-1%2015c-1%2019-1%2021%205%2021h4V49c1-13%201-14%205-17%204-2%206-1%2010%201%202%203%202%203%203%2015l1%2012h8V46c0-15-1-17-7-21-3-2-9-3-12-2m55%201c-15%207-15%2029%200%2035%207%203%2018%202%2023-2l2-2-2-3c-3-2-3-2-6-1-6%202-13%201-16-1-4-5-3-5%2012-5h14v-5c0-14-14-22-27-16m31%200l-1%2018v17l2%201c6%202%208%200%208-12%200-13%202-16%2010-16%205%200%207%203%207%2016l1%2011c2%202%205%202%207%201%203-2%203-25-1-30-4-7-14-9-21-5-4%202-4%202-4%200-1-2-6-3-8-1m87%200c-3%202-2%2024%200%2029%204%208%2014%2010%2022%206l4-1c0%202%205%204%207%202%201-1%202-3%202-18V25l-4-1c-6%200-6%201-6%2013s-2%2015-9%2015-8-3-8-16c0-10%200-11-2-12h-6M131%2034c-6%205-3%2016%204%2018%209%201%2015-8%2010-16-3-6-9-7-14-2M14%2055c-9%205-5%2015%208%2022%2016%208%2034%205%2046-6%2010-9-1-22-11-13-10%208-22%208-31%200-4-4-9-5-12-3'%20fill='%23639'%20fill-rule='evenodd'/%3e%3c/svg%3e", + "fallback": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='82'%20viewBox='0%200%20400%2082'%20preserveAspectRatio='none'%3e%3cpath%20d='M27%203C15%208%2010%2013%2010%2019c0%208%209%2011%2015%205%2010-8%2022-8%2032%200%204%204%209%204%2012%201C82%2012%2048-6%2027%203m305%207c-5%203-6%208-6%2029s0%2022%205%2022%205-1%205-16V32h4c4%200%206-2%206-5-1-3-2-3-6-3s-4%200-4-2c0-3%203-6%206-6%204%200%205-2%205-5-1-4-10-4-15-1m-130%205-1%2019v19l3%203c3%203%203%203%209%203l6%201v-4c0-3-1-3-4-4-4-1-5-4-5-13%200-7%201-7%203-7%206%201%209-3%207-7-1-2-2-2-5-2h-5v-4c0-4-1-5-4-5l-4%201m102%200c-2%202-1%2034%200%2038%203%206%207%208%2015%207%205%200%203-8-1-8s-5-2-5-11v-9h4c4%200%206-1%206-4%200-4-2-5-6-5s-4%200-4-3l-1-5h-8m87%200v45l4%201%204-1V15h-8M96%2024c-14%207-15%2027-2%2034%207%204%2019%203%2023-2%201-2%201-2-1-5-3-2-3-2-7-1-10%204-17-3-14-12%202-6%208-9%2014-6%203%201%208-2%208-5%200-4-16-7-21-3m32%200c-15%208-12%2032%204%2036%2015%204%2028-9%2024-24-3-11-17-17-28-12m49-1-5%202c-3%202-3%202-4%200s-2-2-4-2l-3%201-1%2015c-1%2019-1%2021%205%2021h4V49c1-13%201-14%205-17%204-2%206-1%2010%201%202%203%202%203%203%2015l1%2012h8V46c0-15-1-17-7-21-3-2-9-3-12-2m55%201c-15%207-15%2029%200%2035%207%203%2018%202%2023-2l2-2-2-3c-3-2-3-2-6-1-6%202-13%201-16-1-4-5-3-5%2012-5h14v-5c0-14-14-22-27-16m31%200-1%2018v17l2%201c6%202%208%200%208-12%200-13%202-16%2010-16%205%200%207%203%207%2016l1%2011c2%202%205%202%207%201%203-2%203-25-1-30-4-7-14-9-21-5-4%202-4%202-4%200-1-2-6-3-8-1m87%200c-3%202-2%2024%200%2029%204%208%2014%2010%2022%206l4-1c0%202%205%204%207%202%201-1%202-3%202-18V25l-4-1c-6%200-6%201-6%2013s-2%2015-9%2015-8-3-8-16c0-10%200-11-2-12h-6M131%2034c-6%205-3%2016%204%2018%209%201%2015-8%2010-16-3-6-9-7-14-2M14%2055c-9%205-5%2015%208%2022%2016%208%2034%205%2046-6%2010-9-1-22-11-13-10%208-22%208-31%200-4-4-9-5-12-3'%20fill='%23639'%20fill-rule='evenodd'/%3e%3c/svg%3e", }, "width": "1646", } @@ -357,7 +357,7 @@ https://images.ctfassets.net:443/k8iqpp6u0ior/3ljGfnpegOnBTFGhV07iC1/94257340bda }, "layout": "constrained", "placeholder": Object { - "fallback": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='82'%20viewBox='0%200%20400%2082'%20preserveAspectRatio='none'%3e%3cpath%20d='M27%203C15%208%2010%2013%2010%2019c0%208%209%2011%2015%205%2010-8%2022-8%2032%200%204%204%209%204%2012%201C82%2012%2048-6%2027%203m305%207c-5%203-6%208-6%2029s0%2022%205%2022%205-1%205-16V32h4c4%200%206-2%206-5-1-3-2-3-6-3s-4%200-4-2c0-3%203-6%206-6%204%200%205-2%205-5-1-4-10-4-15-1m-130%205l-1%2019v19l3%203c3%203%203%203%209%203l6%201v-4c0-3-1-3-4-4-4-1-5-4-5-13%200-7%201-7%203-7%206%201%209-3%207-7-1-2-2-2-5-2h-5v-4c0-4-1-5-4-5l-4%201m102%200c-2%202-1%2034%200%2038%203%206%207%208%2015%207%205%200%203-8-1-8s-5-2-5-11v-9h4c4%200%206-1%206-4%200-4-2-5-6-5s-4%200-4-3l-1-5h-8m87%200v45l4%201%204-1V15h-8M96%2024c-14%207-15%2027-2%2034%207%204%2019%203%2023-2%201-2%201-2-1-5-3-2-3-2-7-1-10%204-17-3-14-12%202-6%208-9%2014-6%203%201%208-2%208-5%200-4-16-7-21-3m32%200c-15%208-12%2032%204%2036%2015%204%2028-9%2024-24-3-11-17-17-28-12m49-1l-5%202c-3%202-3%202-4%200s-2-2-4-2l-3%201-1%2015c-1%2019-1%2021%205%2021h4V49c1-13%201-14%205-17%204-2%206-1%2010%201%202%203%202%203%203%2015l1%2012h8V46c0-15-1-17-7-21-3-2-9-3-12-2m55%201c-15%207-15%2029%200%2035%207%203%2018%202%2023-2l2-2-2-3c-3-2-3-2-6-1-6%202-13%201-16-1-4-5-3-5%2012-5h14v-5c0-14-14-22-27-16m31%200l-1%2018v17l2%201c6%202%208%200%208-12%200-13%202-16%2010-16%205%200%207%203%207%2016l1%2011c2%202%205%202%207%201%203-2%203-25-1-30-4-7-14-9-21-5-4%202-4%202-4%200-1-2-6-3-8-1m87%200c-3%202-2%2024%200%2029%204%208%2014%2010%2022%206l4-1c0%202%205%204%207%202%201-1%202-3%202-18V25l-4-1c-6%200-6%201-6%2013s-2%2015-9%2015-8-3-8-16c0-10%200-11-2-12h-6M131%2034c-6%205-3%2016%204%2018%209%201%2015-8%2010-16-3-6-9-7-14-2M14%2055c-9%205-5%2015%208%2022%2016%208%2034%205%2046-6%2010-9-1-22-11-13-10%208-22%208-31%200-4-4-9-5-12-3'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e", + "fallback": "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='400'%20height='82'%20viewBox='0%200%20400%2082'%20preserveAspectRatio='none'%3e%3cpath%20d='M27%203C15%208%2010%2013%2010%2019c0%208%209%2011%2015%205%2010-8%2022-8%2032%200%204%204%209%204%2012%201C82%2012%2048-6%2027%203m305%207c-5%203-6%208-6%2029s0%2022%205%2022%205-1%205-16V32h4c4%200%206-2%206-5-1-3-2-3-6-3s-4%200-4-2c0-3%203-6%206-6%204%200%205-2%205-5-1-4-10-4-15-1m-130%205-1%2019v19l3%203c3%203%203%203%209%203l6%201v-4c0-3-1-3-4-4-4-1-5-4-5-13%200-7%201-7%203-7%206%201%209-3%207-7-1-2-2-2-5-2h-5v-4c0-4-1-5-4-5l-4%201m102%200c-2%202-1%2034%200%2038%203%206%207%208%2015%207%205%200%203-8-1-8s-5-2-5-11v-9h4c4%200%206-1%206-4%200-4-2-5-6-5s-4%200-4-3l-1-5h-8m87%200v45l4%201%204-1V15h-8M96%2024c-14%207-15%2027-2%2034%207%204%2019%203%2023-2%201-2%201-2-1-5-3-2-3-2-7-1-10%204-17-3-14-12%202-6%208-9%2014-6%203%201%208-2%208-5%200-4-16-7-21-3m32%200c-15%208-12%2032%204%2036%2015%204%2028-9%2024-24-3-11-17-17-28-12m49-1-5%202c-3%202-3%202-4%200s-2-2-4-2l-3%201-1%2015c-1%2019-1%2021%205%2021h4V49c1-13%201-14%205-17%204-2%206-1%2010%201%202%203%202%203%203%2015l1%2012h8V46c0-15-1-17-7-21-3-2-9-3-12-2m55%201c-15%207-15%2029%200%2035%207%203%2018%202%2023-2l2-2-2-3c-3-2-3-2-6-1-6%202-13%201-16-1-4-5-3-5%2012-5h14v-5c0-14-14-22-27-16m31%200-1%2018v17l2%201c6%202%208%200%208-12%200-13%202-16%2010-16%205%200%207%203%207%2016l1%2011c2%202%205%202%207%201%203-2%203-25-1-30-4-7-14-9-21-5-4%202-4%202-4%200-1-2-6-3-8-1m87%200c-3%202-2%2024%200%2029%204%208%2014%2010%2022%206l4-1c0%202%205%204%207%202%201-1%202-3%202-18V25l-4-1c-6%200-6%201-6%2013s-2%2015-9%2015-8-3-8-16c0-10%200-11-2-12h-6M131%2034c-6%205-3%2016%204%2018%209%201%2015-8%2010-16-3-6-9-7-14-2M14%2055c-9%205-5%2015%208%2022%2016%208%2034%205%2046-6%2010-9-1-22-11-13-10%208-22%208-31%200-4-4-9-5-12-3'%20fill='%23d3d3d3'%20fill-rule='evenodd'/%3e%3c/svg%3e", }, "width": "1646", }