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.
|
'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 .
|
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>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<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>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -91,10 +91,10 @@ export class BoxIconElement extends HTMLElement {
|
||||||
|
|
||||||
static get observedAttributes() {
|
static get observedAttributes() {
|
||||||
return [
|
return [
|
||||||
|
'type',
|
||||||
'name',
|
'name',
|
||||||
'color',
|
'color',
|
||||||
'size',
|
'size',
|
||||||
'type',
|
|
||||||
'rotate',
|
'rotate',
|
||||||
'flip',
|
'flip',
|
||||||
'animation',
|
'animation',
|
||||||
|
@ -113,7 +113,6 @@ export class BoxIconElement extends HTMLElement {
|
||||||
*/
|
*/
|
||||||
static getIconSvg(iconName,type) {
|
static getIconSvg(iconName,type) {
|
||||||
var iconUrl = `${this.cdnUrl}/regular/bx-${iconName}.svg`;
|
var iconUrl = `${this.cdnUrl}/regular/bx-${iconName}.svg`;
|
||||||
console.log(type);
|
|
||||||
if(type==='solid'){
|
if(type==='solid'){
|
||||||
iconUrl = `${this.cdnUrl}/solid/bxs-${iconName}.svg`;
|
iconUrl = `${this.cdnUrl}/solid/bxs-${iconName}.svg`;
|
||||||
}
|
}
|
||||||
|
@ -169,6 +168,10 @@ export class BoxIconElement extends HTMLElement {
|
||||||
const $iconHolder = this._state.$iconHolder;
|
const $iconHolder = this._state.$iconHolder;
|
||||||
|
|
||||||
switch (attr) {
|
switch (attr) {
|
||||||
|
|
||||||
|
case 'type':
|
||||||
|
handleTypeChange(this, oldVal, newVal);
|
||||||
|
break;
|
||||||
case 'name':
|
case 'name':
|
||||||
handleNameChange(this, oldVal, newVal);
|
handleNameChange(this, oldVal, newVal);
|
||||||
break;
|
break;
|
||||||
|
@ -178,9 +181,6 @@ export class BoxIconElement extends HTMLElement {
|
||||||
case 'size':
|
case 'size':
|
||||||
handleSizeChange(this, oldVal, newVal);
|
handleSizeChange(this, oldVal, newVal);
|
||||||
break;
|
break;
|
||||||
case 'type':
|
|
||||||
handleTypeChange(this, oldVal, newVal);
|
|
||||||
break;
|
|
||||||
case 'rotate':
|
case 'rotate':
|
||||||
if (oldVal) {
|
if (oldVal) {
|
||||||
$iconHolder.classList.remove(`${CSS_CLASS_PREFIX_ROTATE}${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) {
|
function handleTypeChange(inst, oldVal, newVal) {
|
||||||
const state = inst._state;
|
const state = inst._state;
|
||||||
|
state.$iconHolder.textContent = '';
|
||||||
if (state.type) {
|
if (state.type) {
|
||||||
state.type = null;
|
state.type = null;
|
||||||
}
|
}
|
||||||
|
@ -245,7 +227,36 @@ function handleTypeChange(inst, oldVal, newVal) {
|
||||||
else{
|
else{
|
||||||
state.type = 'regular';
|
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) {
|
function handleSizeChange(inst, oldVal, newVal) {
|
||||||
const state = inst._state;
|
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