On Tue, May 11, 2021 at 5:59 PM Larry Martell <larry.mart...@gmail.com> wrote:
>
> On Tue, May 11, 2021 at 5:41 PM Philippe Wittenbergh <ph...@l-c-n.com> wrote:
> >
> >
> >
> > > On May 12, 2021, at 9:21, Larry Martell <larry.mart...@gmail.com> wrote:
> > >
> > > .observations li::before {
> > >         background-image:url("data:image/svg+xml;utf8,<svg
> > > xmlns='http://www.w3.org/2000/svg' stroke='null' fill='#1aaf54' <path
> > > d='m0.20231,4.976169c0,-2.655359 2.138654,-4.804042
> > > 4.78162,-4.804042c2.641807,0 4.78162,2.148683
> > > 4.78162,4.804042s-2.139812,4.804042 -4.78162,4.804042c-2.642947,0
> > > -4.78162,-2.148683 -4.78162,-4.804042z' /> </svg>");
> > > }
> >
> > The opening `<svg` is missing the closing angled bracket `>`
> >
> > <svg xmlns='http://www.w3.org/2000/svg' fill='#1aaf54'> <path 
> > d='m0.20231,4.976169c0,-2.655359 2.138654,-4.804042 
> > 4.78162,-4.804042c2.641807,0 4.78162,2.148683 
> > 4.78162,4.804042s-2.139812,4.804042 -4.78162,4.804042c-2.642947,0 
> > -4.78162,-2.148683 -4.78162,-4.804042z' /></svg>
> >
> >
> > For maximum compatibility, you are better url encode parts for use in data 
> > URI
> > * make sure you use single quotation marks inside the SVG (you are doing 
> > that already
> > * replace all instances of:
> > < with %3C
> > > with %3E
> > # with %23
> > & with %26
> > { with %7B
> > } with %7D
> > % with %25
> >
> > (a little bit less readable, but still easy to edit. base64 is bloat.)
>
> Thanks for the reply. Added the closing >, but still no circles are 
> displaying.

I got this working. This is a django app, and here is the template that works:

                    <ul style="padding-left: 20px; list-style-type:none;">
                        {% for y in x.10 %}
                            <li style="line-height: 1.25;">
                                <svg
xmlns="http://www.w3.org/2000/svg"; fill="{{COLORS|get_color:y.1}}"
style="width: 30px; height: 10px;">
                                    <path
d='m0.20231,4.976169c0,-2.655359 2.138654,-4.804042
4.78162,-4.804042c2.641807,0 4.78162,2.148683
4.78162,4.804042s-2.139812,4.804042 -4.78162,4.804042c-2.642947,0
-4.78162,-2.148683 -4.78162,-4.804042z' />
                                </svg>
                                <span style="color: black;">{{y.0}}</span>
                            </li>
                        {% endfor %}
                    </ul>
______________________________________________________________________
css-discuss [css-d@css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to