Include fallback icon into the build
@@ -56,7 +56,7 @@
|
|||||||
|
|
||||||
&--golden {
|
&--golden {
|
||||||
.icon__frame {
|
.icon__frame {
|
||||||
background-image: url('../images/icons/large/gold.png');
|
background-image: url('../images/icon-meta/large/gold.png');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -78,7 +78,7 @@
|
|||||||
|
|
||||||
&__frame {
|
&__frame {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
background-image: url('../images/icons/large/default.png');
|
background-image: url('../images/icon-meta/large/default.png');
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-size: contain;
|
background-size: contain;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -18,7 +18,7 @@ export const Icon = React.forwardRef<HTMLDivElement, Props>((props, ref) => {
|
|||||||
const [name, setName] = useState(defaultName)
|
const [name, setName] = useState(defaultName)
|
||||||
|
|
||||||
const bgSize = size !== 'small' ? 'large' : 'medium'
|
const bgSize = size !== 'small' ? 'large' : 'medium'
|
||||||
const url = name && `https://wow.zamimg.com/images/wow/icons/${bgSize}/${name}.jpg`
|
const url = name && iconUrl(name, bgSize)
|
||||||
|
|
||||||
const start = Date.now()
|
const start = Date.now()
|
||||||
|
|
||||||
@@ -51,4 +51,11 @@ export const Icon = React.forwardRef<HTMLDivElement, Props>((props, ref) => {
|
|||||||
{children}
|
{children}
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const iconUrl = (name: string, size: string): string => {
|
||||||
|
if (name === NOT_FOUND_ICON) {
|
||||||
|
return require(`../images/icons/${size}/${name}.jpg`)
|
||||||
|
}
|
||||||
|
return `https://wow.zamimg.com/images/wow/icons/${size}/${name}.jpg`
|
||||||
|
}
|
||||||
@@ -45,7 +45,7 @@
|
|||||||
bottom: -1px;
|
bottom: -1px;
|
||||||
left: -4px;
|
left: -4px;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
background-image: url('../images/icons/large/default.png');
|
background-image: url('../images/icon-meta/large/default.png');
|
||||||
background-size: 100%;
|
background-size: 100%;
|
||||||
|
|
||||||
&:after {
|
&:after {
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 1.9 KiB |
|
Before Width: | Height: | Size: 784 B After Width: | Height: | Size: 784 B |
|
Before Width: | Height: | Size: 789 B After Width: | Height: | Size: 789 B |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 892 B |