update

ArkCard-web/collect.html

@@ -10,6 +10,7 @@
     <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
     <title>ARK.Cards</title>
 
+    
     <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"
         integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
@@ -26,320 +27,324 @@
                 class="card-title py-3  px-5 text-center mb-0 fw-bold">我的收藏</h5>
         </div>
     </section>
-    <section id="sec05-moblie" class="sec05 my-4">
-        <div class="sec05-moblie container-fluid">
-            <div class="sec05-moblie-header">
-                <h1 class="secn-title ps-2">NFT收藏品</h1>
-            </div>
-            <div class="sec05-moblie-container row row-cols-1 row-cols-md-4 g-4">
-                <!-- <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="">
-                            <img src="./img/sec05/sec05-1.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body p-2">
+    <form class="collect-send" action="">
+        <section id="sec05-moblie" class="sec05 my-4">
+            <div class="sec05-moblie container-fluid">
+                <div class="sec05-moblie-header">
+                    <h1 class="secn-title ps-2">NFT收藏品</h1>
+                </div>
+                <div class="sec05-moblie-container row row-cols-1 row-cols-md-4 g-4">
+                    <!-- <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/sec05-1.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body p-2">
+                                <a target="_blank" href="">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
-                </div>
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="">
-                            <img src="./img/sec05/sec05-2.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body p-2">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/sec05-2.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body p-2">
+                                <a target="_blank" href="">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
-                </div>
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="./artist-course.html">
-                            <img src="./img/sec05/sec05-3.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body p-2">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="./artist-course.html">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/sec05-3.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body p-2">
+                                <a target="_blank" href="./artist-course.html">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
-                </div>
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="./artist-course.html">
-                            <img src="./img/sec05/sec05-4.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body p-2">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="./artist-course.html">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/sec05-4.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body p-2">
+                                <a target="_blank" href="./artist-course.html">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
-                    </div>
-                </div> -->
-            </div>
-        </div>
-        <!-- <div class="sec05-moblie container-fluid">
-            <div class="sec05-moblie-header">
-                <h1 class="secn-title ps-2">運動</h1>
+                    </div> -->
+                </div>
             </div>
-            <div class="sec05-moblie-container row row-cols-1 row-cols-md-4 g-4">
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="./artist-course.html">
-                            <img src="./img/sec05/5.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body">
+            <!-- <div class="sec05-moblie container-fluid">
+                <div class="sec05-moblie-header">
+                    <h1 class="secn-title ps-2">運動</h1>
+                </div>
+                <div class="sec05-moblie-container row row-cols-1 row-cols-md-4 g-4">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="./artist-course.html">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/5.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body">
+                                <a target="_blank" href="./artist-course.html">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
-                </div>
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="./artist-course.html">
-                            <img src="./img/sec05/6.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="./artist-course.html">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/6.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body">
+                                <a target="_blank" href="./artist-course.html">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
-                </div>
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="./artist-course.html">
-                            <img src="./img/sec05/7.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="./artist-course.html">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/7.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body">
+                                <a target="_blank" href="./artist-course.html">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
-                </div>
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="./artist-course.html">
-                            <img src="./img/sec05/8.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="./artist-course.html">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/8.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body">
+                                <a target="_blank" href="./artist-course.html">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
                 </div>
+    
+    
             </div>
-
-
-        </div>
-        <div class="sec05-moblie container-fluid">
-            <div class="sec05-moblie-header">
-                <h1 class="secn-title ps-2">藝術</h1>
-            </div>
-            <div class="sec05-moblie-container row row-cols-1 row-cols-md-4 g-4">
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="./artist-course.html">
-                            <img src="./img/sec05/9.png" class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body">
+            <div class="sec05-moblie container-fluid">
+                <div class="sec05-moblie-header">
+                    <h1 class="secn-title ps-2">藝術</h1>
+                </div>
+                <div class="sec05-moblie-container row row-cols-1 row-cols-md-4 g-4">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="./artist-course.html">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/9.png" class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body">
+                                <a target="_blank" href="./artist-course.html">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
-                </div>
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="./artist-course.html">
-                            <img src="./img/sec05/10.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="./artist-course.html">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/10.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body">
+                                <a target="_blank" href="./artist-course.html">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
-                </div>
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="./artist-course.html">
-                            <img src="./img/sec05/11.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="./artist-course.html">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/11.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body">
+                                <a target="_blank" href="./artist-course.html">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
-                </div>
-                <div class="col">
-                    <div class="card h-100">
-                        <a target="_blank" href="./artist-course.html">
-                            <img src="./img/sec05/12.png"class="card-img-top" alt="...">
-                        </a>
-                        <div class="card-body">
+                    <div class="col">
+                        <div class="card h-100">
                             <a target="_blank" href="./artist-course.html">
-                                <h5 class="card-title">Lorem ipsum.</h5>
+                                <img src="./img/sec05/12.png"class="card-img-top" alt="...">
                             </a>
-                            <p class="card-text">
-                                Lorem ipsum dolor sit amet, 
-                            </p>
-                            <p class="card-text row">
-                                <small class="text-muted col-6 px-1">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
-                                        src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
-                                </small>
-                                <small class="price col-6 px-0 text-center">
-                                    <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                            <div class="card-body">
+                                <a target="_blank" href="./artist-course.html">
+                                    <h5 class="card-title">Lorem ipsum.</h5>
+                                </a>
+                                <p class="card-text">
+                                    Lorem ipsum dolor sit amet, 
                                 </p>
