Twinory/undefined
0
1<!DOCTYPE html>2<html lang="en">3<head>4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-scale=1.0">6 <title>Compliance Document Check | Twinory</title>7 <script src="https://cdn.tailwindcss.com"></script>8 <link rel="preconnect" href="https://fonts.googleapis.com">9 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>10 <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Montserrat:wght@700;800&display=swap" rel="stylesheet">11 <style>12 body {13 font-family: 'Poppins', sans-serif;14 color: #FFFFFF;15 position: relative;16 min-height: 100vh;17 background-color: #0D0D0D;18 }19 body::before {20 content: "";21 position: fixed;22 top: 0;23 left: 0;24 right: 0;25 bottom: 0;26 background-image: url('http://static.photos/document/1200x630/1');27 background-size: cover;28 background-position: center;29 opacity: 0.2;30 z-index: -1;31 }32 h1, h2, h3 {33 font-family: 'Montserrat', sans-serif;34 }35 .content-box {36 background-color: rgba(13, 13, 13, 0.85);37 border: 1px solid #333333;38 }39 </style>40</head>41<body>42 <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20">43 <div class="content-box rounded-xl p-8 lg:p-12 shadow-2xl">44 <div class="text-center mb-12">45 <img src="https://huggingface.co/spaces/Twinory/undefined/resolve/main/images/TWINORY%20Logo%20-%20Edited.png" alt="Twinory Logo" class="h-16 mx-auto">46 <p class="text-gray-300 mt-2">Just list it, with perfection!</p>47 </div>48 49 <h1 class="text-4xl md:text-5xl font-bold text-center mb-8">Compliance Document Check</h1>50 51 <div class="grid grid-cols-1 md:grid-cols-2 gap-8">52 <div>53 <h2 class="text-2xl font-bold mb-4">Upload Your Documents</h2>54 <div class="border-2 border-dashed border-gray-700 rounded-lg p-8 text-center">55 <i data-feather="upload" class="w-12 h-12 text-[#FF9900] mx-auto mb-4"></i>56 <p class="text-gray-400 mb-4">Drag & drop your compliance documents here</p>57 <button class="bg-[#FF9900] text-black px-6 py-2 rounded-md font-medium hover:bg-orange-600 transition duration-300">58 Browse Files59 </button>60 </div>61 </div>62 63 <div>64 <h2 class="text-2xl font-bold mb-4">Verification Checklist</h2>65 <div class="space-y-4">66 <div class="flex items-start">67 <i data-feather="check-circle" class="text-green-500 w-5 h-5 mt-1 mr-3"></i>68 <div>69 <h3 class="font-bold">Business License</h3>70 <p class="text-gray-400 text-sm">Valid and up-to-date business license document</p>71 </div>72 </div>73 <div class="flex items-start">74 <i data-feather="check-circle" class="text-green-500 w-5 h-5 mt-1 mr-3"></i>75 <div>76 <h3 class="font-bold">Product Certifications</h3>77 <p class="text-gray-400 text-sm">Relevant safety and quality certifications</p>78 </div>79 </div>80 <div class="flex items-start">81 <i data-feather="check-circle" class="text-green-500 w-5 h-5 mt-1 mr-3"></i>82 <div>83 <h3 class="font-bold">Trademark Documentation</h3>84 <p class="text-gray-400 text-sm">Registered trademark proof if applicable</p>85 </div>86 </div>87 <div class="flex items-start">88 <i data-feather="check-circle" class="text-green-500 w-5 h-5 mt-1 mr-3"></i>89 <div>90 <h3 class="font-bold">FDA/CE Compliance</h3>91 <p class="text-gray-400 text-sm">For regulated product categories</p>92 </div>93 </div>94 </div>95 </div>96 </div>97 98 <div class="mt-12 bg-gray-900 rounded-xl p-6">99 <h3 class="text-xl font-bold mb-4">Compliance Status</h3>100 <div class="flex items-center">101 <div class="w-full bg-gray-800 rounded-full h-4">102 <div class="bg-[#FF9900] h-4 rounded-full" style="width: 0%"></div>103 </div>104 <span class="ml-4 text-gray-300">0% Complete</span>105 </div>106 <p class="text-gray-400 mt-4">Upload documents to begin verification process</p>107 </div>108 </div>109 </div>110 111 <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>112 <script>113 feather.replace();114 </script>115</body>116</html>