Filck18/codesizer-pro
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>My Projects | CodeSizer Pro</title>7 <link rel="icon" type="image/x-icon" href="/static/favicon.ico">8 <script src="https://cdn.tailwindcss.com"></script>9 <script src="https://unpkg.com/feather-icons"></script>10 <style>11 .gradient-text {12 background: linear-gradient(90deg, #3b82f6, #8b5cf6);13 -webkit-background-clip: text;14 background-clip: text;15 color: transparent;16 }17 .project-row:hover {18 background-color: rgba(255, 255, 255, 0.05);19 }20 </style>21</head>22<body class="bg-gray-900 text-white min-h-screen">23 <div class="relative z-10 min-h-screen flex flex-col">24 <!-- Header -->25 <header class="py-6 px-4 sm:px-6 lg:px-8">26 <div class="flex justify-between items-center">27 <div class="flex items-center space-x-2">28 <i data-feather="code" class="text-blue-400" width="28" height="28"></i>29 <h1 class="text-2xl font-bold tracking-tighter">30 <a href="/" class="gradient-text">CodeSizer Pro</a>31 </h1>32 </div>33 <nav class="hidden md:flex space-x-8">34 <a href="/features.html" class="hover:text-blue-400 transition">Features</a>35 <a href="#" class="hover:text-blue-400 transition">Pricing</a>36 <a href="#" class="hover:text-blue-400 transition">Docs</a>37 <a href="/newproject.html" class="hover:text-blue-400 transition">New Project</a>38 </nav>39 <div class="flex items-center space-x-4">40 <a href="/login.html" class="px-4 py-2 rounded-md hover:bg-gray-800 transition">Login</a>41 <a href="/register.html" class="px-4 py-2 bg-blue-600 hover:bg-blue-700 rounded-md transition">Register</a>42 </div>43 </div>44 </header>45 46 <!-- Main Content -->47 <main class="flex-grow py-8 px-4 sm:px-6 lg:px-8">48 <div class="max-w-6xl mx-auto">49 <div class="flex justify-between items-center mb-8">50 <h1 class="text-3xl font-bold">My Projects</h1>51 <a href="/newproject.html" class="px-6 py-2 bg-blue-600 hover:bg-blue-700 rounded-md font-medium transition flex items-center">52 <i data-feather="plus" class="mr-2"></i> New Project53 </a>54 </div>55 56 <!-- Projects Table -->57 <div class="bg-gray-800 rounded-xl overflow-hidden">58 <!-- Table Header -->59 <div class="grid grid-cols-12 gap-4 px-6 py-4 bg-gray-700 font-medium">60 <div class="col-span-4">Name</div>61 <div class="col-span-6">Description</div>62 <div class="col-span-2 text-right">Actions</div>63 </div>64 65 <!-- Project Rows -->66 <div class="divide-y divide-gray-700">67 <!-- Project 1 -->68 <div class="grid grid-cols-12 gap-4 px-6 py-4 items-center project-row transition">69 <div class="col-span-4 font-medium">E-Commerce Platform</div>70 <div class="col-span-6 text-gray-300">Online store with product catalog, cart and checkout</div>71 <div class="col-span-2 flex justify-end items-center space-x-4">72 <div class="flex space-x-2">73 <i data-feather="cpu" class="text-blue-400" title="Use Case Points"></i>74 <i data-feather="box" class="text-gray-500" title="COCOMO"></i>75 <i data-feather="layers" class="text-gray-500" title="Functional Points"></i>76 </div>77 <a href="/project-detail.html?name=E-Commerce Platform" class="px-3 py-1 bg-gray-700 hover:bg-gray-600 rounded text-sm transition">78View79 </a>80 </div>81 </div>82 83 <!-- Project 2 -->84 <div class="grid grid-cols-12 gap-4 px-6 py-4 items-center project-row transition">85 <div class="col-span-4 font-medium">Mobile Banking App</div>86 <div class="col-span-6 text-gray-300">Financial application for iOS and Android</div>87 <div class="col-span-2 flex justify-end items-center space-x-4">88 <div class="flex space-x-2">89 <i data-feather="cpu" class="text-blue-400" title="Use Case Points"></i>90 <i data-feather="box" class="text-green-400" title="COCOMO"></i>91 <i data-feather="layers" class="text-gray-500" title="Functional Points"></i>92 </div>93 <a href="/project-detail.html?name=Mobile Banking App" class="px-3 py-1 bg-gray-700 hover:bg-gray-600 rounded text-sm transition">94View95 </a>96 </div>97 </div>98 99 <!-- Project 3 -->100 <div class="grid grid-cols-12 gap-4 px-6 py-4 items-center project-row transition">101 <div class="col-span-4 font-medium">Inventory Management</div>102 <div class="col-span-6 text-gray-300">Warehouse stock tracking system</div>103 <div class="col-span-2 flex justify-end items-center space-x-4">104 <div class="flex space-x-2">105 <i data-feather="cpu" class="text-gray-500" title="Use Case Points"></i>106 <i data-feather="box" class="text-gray-500" title="COCOMO"></i>107 <i data-feather="layers" class="text-purple-400" title="Functional Points"></i>108 </div>109 <a href="/project-detail.html?name=Inventory Management" class="px-3 py-1 bg-gray-700 hover:bg-gray-600 rounded text-sm transition">110View111 </a>112 </div>113 </div>114 115 <!-- Project 4 -->116 <div class="grid grid-cols-12 gap-4 px-6 py-4 items-center project-row transition">117 <div class="col-span-4 font-medium">CRM System</div>118 <div class="col-span-6 text-gray-300">Customer relationship management platform</div>119 <div class="col-span-2 flex justify-end items-center space-x-4">120 <div class="flex space-x-2">121 <i data-feather="cpu" class="text-blue-400" title="Use Case Points"></i>122 <i data-feather="box" class="text-green-400" title="COCOMO"></i>123 <i data-feather="layers" class="text-purple-400" title="Functional Points"></i>124 </div>125 <a href="/project-detail.html?name=CRM System" class="px-3 py-1 bg-gray-700 hover:bg-gray-600 rounded text-sm transition">126View127 </a>128 </div>129 </div>130 </div>131 </div>132 </div>133 </main>134 135 <!-- Footer -->136 <footer class="py-8 px-4 sm:px-6 lg:px-8 border-t border-gray-800 mt-auto">137 <div class="max-w-6xl mx-auto flex flex-col md:flex-row justify-between items-center">138 <div class="flex items-center space-x-2 mb-4 md:mb-0">139 <i data-feather="code" class="text-blue-400"></i>140 <span class="font-medium">CodeSizer Pro</span>141 </div>142 <div class="flex space-x-6">143 <a href="#" class="text-gray-400 hover:text-white transition">144 <i data-feather="twitter"></i>145 </a>146 <a href="#" class="text-gray-400 hover:text-white transition">147 <i data-feather="github"></i>148 </a>149 <a href="#" class="text-gray-400 hover:text-white transition">150 <i data-feather="linkedin"></i>151 </a>152 </div>153 </div>154 </footer>155 </div>156 157 <script>158 document.addEventListener('DOMContentLoaded', () => {159 feather.replace();160 });161 </script>162</body>163</html>