Is Glyphicons included correctly?

[fox91]

Glyphicons Halflings is included in CSS directly from external CDN. Is this a good choice? If I'm going to publish website with Leaflet.TimeDimension probably there are no problems, but if I'm testing offline or if I had to serve everything from the intranet it is not a good choice.

To avoid having external dependencies:

• include as external dependency in package.json so everyone can choose to include their own local version or an hosted one
• include in source code like Bootstrap 3 (removed in Bootstrap 4 so I don't recommend)

[murb]

Alternative suggestion, since they're so small: use data urls with base64 encoded images?

[r1m]

Or remove the font-face completely and document that you need to include it or provide a small css file that does. This way if someone want to use another font-icon he can simply include his own and override some CSS. For my project I just don't use the provided CSS and use custom control CSS.

[fox91]

@r1m if you don't include any font-face by default, how is rendered the player? Show strings "Play"/"Pause", etc.?

For me It's ok to remove the font-face and make instructions to render custom player.

[r1m]

Without the font it will render a missing glyph rectangular. This is why I proposed to split the icon font declaration and the control layout in two files. Include both and you have everything; include only layout and you can define your own icons.

For custom icon override the font declaration https://github.com/socib/Leaflet.TimeDimension/blob/51a27873ea89543d0a257efa7cf4a97d005237a9/src/leaflet.timedimension.control.css#L27-L28 and change :before content defined here : https://github.com/socib/Leaflet.TimeDimension/blob/51a27873ea89543d0a257efa7cf4a97d005237a9/src/leaflet.timedimension.control.css#L218-L269

[keul]

Content Security Policies are more and more common these days, and allowing an external CDS just for this is not optimal. Directly using emoji like ⏪, ▶️ or ⏩ is also a cheap (and ugly) solution.