68 questions
2
votes
1
answer
218
views
Problem with hydration nuxt app. @nuxtjs/svg-sprite
I have an issue with fixing nuxtjs hydration mismatch
rendered on server: href="/_nuxt/tabbar.DZ-rw7fi.svg#balance"
expected on client: href="http://stels-and-co-frontend-nuxt3.mt125.mt-...
- 465
1
vote
0
answers
27
views
SVG sprite in CSS [duplicate]
I can't use the SVG using SVG sprite
here's the css,
strong {
font-weight: inherit;
position: relative;
&::after {
content: "";
position: absolute;
...
- 21
0
votes
1
answer
253
views
How to skip svg sprites cache for web development
my icon.svg sprite file look like this
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" style="display:none">
<symbol fill="...
- 137
0
votes
1
answer
1k
views
How to Color Specific Parts of SVG Image using Flutter and flutter_svg?
I am developing a Flutter application where I need to display a human body silhouette with muscles, and I want users to dynamically color specific muscles based on their input. I am using the ...
1
vote
0
answers
77
views
Stenciljs assets not accessible in reactjs application
Current Behavior
Hi,
In stenciljs i am building a design system where i have huge amount of icons so i have created a svg sprite file.
Steps to Reproduce
Method1 :
Tried importing the svg sprite file ...
0
votes
0
answers
72
views
How to use defs+linearGradient with <use>?
I have an SVG spritemap.
I want to configure it to display correctly.
For some reason, the code
<path
d="..."
fill="url(#paint0_linear_0_23023)"
</path>
Doesn't ...
- 475
0
votes
0
answers
135
views
svg sprite in flutter
I have a svg sprite which I get from the internet, it has various icons in it, how can I get a specific icon from this sprite?
I tried using the flutter_svg and jovial_svg libraries. What should I do, ...
3
votes
3
answers
532
views
How can I use an SVG sprite in an npm package?
My team is working on a React component library and we are using an SVG sprite for our icons. We have an <Icon> component that looks like this:
import Sprite from './sprite.svg';
const Icon = ({...
- 3,227
2
votes
0
answers
192
views
ElectronJS rerequests an SVG sprite every time it's used, doesn't cache
I have a Vite/React app that uses @tabler/icons for icons in the app, as well as letting the user choose icons for their own notes, so I need to be able to load them dynamically (instead of using the ...
- 51
1
vote
4
answers
941
views
Use SVG sprite as mouse cursor
I have an SVG sprite:
<svg xmlns="http://www.w3.org/2000/svg" style="display:none;">
<symbol id="ailMouseIco" viewBox="0 0 51.2 76.5">
...
- 43
0
votes
0
answers
28
views
How to replace the value of the fill attribute in the svg image code with any other custom value in the gulp-svg-sprite plugin [duplicate]
For example i want replace fill attribute fill="#87B0EE" in svg image code that way that i can have access to it and can change it states via css variables. Like this: fill="var(--color,...
- 25
4
votes
3
answers
2k
views
Mask tag in svg is ignored if used from an external svg-sprite file
I'm trying to use an svg sprite in my project, and it works fine, unless you're using a mask tag in a sprite:
public/sprite.svg:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="...
- 53
7
votes
2
answers
8k
views
Any way to use SVG Sprite from CSS?
HTML:
<svg>
<use xlink:href="/assets/images/icons-sprite.svg#icon-name"></use>
</svg>
SVG sprite:
<svg width="0" height="0" class="...
- 77
5
votes
2
answers
4k
views
Getting "Unsafe attempt to load URL data:image/svg+xml..." in Safari using a through React component
I'm using rollup to bundle a react npm package that contains an icon component that takes a name as a prop and returns an Icon with that name wrapped by a react component.
This is the component code:
...
- 518
0
votes
1
answer
366
views
SVG gradients not getting rendered when using it from external SVG-sprite file
The gradients only functions properly when I include the svg sprite as code in the same file which defeats the purpose of having an svg sprite in the first place. I read from a different post from 3 ...
