mirror of
https://github.com/atisawd/boxicons.git
synced 2024-11-13 19:04:52 +01:00
1.5.3
This commit is contained in:
parent
2a18efb31d
commit
0474a3fddd
9 changed files with 40 additions and 29 deletions
|
@ -8,7 +8,7 @@ _High Quality web friendly icons_
|
|||
'Boxicons' is a carefully designed open source iconset with 700+ icons. It's crafted to look enrich your website/app experience.
|
||||
|
||||
|
||||
_Announcing Boxicons v1.5.2!_
|
||||
_Announcing Boxicons v1.5.3!_
|
||||
|
||||
Load the icons as web component , load only the icons you need .
|
||||
|
||||
|
|
2
dist/boxicons.js
vendored
2
dist/boxicons.js
vendored
File diff suppressed because one or more lines are too long
|
@ -75,6 +75,6 @@
|
|||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script src="static/dist/bundle.js?v=3" async></script>
|
||||
<script src="static/dist/bundle.js?v=4" async></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -91,10 +91,10 @@ export class BoxIconElement extends HTMLElement {
|
|||
|
||||
static get observedAttributes() {
|
||||
return [
|
||||
'type',
|
||||
'name',
|
||||
'color',
|
||||
'size',
|
||||
'type',
|
||||
'rotate',
|
||||
'flip',
|
||||
'animation',
|
||||
|
@ -113,7 +113,6 @@ export class BoxIconElement extends HTMLElement {
|
|||
*/
|
||||
static getIconSvg(iconName,type) {
|
||||
var iconUrl = `${this.cdnUrl}/regular/bx-${iconName}.svg`;
|
||||
console.log(type);
|
||||
if(type==='solid'){
|
||||
iconUrl = `${this.cdnUrl}/solid/bxs-${iconName}.svg`;
|
||||
}
|
||||
|
@ -169,6 +168,10 @@ export class BoxIconElement extends HTMLElement {
|
|||
const $iconHolder = this._state.$iconHolder;
|
||||
|
||||
switch (attr) {
|
||||
|
||||
case 'type':
|
||||
handleTypeChange(this, oldVal, newVal);
|
||||
break;
|
||||
case 'name':
|
||||
handleNameChange(this, oldVal, newVal);
|
||||
break;
|
||||
|
@ -178,9 +181,6 @@ export class BoxIconElement extends HTMLElement {
|
|||
case 'size':
|
||||
handleSizeChange(this, oldVal, newVal);
|
||||
break;
|
||||
case 'type':
|
||||
handleTypeChange(this, oldVal, newVal);
|
||||
break;
|
||||
case 'rotate':
|
||||
if (oldVal) {
|
||||
$iconHolder.classList.remove(`${CSS_CLASS_PREFIX_ROTATE}${oldVal}`);
|
||||
|
@ -214,27 +214,9 @@ export class BoxIconElement extends HTMLElement {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
function handleNameChange(inst, oldVal, newVal) {
|
||||
const state = inst._state;
|
||||
state.currentName = newVal;
|
||||
state.$iconHolder.textContent = '';
|
||||
|
||||
if (newVal) {
|
||||
inst.constructor.getIconSvg(newVal,state.type)
|
||||
.then((iconData) => {
|
||||
if (state.currentName === newVal) {
|
||||
state.$iconHolder.innerHTML = iconData;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(`Failed to load icon: ${newVal + "\n"}${error}`); //eslint-disable-line
|
||||
});
|
||||
}
|
||||
}
|
||||
function handleTypeChange(inst, oldVal, newVal) {
|
||||
const state = inst._state;
|
||||
|
||||
state.$iconHolder.textContent = '';
|
||||
if (state.type) {
|
||||
state.type = null;
|
||||
}
|
||||
|
@ -245,7 +227,36 @@ function handleTypeChange(inst, oldVal, newVal) {
|
|||
else{
|
||||
state.type = 'regular';
|
||||
}
|
||||
if(state.currentName!== undefined){
|
||||
inst.constructor.getIconSvg(state.currentName,state.type)
|
||||
.then((iconData) => {
|
||||
if (state.type === newVal) {
|
||||
state.$iconHolder.innerHTML = iconData;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(`Failed to load icon: ${state.currentName + "\n"}${error}`); //eslint-disable-line
|
||||
});}
|
||||
}
|
||||
function handleNameChange(inst, oldVal, newVal) {
|
||||
const state = inst._state;
|
||||
state.currentName = newVal;
|
||||
state.$iconHolder.textContent = '';
|
||||
|
||||
if (newVal) {
|
||||
if(state.type!== undefined){
|
||||
inst.constructor.getIconSvg(newVal,state.type)
|
||||
.then((iconData) => {
|
||||
if (state.currentName === newVal) {
|
||||
state.$iconHolder.innerHTML = iconData;
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(`Failed to load icon: ${newVal + "\n"}${error}`); //eslint-disable-line
|
||||
});}
|
||||
}
|
||||
}
|
||||
|
||||
function handleSizeChange(inst, oldVal, newVal) {
|
||||
const state = inst._state;
|
||||
|
||||
|
|
2
static/dist/0.bundle.js
vendored
2
static/dist/0.bundle.js
vendored
File diff suppressed because one or more lines are too long
BIN
static/dist/0.bundle.js.gz
vendored
BIN
static/dist/0.bundle.js.gz
vendored
Binary file not shown.
2
static/dist/bundle.js
vendored
2
static/dist/bundle.js
vendored
File diff suppressed because one or more lines are too long
BIN
static/dist/bundle.js.gz
vendored
BIN
static/dist/bundle.js.gz
vendored
Binary file not shown.
Loading…
Reference in a new issue