I have submitted a pull request that includes a new feature for downloading player card images in SVG format using the html-to-image library. The decision to use SVG format was made to maintain image quality, however, it is also possible to download the images in PNG format (changes on the code), but this may result in a loss of image quality. I apologize for any issues or inconvenience caused by the implementation of this feature. To ensure that the card images would not be cropped when downloaded, I had to take the following steps:
placed the card inside a container
extracted the url
then returned the card back to its original position
By doing this, I was able to download the player card images without any cropping or loss of quality.
This is my first time working with Astro, and I was not entirely familiar with the best practices for adding event listeners. As a result, I used a basic selector by using querySelector and added the listeners that way.
I have submitted a pull request that includes a new feature for downloading player card images in SVG format using the html-to-image library. The decision to use SVG format was made to maintain image quality, however, it is also possible to download the images in PNG format (changes on the code), but this may result in a loss of image quality. I apologize for any issues or inconvenience caused by the implementation of this feature. To ensure that the card images would not be cropped when downloaded, I had to take the following steps:
By doing this, I was able to download the player card images without any cropping or loss of quality.
This is my first time working with Astro, and I was not entirely familiar with the best practices for adding event listeners. As a result, I used a basic selector by using querySelector and added the listeners that way.
When hover on player card:![1](https://user-images.githubusercontent.com/95143152/212556092-aa708176-80c0-4a2a-99c1-7e4025d5c03c.png)
If button is clicked:![2](https://user-images.githubusercontent.com/95143152/212556095-40f389b5-21ea-468b-b1ee-1a2e2380942c.png)
Svg saved:![3](https://user-images.githubusercontent.com/95143152/212556093-de208951-439d-47a3-b352-62a682a706f9.png)