Improve skin asset preview (#2)

- Make the skin png preview properly pixelated instead of blurry (85ff90d668f574485fef470768a4d750d15183cd)
- Add a checkered background to make transparency obvious (b4dc6284f74c101d5afc53aa0e5df54af2ffdf26)


Co-authored-by: Vitalii <not-holar@users.noreply.huggingface.co>

app.py

@@ -66,9 +66,10 @@ gr.Interface(
         verbose
     ],
     outputs=[
-        gr.Image(label="Generated Minecraft Skin Image Asset"),
+        gr.Image(label="Generated Minecraft Skin Image Asset", elem_classes="pixelated checkered"),
         gr.Model3D(clear_color=[0.0, 0.0, 0.0, 0.0],  label="3D Model View of the Skin")
     ],
     title="Minecraft Skin Generator",
     description="Make AI generated Minecraft Skins by a Finetuned Stable Diffusion Version!<br>Model used: https://github.com/Nick088Official/Stable_Diffusion_Finetuned_Minecraft_Skin_Generator<br>Credits: [Monadical-SAS](https://github.com/Monadical-SAS/minecraft_skin_generator) (Creators of the model), [Nick088](https://linktr.ee/Nick088) (Improving usage of the model), daroche (helping me fix the 3d model texture isue), [Brottweiler](https://gist.github.com/Brottweiler/483d0856c6692ef70cf90bf1a85ce364)(script to fix the 3d model texture, [meew](https://huggingface.co/spaces/meeww/Minecraft_Skin_Generator/blob/main/models/player_model.glb) (Minecraft Player 3d model)",
+    css=".pixelated {image-rendering: pixelated} .checkered img {background-image: url(\'data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"2\" height=\"2\" fill-opacity=\".15\"><rect x=\"1\" width=\"1\" height=\"1\"/><rect y=\"1\" width=\"1\" height=\"1\"/></svg>\');background-size: 16px;}"
 ).launch(show_api=False, share=True)