agerix/iconify
2
0
Fork 0
mirror of https://github.com/iconify/iconify.git synced 2025-01-06 07:20:40 +00:00
Code Issues Releases Activity

fix(iconify-icon): correctly handle unset width/height in svg mode

Browse Source
This commit is contained in:
Vjacheslav Trushkin 2023-02-21 09:04:06 +02:00
parent 0d5431deac
commit 2fc81ae9d8
6 changed files with 21 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
iconify-icon/icon/README.md
View File

@ -20,13 +20,13 @@ Iconify Icon web component renders icons.
Add this line to your page to load IconifyIcon (you can add it to `<head>` section of the page or before `</body>`):
```html
<script src="https://code.iconify.design/iconify-icon/1.0.6/iconify-icon.min.js"></script>
<script src="https://code.iconify.design/iconify-icon/1.0.7/iconify-icon.min.js"></script>
```
or
```html
<script src="https://cdn.jsdelivr.net/npm/iconify-icon@1.0.6/dist/iconify-icon.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/iconify-icon@1.0.7/dist/iconify-icon.min.js"></script>
```
or, if you are building a project with a bundler, you can include the script by installing `iconify-icon` as a dependency and importing it in your project:

3
iconify-icon/icon/demo/usage.html
View File

@ -50,10 +50,11 @@
@keyframes animate-unset {
0% {
width: 24px;
height: 24px;
color: #000;
}
50% {
width: 64px;
width: 128px;
height: 64px;
color: #800;
}

2
iconify-icon/icon/package.json
View File

@ -2,7 +2,7 @@
"name": "iconify-icon",
"description": "Icon web component that loads icon data on demand. Over 150,000 icons to choose from",
"author": "Vjacheslav Trushkin <cyberalien@gmail.com> (https://iconify.design)",
"version": "1.0.6",
"version": "1.0.7",
"license": "MIT",
"main": "./dist/iconify-icon.cjs",
"types": "./dist/iconify-icon.d.ts",

15
iconify-icon/icon/src/render/svg.ts
View File

@ -7,7 +7,20 @@ import { iconToHTML } from '@iconify/utils/lib/svg/html';
export function renderSVG(data: IconifyIconBuildResult): Element {
const node = document.createElement('span');
// Add style if needed
const attr = data.attributes as Record<string, string>;
let style = '';
if (!attr.width) {
style = 'width: inherit;';
}
if (!attr.height) {
style += 'height: inherit;';
}
if (style) {
attr.style = style;
}
// Generate SVG
node.innerHTML = iconToHTML(data.body, data.attributes);
node.innerHTML = iconToHTML(data.body, attr);
return node.firstChild as HTMLElement;
}

2
iconify-icon/react/package.json
View File

@ -2,7 +2,7 @@
"name": "@iconify-icon/react",
"description": "React wrapper for Iconify Icon web component",
"author": "Vjacheslav Trushkin",
"version": "1.0.6",
"version": "1.0.7",
"license": "MIT",
"bugs": "https://github.com/iconify/iconify/issues",
"homepage": "https://iconify.design/",

2
iconify-icon/solid/package.json
View File

@ -3,7 +3,7 @@
"type": "module",
"description": "SolidJS wrapper for Iconify Icon web component",
"author": "Vjacheslav Trushkin",
"version": "1.0.6",
"version": "1.0.7",
"license": "MIT",
"bugs": "https://github.com/iconify/iconify/issues",
"homepage": "https://iconify.design/",