#10 clean.

metastellar-io · Jun 14, 2024 · 8a9773e · 8a9773e
1 parent c2bad60
commit 8a9773e
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 14 deletions.
diff --git a/src/constant.ts → src/constants.ts b/src/constant.ts → src/constants.ts
@@ -5,5 +5,5 @@ export const nftInfo: NFTToken = {
   symbol: "Pirate",
   id: 2163,
   address: "0x1b41d54b3f8de13d58102c50d7431fd6aa1a2c48",
-  standard: "ERC721"
-}
+  standard: "ERC721",
+};
diff --git a/src/lib/nftPoster/nftPoster.svelte b/src/lib/nftPoster/nftPoster.svelte
@@ -7,31 +7,29 @@
 	import type {SizeType} from '$lib/types.js';
   import type {NFTToken, NFTMetadata} from '$lib/types.js';
 	import {sizes} from '$lib/constants.js';
-	import Modal from './nftModal.svelte';
-  import { Card, Button, Rating, Badge } from 'flowbite-svelte';
 
 	let showModal = false;
 
   export let size: SizeType | 'none' = 'sm';
   export let token: NFTToken | undefined = undefined;
   export let nft_metadata: NFTMetadata | undefined = undefined;
-  export let metadata_url: string;
+  export let metadataURL: string;
 
 	interface $$Props extends ComponentProps<Frame> {
     token: NFTToken;
-    metadata_url: string;
+    metadataURL: string;
     padding?: SizeType | 'none';
     size?: SizeType | 'none';
 	}
 
  	let cardClass: string;
   $: cardClass = twMerge('flex w-full', sizes[size], 'flex-col', $$props.class);
 
-  async function getMetadata (metadata_url: string) {
-		if (metadata_url == undefined) return;
+  async function getMetadata (metadataURL: string) {
+		if (metadataURL == undefined) return;
 
 		try {
-			const res = await fetch(metadata_url);
+			const res = await fetch(metadataURL);
       if(res.ok){
         const result =  await res.json();
         nft_metadata = result as NFTMetadata;
@@ -43,17 +41,18 @@
 	};
   
   onMount(() => {
-    getMetadata(metadata_url);
+    getMetadata(metadataURL);
 	});
 
 </script>
 
 <Frame tag="div" {...$$restProps} border shadow class={cardClass} on:click={() => (showModal = true)}>
   {#if nft_metadata?.image_url}
-  <img class="p-8 rounded-t-lg" src={nft_metadata?.image_url} alt="product 1" />
+  <img class="rounded-t-lg p-4" src={nft_metadata?.image_url} alt="product 1" />
   {:else}
   <ImagePlaceholder imgOnly class="mt-12" />
   {/if}
+
   <div class="px-5 pb-5">
   <h5 class="text-xl font-semibold tracking-tight text-gray-900 dark:text-white">{token?.name + " #" + token?.id}</h5>
 </Frame>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
@@ -5,7 +5,7 @@
   import AssetSelector from '$lib/assetSelector/assetSelector.svelte';
   import NftPoster from '$lib/nftPoster/nftPoster.svelte';
 
-  import { nftInfo } from '../constant.js';
+  import { nftInfo } from '../constants.js';
 
   let recordMouseMoveTrack = true;
   let intervalData = 5;
@@ -59,7 +59,7 @@
       <h3  class="mt-5">Image poster component</h3>
     </div>
     <div>
-      <!--- Image post component-->
+      <!--- NFT post component-->
       <NftPoster 
         isMouseTrackRecord={recordMouseMoveTrack} 
         dataURL="http://localhost/api" 
@@ -68,7 +68,7 @@
         bind:isMouseEntered
         isHoverTransform
         token={nftInfo}
-        metadata_url={"https://ipfs.io/ipfs/QmQiBZYdiTEozdn4LiumyACiQ9F7ga9tdu6GZmnqHQaLBh/843.json"}
+        metadataURL={"https://ipfs.io/ipfs/QmQiBZYdiTEozdn4LiumyACiQ9F7ga9tdu6GZmnqHQaLBh/843.json"}
       >
       </NftPoster>
       <h3  class="mt-5">Nft poster component</h3>