+                                <p class="card-text row">
+                                    <small class="text-muted col-6 px-1">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 10px; object-fit: cover; "
+                                            src="./img/sec05/Icon awesome-ethereum.png" alt=""><span>333</span>
+                                    </small>
+                                    <small class="price col-6 px-0 text-center">
+                                        <img class="mb-1 mx-1 d-inline" style="width: 12px; object-fit: cover; " src="./img/sec05/like.png" alt=""><span>333</span></small>
+                                    </p>
+                            </div>
                         </div>
                     </div>
                 </div>
-            </div>
-
-
-        </div> -->
-    </section>
-    <div style="background: #484848;position: fixed; bottom:0px; z-index: 20;" class="sendbox w-100 pt-2">
-        <div class="p-2">
-            <input style="border-radius: 10px; border:none;" class="p-2 w-100 mb-3" type="text" placeholder="請輸入您要發送的地址">
-            <div class="text-end px-2">
-                <p class="text-start text-white mb-2">※一次只能發送一則NFT收藏品</p>
-                <button type="button" style="border:1px solid #fff; border-radius: 30px;"
-                    class="btn text-white px-3">取消</button>
-                <button type="button" style="border-radius: 30px; background:#fff;" class="btn ms-2">確定發送</button>
+    
+    
+            </div> -->
+        </section>
+        <div style="background: #484848;position: fixed; bottom:0px; z-index: 20;" class="sendbox w-100 pt-2">
+            <div class="p-2">
+                <input style="border-radius: 10px; border:none;" class="p-2 w-100 mb-3" type="text" name="address" placeholder="請輸入您要發送的地址">
+                <div class="text-end px-2">
+                    <p class="text-start text-white mb-2">※一次只能發送一則NFT收藏品</p>
+                    <button type="button" style="border:1px solid #fff; border-radius: 30px;" class="close btn text-white px-3">取消</button>
+                    <input style="border-radius: 30px; background:#fff; border: none;" class="send-btn p-2 ms-1" type="submit" value="確定發送">
+                    <!-- <button sty type="button" style="border-radius: 30px; background:#fff;" class="btn ms-2">確定發送</button> -->
+                </div>
             </div>
         </div>
-    </div>
+    </form>
+  
+
     <footer style="background: #484848;" class="py-4 w-100 px-0 mx-0">
         <p class="text-white text-center mb-0">Copyright 2021 版權所有 © Ark.Cards</p>
     </footer>

ArkCard-web/goto.js

@@ -8,10 +8,16 @@
 
 $(".sendbox").hide();
 $(document).on("click", ".collectcard", function (event) {
-  $(".sendbox").toggle(500);
+  // $(this).siblings('.collectcard').removeClass('select'); 
+  $(".sendbox").show(500);
   $(this).toggleClass("select");
 });
 
+$(document).on("click", ".close", function (event) {
+  // $(this).siblings('.collectcard').removeClass('select'); 
+  $(".sendbox").hide(500);
+  $(".collectcard").removeClass("select");
+});
 
 // 收藏頁面
 $(document).ready(function () {
@@ -35,7 +41,7 @@ $(document).ready(function () {
         for(var i = 0; i < msgLen; i++){
         collectcontent+='\
           <div class="collectcontent col">\
-          <input style="display: none;" type="checkbox" value="'+msg[i].id+'" name="card1" id="'+msg[i].id+'">\
+          <input style="display: none;" type="checkbox" value="'+msg[i].id+'" name="nftid" id="'+msg[i].id+'">\
           <label for="'+msg[i].id+'">\
           <div class="collectcard card h-100">\
               <a target="_blank">\
@@ -67,7 +73,56 @@ $(document).ready(function () {
       });
   
 });
+$.fn.serializeObject = function () {
+  var o = {};
+  var a = this.serializeArray();
+  // o["id"] = 0;
+  // o["time_stamp"] = "";
+  $.each(a, function () {
+    if (o[this.name]) {
+      if (!o[this.name].push) {
+        o[this.name] = [o[this.name]];
+      }
+      o[this.name].push(this.value || '');
+    } else {
+      o[this.name] = this.value || '';
+    }
+  });
+
+  return o;
+};
+
+$(".collect-send").submit(function (e) {
+  /*	var formRef = $('#form1').serializeArray();
+    var jsonString = JSON.stringify(formRef);*/
+  var jsonInfo = $('.collect-send').serializeObject();
+  var jsonString = JSON.stringify(jsonInfo);
+  console.log(jsonString),
 
+    $.ajax({
+      type: 'POST',
+      url: 'https://api.ptt.cx:8228/send',
+      data: jsonString,
+      dataType: 'json',
+      success: function (data) {
+        console.log('送出成功: ' + data);
+        alert("送出成功");
+        // location.reload();
+      },
+      beforeSend: function () {
+        console.log('beforeSend');
+      },
+      complete: function () {
+        console.log('complete');
+      },
+      error: function (jqXHR, textStatus, errorThrown) {
+        console.log(JSON.stringify(jqXHR));
+        console.log("AJAX errr: " + textStatus + ' : ' + errorThrown);
+        console.log('送出失敗: ' + jqXHR.responseText);
+      }
+    });
+  return false;
+});
 console.log(1);
 
 // $(document).ready(function () {
@@ -97,6 +152,7 @@ $(document).ready(function () {
     $.ajax({
       method: "GET",
       url: "https://api.ptt.cx:8228/receive/" + userid + "",
+      // url:"https://api.ptt.cx:8228/receive/Uf161c92b16f84357987a78c2b4b47719",
       dataType: "json",
     })
       .done(function (msg) {
@@ -105,7 +161,7 @@ $(document).ready(function () {
         var Qrcodeimg = '';
         var useraddress = '';
         Qrcodeimg += '\
-      <img src="data:image/png;base64,'+ msg.base + '" alt="">\
+      <img src="'+ msg.url + '" alt="">\
       ';
         useraddress += '\
       '+ msg.useraddress + '\