search

ngneat / content-loader

⚪️ SVG component to create placeholder loading, like Facebook cards loading.
https://netbasal.com/
MIT License
735 stars 58 forks source link

Raw content-loader not working #72

Open bjornharvold opened 3 years ago

bjornharvold commented 3 years ago

Upgraded to Angular 11

facebook, list and bullets components work but not raw.

Sample project attached. test-hammer.zip

sachicortes commented 3 years ago

Try setting viewbox property value, for example with value [viewBox]="'0 0 800 100'". You can't see the svg because default value for this property is '0 0 0 0'. The other components works ok because they implement <content-loader> in their templates with the viewBox property setted. @NetanelBasal maybe setting viewBox property to null instead of '0 0 0 0' by default could solve this.

scottpetrovic commented 3 years ago

I just came here looking for the same thing. Adding the viewbox input seems to work. So like this...

 <content-loader [viewBox]="'0 0 800 100'">
     <svg:rect x="0" y="0" rx="3" ry="3" width="100%" height="10" />
      <svg:rect x="20" y="20" rx="3" ry="3" width="80%" height="10" />
      <svg:rect x="20" y="40" rx="3" ry="3" width="70%" height="10" />
      <svg:rect x="0" y="60" rx="3" ry="3" width="100%" height="10" />
      <svg:rect x="20" y="80" rx="3" ry="3" width="80%" height="10" />
      <svg:rect x="20" y="100" rx="3" ry="3" width="70%" height="10" />
 </content-loader>

This @sachicortes

bjornharvold commented 3 years ago

Is this a bug / feature and the docs need updating? Should I resolve this issue?

sachicortes commented 3 years ago

It is a bug/misconfig of the package. As I stated in my answer viewBox default value is 0 0 0 0 and should be null or other value.

NetanelBasal commented 3 years ago

@sachicortes you're welcome to submit a PR.

sachicortes commented 3 years ago

@NetanelBasal will do, thanks for all the packages and info out there btw