Project Timeline\/Gantt Chart - AiPro Institute\u2122<\/title>\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: linear-gradient(135deg, #f5f3ff 0%, #e0f2fe 100%);\n padding: 20px;\n min-height: 100vh;\n }\n\n .container {\n max-width: 1400px;\n margin: 0 auto;\n background: white;\n padding: 50px;\n box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);\n border-radius: 10px;\n position: relative;\n }\n\n .watermark {\n position: fixed;\n bottom: 20px;\n right: 20px;\n font-size: 80px;\n font-weight: bold;\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n opacity: 0.1;\n z-index: 0;\n pointer-events: none;\n line-height: 1.2;\n }\n\n .header {\n text-align: center;\n margin-bottom: 40px;\n border-bottom: 4px solid;\n border-image: linear-gradient(90deg, #8B5CF6 0%, #3B82F6 100%) 1;\n padding-bottom: 30px;\n }\n\n .logo {\n font-size: 42px;\n font-weight: bold;\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n margin-bottom: 10px;\n line-height: 1.3;\n }\n\n .document-title {\n font-size: 32px;\n color: #1e293b;\n margin-top: 15px;\n font-weight: 600;\n }\n\n .info-section {\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 20px;\n margin-bottom: 35px;\n padding: 25px;\n background: linear-gradient(135deg, #f8f7ff 0%, #f0f9ff 100%);\n border-radius: 8px;\n }\n\n .info-item {\n display: flex;\n flex-direction: column;\n }\n\n .info-label {\n font-size: 12px;\n color: #64748b;\n margin-bottom: 5px;\n text-transform: uppercase;\n font-weight: 600;\n letter-spacing: 0.5px;\n }\n\n .info-input {\n padding: 10px;\n border: 2px dashed #cbd5e1;\n border-radius: 5px;\n font-size: 14px;\n background: white;\n transition: all 0.3s;\n }\n\n .info-input:focus {\n outline: none;\n border-color: #8B5CF6;\n background: #faf9ff;\n }\n\n .section-title {\n font-size: 20px;\n color: #1e293b;\n margin: 35px 0 20px 0;\n padding: 12px 20px;\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n color: white;\n border-radius: 6px;\n font-weight: 600;\n }\n\n .gantt-container {\n overflow-x: auto;\n margin: 25px 0;\n border: 2px solid #e2e8f0;\n border-radius: 8px;\n }\n\n .gantt-table {\n width: 100%;\n min-width: 1200px;\n border-collapse: collapse;\n font-size: 13px;\n }\n\n .gantt-table th {\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n color: white;\n padding: 12px 8px;\n text-align: left;\n font-weight: 600;\n font-size: 11px;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n position: sticky;\n top: 0;\n z-index: 10;\n }\n\n .gantt-table td {\n padding: 10px 8px;\n border: 1px solid #e2e8f0;\n }\n\n .gantt-table tr:nth-child(even) {\n background-color: #f8fafc;\n }\n\n .gantt-chart-area {\n position: relative;\n min-height: 40px;\n background: linear-gradient(90deg, #f8fafc 0%, #f1f5f9 100%);\n }\n\n .gantt-bar {\n position: absolute;\n height: 30px;\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n border-radius: 4px;\n top: 5px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: white;\n font-size: 11px;\n font-weight: 600;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n }\n\n .milestone-marker {\n position: absolute;\n width: 20px;\n height: 20px;\n background: #f59e0b;\n border-radius: 50%;\n top: 10px;\n border: 3px solid white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n }\n\n input[type=\"text\"],\n input[type=\"date\"],\n select,\n textarea {\n width: 100%;\n padding: 8px;\n border: 2px dashed #cbd5e1;\n border-radius: 4px;\n font-size: 12px;\n font-family: inherit;\n transition: all 0.3s;\n }\n\n input:focus,\n select:focus,\n textarea:focus {\n outline: none;\n border-color: #8B5CF6;\n background: #faf9ff;\n }\n\n .legend {\n display: flex;\n gap: 25px;\n justify-content: center;\n margin: 25px 0;\n padding: 20px;\n background: #f8fafc;\n border-radius: 8px;\n }\n\n .legend-item {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 13px;\n }\n\n .legend-box {\n width: 30px;\n height: 20px;\n border-radius: 4px;\n }\n\n .legend-circle {\n width: 20px;\n height: 20px;\n border-radius: 50%;\n border: 3px solid white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n }\n\n table {\n width: 100%;\n border-collapse: collapse;\n margin: 20px 0;\n }\n\n th {\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n color: white;\n padding: 12px;\n text-align: left;\n font-weight: 600;\n font-size: 12px;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n\n td {\n padding: 10px 12px;\n border: 1px solid #e2e8f0;\n font-size: 13px;\n }\n\n tr:nth-child(even) {\n background-color: #f8fafc;\n }\n\n .notes-section {\n background: #fffbeb;\n border-left: 4px solid #f59e0b;\n padding: 20px;\n margin: 25px 0;\n border-radius: 5px;\n }\n\n @media print {\n body {\n background: white;\n padding: 0;\n }\n\n .container {\n box-shadow: none;\n padding: 20px;\n }\n\n .watermark {\n opacity: 0.05;\n }\n }\n\n @media (max-width: 768px) {\n .container {\n padding: 25px;\n }\n\n .info-section {\n grid-template-columns: 1fr;\n }\n\n .legend {\n flex-direction: column;\n gap: 10px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"watermark\">AiPro<br>Institute\u2122<\/div>\n \n <div class=\"container\">\n <div class=\"header\">\n <div class=\"logo\">AiPro Institute\u2122<\/div>\n <div class=\"document-title\">Project Timeline \/ Gantt Chart<\/div>\n <\/div>\n\n <div class=\"info-section\">\n <div class=\"info-item\">\n <label class=\"info-label\">Project Name<\/label>\n <input type=\"text\" class=\"info-input\" placeholder=\"Project title\">\n <\/div>\n <div class=\"info-item\">\n <label class=\"info-label\">Project Manager<\/label>\n <input type=\"text\" class=\"info-input\" placeholder=\"\u540d\u5b57\">\n <\/div>\n <div class=\"info-item\">\n <label class=\"info-label\">Start Date<\/label>\n <input type=\"date\" class=\"info-input\">\n <\/div>\n <div class=\"info-item\">\n <label class=\"info-label\">End Date<\/label>\n <input type=\"date\" class=\"info-input\">\n <\/div>\n <\/div>\n\n <div class=\"legend\">\n <div class=\"legend-item\">\n <div class=\"legend-box\" style=\"background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\"><\/div>\n <span>Task\/Activity<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-box\" style=\"background: #10b981;\"><\/div>\n <span>Completed<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-box\" style=\"background: #f59e0b;\"><\/div>\n <span>In Progress<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-circle\" style=\"background: #f59e0b;\"><\/div>\n <span>Milestone<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-box\" style=\"background: #ef4444;\"><\/div>\n <span>Critical Path<\/span>\n <\/div>\n <\/div>\n\n <div class=\"section-title\">\ud83d\udcca Visual Gantt Chart<\/div>\n\n <div class=\"gantt-container\">\n <table class=\"gantt-table\">\n <thead>\n <tr>\n <th style=\"width: 5%;\">#<\/th>\n <th style=\"width: 25%;\">Task Name<\/th>\n <th style=\"width: 10%;\">Owner<\/th>\n <th style=\"width: 8%;\">Start<\/th>\n <th style=\"width: 8%;\">End<\/th>\n <th style=\"width: 8%;\">Duration<\/th>\n <th style=\"width: 8%;\">Progress<\/th>\n <th style=\"width: 28%;\">Timeline (Visual)<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td>1<\/td>\n <td><input type=\"text\" placeholder=\"Project Initiation\"><\/td>\n <td><input type=\"text\" placeholder=\"PM\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"5d\"><\/td>\n <td>\n <select>\n <option value=\"0\">0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 0%; width: 15%;\">Phase 1<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>2<\/td>\n <td><input type=\"text\" placeholder=\"Requirements Gathering\"><\/td>\n <td><input type=\"text\" placeholder=\"BA\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"10d\"><\/td>\n <td>\n <select>\n <option value=\"0\">0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 15%; width: 20%; background: #10b981;\">Done<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>3<\/td>\n <td><input type=\"text\" placeholder=\"System Design\"><\/td>\n <td><input type=\"text\" placeholder=\"Architect\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"15d\"><\/td>\n <td>\n <select>\n <option value=\"0\">0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\" selected>50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 35%; width: 25%; background: #f59e0b;\">In Progress<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>4<\/td>\n <td><input type=\"text\" placeholder=\"Development Phase 1\"><\/td>\n <td><input type=\"text\" placeholder=\"Dev Team\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"20d\"><\/td>\n <td>\n <select>\n <option value=\"0\" selected>0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 60%; width: 30%;\">Not Started<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr style=\"background: #fef3c7;\">\n <td>\u2b50<\/td>\n <td><strong><input type=\"text\" placeholder=\"Milestone: Design Approval\" style=\"font-weight: 600;\"><\/strong><\/td>\n <td><input type=\"text\" placeholder=\"Sponsor\"><\/td>\n <td><input type=\"date\"><\/td>\n <td colspan=\"2\"><em>Milestone<\/em><\/td>\n <td>100%<\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"milestone-marker\" style=\"left: 60%;\"><\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>5<\/td>\n <td><input type=\"text\" placeholder=\"Testing & QA\"><\/td>\n <td><input type=\"text\" placeholder=\"QA Team\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"10d\"><\/td>\n <td>\n <select>\n <option value=\"0\" selected>0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 70%; width: 15%; background: #ef4444;\">Critical<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>6<\/td>\n <td><input type=\"text\" placeholder=\"User Acceptance Testing\"><\/td>\n <td><input type=\"text\" placeholder=\"Users\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"7d\"><\/td>\n <td>\n <select>\n <option value=\"0\" selected>0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 85%; width: 10%;\">UAT<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>7<\/td>\n <td><input type=\"text\" placeholder=\"Deployment\"><\/td>\n <td><input type=\"text\" placeholder=\"DevOps\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"3d\"><\/td>\n <td>\n <select>\n <option value=\"0\" selected>0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 95%; width: 5%; background: #ef4444;\">Deploy<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr style=\"background: #fef3c7;\">\n <td>\u2b50<\/td>\n <td><strong><input type=\"text\" placeholder=\"Milestone: Go-Live\" style=\"font-weight: 600;\"><\/strong><\/td>\n <td><input type=\"text\" placeholder=\"PM\"><\/td>\n <td><input type=\"date\"><\/td>\n <td colspan=\"2\"><em>Milestone<\/em><\/td>\n <td>0%<\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"milestone-marker\" style=\"left: 98%;\"><\/div>\n <\/div>\n <\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n\n <div class=\"section-title\">\ud83d\udccb Detailed Task List<\/div>\n\n <table>\n <thead>\n <tr>\n <th style=\"width: 5%;\">ID<\/th>\n <th style=\"width: 25%;\">Task Name<\/th>\n <th style=\"width: 15%;\">Assigned To<\/th>\n <th style=\"width: 10%;\">Start Date<\/th>\n <th style=\"width: 10%;\">End Date<\/th>\n <th style=\"width: 8%;\">Duration<\/th>\n <th style=\"width: 10%;\">Status<\/th>\n <th style=\"width: 17%;\">Dependencies<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td><input type=\"text\" placeholder=\"1\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"5 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"2\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"10 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"3\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"7 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"4\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"15 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"5\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"8 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"6\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"12 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"7\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"6 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"8\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"10 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n\n <div class=\"section-title\">\ud83c\udfaf Key Milestones<\/div>\n\n <table>\n <thead>\n <tr>\n <th style=\"width: 10%;\">Milestone #<\/th>\n <th style=\"width: 35%;\">Milestone Description<\/th>\n <th style=\"width: 15%;\">Target Date<\/th>\n <th style=\"width: 15%;\">Status<\/th>\n <th style=\"width: 25%;\">Deliverables<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td><input type=\"text\" placeholder=\"M1\"><\/td>\n <td><input type=\"text\" placeholder=\"Milestone name\"><\/td>\n <td><input type=\"date\"><\/td>\n <td>\n <select>\n <option value=\"\">Select<\/option>\n <option value=\"upcoming\">Upcoming<\/option>\n <option value=\"achieved\">Achieved<\/option>\n <option value=\"at-risk\">At Risk<\/option>\n <option value=\"missed\">Missed<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Key deliverables\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"M2\"><\/td>\n <td><input type=\"text\" placeholder=\"Milestone name\"><\/td>\n <td><input type=\"date\"><\/td>\n <td>\n <select>\n <option value=\"\">Select<\/option>\n <option value=\"upcoming\">Upcoming<\/option>\n <option value=\"achieved\">Achieved<\/option>\n <option value=\"at-risk\">At Risk<\/option>\n <option value=\"missed\">Missed<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Key deliverables\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"M3\"><\/td>\n <td><input type=\"text\" placeholder=\"Milestone name\"><\/td>\n <td><input type=\"date\"><\/td>\n <td>\n <select>\n <option value=\"\">Select<\/option>\n <option value=\"upcoming\">Upcoming<\/option>\n <option value=\"achieved\">Achieved<\/option>\n <option value=\"at-risk\">At Risk<\/option>\n <option value=\"missed\">Missed<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Key deliverables\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"M4\"><\/td>\n <td><input type=\"text\" placeholder=\"Milestone name\"><\/td>\n <td><input type=\"date\"><\/td>\n <td>\n <select>\n <option value=\"\">Select<\/option>\n <option value=\"upcoming\">Upcoming<\/option>\n <option value=\"achieved\">Achieved<\/option>\n <option value=\"at-risk\">At Risk<\/option>\n <option value=\"missed\">Missed<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Key deliverables\"><\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n\n <div class=\"notes-section\">\n <h3 style=\"margin-bottom: 10px; color: #92400e;\">\ud83d\udcdd Timeline Notes & Updates<\/h3>\n <textarea style=\"width: 100%; min-height: 100px; border: 2px dashed #f59e0b; padding: 12px; border-radius: 5px; font-family: inherit;\" placeholder=\"Schedule changes, delays, adjustments, critical path updates, resource changes, etc.\"><\/textarea>\n <\/div>\n\n <div style=\"margin-top: 40px; padding: 20px; background: linear-gradient(135deg, #f8f7ff 0%, #f0f9ff 100%); border-radius: 8px; text-align: center; font-size: 12px; color: #64748b;\">\n <p><strong>AiPro Institute\u2122<\/strong> | Project Management Excellence & Operations<\/p>\n <p style=\"margin-top: 5px;\">Project Timeline Template Version 1.0 | \u00a9 2026 AiPro Institute. All Rights Reserved.<\/p>\n <\/div>\n <\/div>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Project Timeline\/Gantt Chart – AiPro Institute\u2122 AiProInstitute\u2122 AiPro Institute\u2122 Project Timeline \/ Gantt Chart Project Name Project Manager Start Date End Date Task\/Activity Completed In Progress Milestone Critical Path \ud83d\udcca Visual Gantt Chart # Task Name Owner Start End Duration Progress Timeline (Visual) 1 0%25%50%75%100% Phase 1 2 0%25%50%75%100% Done 3 0%25%50%75%100% In Progress 4…<\/p>","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[81],"tags":[],"class_list":["post-2812","post","type-post","status-publish","format-standard","hentry","category-operations-project-management"],"acf":[],"_links":{"self":[{"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/posts\/2812","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/comments?post=2812"}],"version-history":[{"count":4,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/posts\/2812\/revisions"}],"predecessor-version":[{"id":2822,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/posts\/2812\/revisions\/2822"}],"wp:attachment":[{"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/media?parent=2812"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/categories?post=2812"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/tags?post=2812"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t

\n\t\t\t\t\t\t

\n\t\t\t\t\t\n\n\n \n \n Project Timeline\/Gantt Chart - AiPro Institute\u2122<\/title>\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: linear-gradient(135deg, #f5f3ff 0%, #e0f2fe 100%);\n padding: 20px;\n min-height: 100vh;\n }\n\n .container {\n max-width: 1400px;\n margin: 0 auto;\n background: white;\n padding: 50px;\n box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);\n border-radius: 10px;\n position: relative;\n }\n\n .watermark {\n position: fixed;\n bottom: 20px;\n right: 20px;\n font-size: 80px;\n font-weight: bold;\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n opacity: 0.1;\n z-index: 0;\n pointer-events: none;\n line-height: 1.2;\n }\n\n .header {\n text-align: center;\n margin-bottom: 40px;\n border-bottom: 4px solid;\n border-image: linear-gradient(90deg, #8B5CF6 0%, #3B82F6 100%) 1;\n padding-bottom: 30px;\n }\n\n .logo {\n font-size: 42px;\n font-weight: bold;\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n margin-bottom: 10px;\n line-height: 1.3;\n }\n\n .document-title {\n font-size: 32px;\n color: #1e293b;\n margin-top: 15px;\n font-weight: 600;\n }\n\n .info-section {\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 20px;\n margin-bottom: 35px;\n padding: 25px;\n background: linear-gradient(135deg, #f8f7ff 0%, #f0f9ff 100%);\n border-radius: 8px;\n }\n\n .info-item {\n display: flex;\n flex-direction: column;\n }\n\n .info-label {\n font-size: 12px;\n color: #64748b;\n margin-bottom: 5px;\n text-transform: uppercase;\n font-weight: 600;\n letter-spacing: 0.5px;\n }\n\n .info-input {\n padding: 10px;\n border: 2px dashed #cbd5e1;\n border-radius: 5px;\n font-size: 14px;\n background: white;\n transition: all 0.3s;\n }\n\n .info-input:focus {\n outline: none;\n border-color: #8B5CF6;\n background: #faf9ff;\n }\n\n .section-title {\n font-size: 20px;\n color: #1e293b;\n margin: 35px 0 20px 0;\n padding: 12px 20px;\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n color: white;\n border-radius: 6px;\n font-weight: 600;\n }\n\n .gantt-container {\n overflow-x: auto;\n margin: 25px 0;\n border: 2px solid #e2e8f0;\n border-radius: 8px;\n }\n\n .gantt-table {\n width: 100%;\n min-width: 1200px;\n border-collapse: collapse;\n font-size: 13px;\n }\n\n .gantt-table th {\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n color: white;\n padding: 12px 8px;\n text-align: left;\n font-weight: 600;\n font-size: 11px;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n position: sticky;\n top: 0;\n z-index: 10;\n }\n\n .gantt-table td {\n padding: 10px 8px;\n border: 1px solid #e2e8f0;\n }\n\n .gantt-table tr:nth-child(even) {\n background-color: #f8fafc;\n }\n\n .gantt-chart-area {\n position: relative;\n min-height: 40px;\n background: linear-gradient(90deg, #f8fafc 0%, #f1f5f9 100%);\n }\n\n .gantt-bar {\n position: absolute;\n height: 30px;\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n border-radius: 4px;\n top: 5px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: white;\n font-size: 11px;\n font-weight: 600;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);\n }\n\n .milestone-marker {\n position: absolute;\n width: 20px;\n height: 20px;\n background: #f59e0b;\n border-radius: 50%;\n top: 10px;\n border: 3px solid white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n }\n\n input[type=\"text\"],\n input[type=\"date\"],\n select,\n textarea {\n width: 100%;\n padding: 8px;\n border: 2px dashed #cbd5e1;\n border-radius: 4px;\n font-size: 12px;\n font-family: inherit;\n transition: all 0.3s;\n }\n\n input:focus,\n select:focus,\n textarea:focus {\n outline: none;\n border-color: #8B5CF6;\n background: #faf9ff;\n }\n\n .legend {\n display: flex;\n gap: 25px;\n justify-content: center;\n margin: 25px 0;\n padding: 20px;\n background: #f8fafc;\n border-radius: 8px;\n }\n\n .legend-item {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 13px;\n }\n\n .legend-box {\n width: 30px;\n height: 20px;\n border-radius: 4px;\n }\n\n .legend-circle {\n width: 20px;\n height: 20px;\n border-radius: 50%;\n border: 3px solid white;\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n }\n\n table {\n width: 100%;\n border-collapse: collapse;\n margin: 20px 0;\n }\n\n th {\n background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\n color: white;\n padding: 12px;\n text-align: left;\n font-weight: 600;\n font-size: 12px;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n\n td {\n padding: 10px 12px;\n border: 1px solid #e2e8f0;\n font-size: 13px;\n }\n\n tr:nth-child(even) {\n background-color: #f8fafc;\n }\n\n .notes-section {\n background: #fffbeb;\n border-left: 4px solid #f59e0b;\n padding: 20px;\n margin: 25px 0;\n border-radius: 5px;\n }\n\n @media print {\n body {\n background: white;\n padding: 0;\n }\n\n .container {\n box-shadow: none;\n padding: 20px;\n }\n\n .watermark {\n opacity: 0.05;\n }\n }\n\n @media (max-width: 768px) {\n .container {\n padding: 25px;\n }\n\n .info-section {\n grid-template-columns: 1fr;\n }\n\n .legend {\n flex-direction: column;\n gap: 10px;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"watermark\">AiPro<br>Institute\u2122<\/div>\n \n <div class=\"container\">\n <div class=\"header\">\n <div class=\"logo\">AiPro Institute\u2122<\/div>\n <div class=\"document-title\">Project Timeline \/ Gantt Chart<\/div>\n <\/div>\n\n <div class=\"info-section\">\n <div class=\"info-item\">\n <label class=\"info-label\">Project Name<\/label>\n <input type=\"text\" class=\"info-input\" placeholder=\"Project title\">\n <\/div>\n <div class=\"info-item\">\n <label class=\"info-label\">Project Manager<\/label>\n <input type=\"text\" class=\"info-input\" placeholder=\"\u540d\u5b57\">\n <\/div>\n <div class=\"info-item\">\n <label class=\"info-label\">Start Date<\/label>\n <input type=\"date\" class=\"info-input\">\n <\/div>\n <div class=\"info-item\">\n <label class=\"info-label\">End Date<\/label>\n <input type=\"date\" class=\"info-input\">\n <\/div>\n <\/div>\n\n <div class=\"legend\">\n <div class=\"legend-item\">\n <div class=\"legend-box\" style=\"background: linear-gradient(135deg, #8B5CF6 0%, #3B82F6 100%);\"><\/div>\n <span>Task\/Activity<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-box\" style=\"background: #10b981;\"><\/div>\n <span>Completed<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-box\" style=\"background: #f59e0b;\"><\/div>\n <span>In Progress<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-circle\" style=\"background: #f59e0b;\"><\/div>\n <span>Milestone<\/span>\n <\/div>\n <div class=\"legend-item\">\n <div class=\"legend-box\" style=\"background: #ef4444;\"><\/div>\n <span>Critical Path<\/span>\n <\/div>\n <\/div>\n\n <div class=\"section-title\">\ud83d\udcca Visual Gantt Chart<\/div>\n\n <div class=\"gantt-container\">\n <table class=\"gantt-table\">\n <thead>\n <tr>\n <th style=\"width: 5%;\">#<\/th>\n <th style=\"width: 25%;\">Task Name<\/th>\n <th style=\"width: 10%;\">Owner<\/th>\n <th style=\"width: 8%;\">Start<\/th>\n <th style=\"width: 8%;\">End<\/th>\n <th style=\"width: 8%;\">Duration<\/th>\n <th style=\"width: 8%;\">Progress<\/th>\n <th style=\"width: 28%;\">Timeline (Visual)<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td>1<\/td>\n <td><input type=\"text\" placeholder=\"Project Initiation\"><\/td>\n <td><input type=\"text\" placeholder=\"PM\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"5d\"><\/td>\n <td>\n <select>\n <option value=\"0\">0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 0%; width: 15%;\">Phase 1<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>2<\/td>\n <td><input type=\"text\" placeholder=\"Requirements Gathering\"><\/td>\n <td><input type=\"text\" placeholder=\"BA\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"10d\"><\/td>\n <td>\n <select>\n <option value=\"0\">0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 15%; width: 20%; background: #10b981;\">Done<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>3<\/td>\n <td><input type=\"text\" placeholder=\"System Design\"><\/td>\n <td><input type=\"text\" placeholder=\"Architect\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"15d\"><\/td>\n <td>\n <select>\n <option value=\"0\">0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\" selected>50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 35%; width: 25%; background: #f59e0b;\">In Progress<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>4<\/td>\n <td><input type=\"text\" placeholder=\"Development Phase 1\"><\/td>\n <td><input type=\"text\" placeholder=\"Dev Team\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"20d\"><\/td>\n <td>\n <select>\n <option value=\"0\" selected>0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 60%; width: 30%;\">Not Started<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr style=\"background: #fef3c7;\">\n <td>\u2b50<\/td>\n <td><strong><input type=\"text\" placeholder=\"Milestone: Design Approval\" style=\"font-weight: 600;\"><\/strong><\/td>\n <td><input type=\"text\" placeholder=\"Sponsor\"><\/td>\n <td><input type=\"date\"><\/td>\n <td colspan=\"2\"><em>Milestone<\/em><\/td>\n <td>100%<\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"milestone-marker\" style=\"left: 60%;\"><\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>5<\/td>\n <td><input type=\"text\" placeholder=\"Testing & QA\"><\/td>\n <td><input type=\"text\" placeholder=\"QA Team\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"10d\"><\/td>\n <td>\n <select>\n <option value=\"0\" selected>0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 70%; width: 15%; background: #ef4444;\">Critical<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>6<\/td>\n <td><input type=\"text\" placeholder=\"User Acceptance Testing\"><\/td>\n <td><input type=\"text\" placeholder=\"Users\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"7d\"><\/td>\n <td>\n <select>\n <option value=\"0\" selected>0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 85%; width: 10%;\">UAT<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td>7<\/td>\n <td><input type=\"text\" placeholder=\"Deployment\"><\/td>\n <td><input type=\"text\" placeholder=\"DevOps\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"3d\"><\/td>\n <td>\n <select>\n <option value=\"0\" selected>0%<\/option>\n <option value=\"25\">25%<\/option>\n <option value=\"50\">50%<\/option>\n <option value=\"75\">75%<\/option>\n <option value=\"100\">100%<\/option>\n <\/select>\n <\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"gantt-bar\" style=\"left: 95%; width: 5%; background: #ef4444;\">Deploy<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr style=\"background: #fef3c7;\">\n <td>\u2b50<\/td>\n <td><strong><input type=\"text\" placeholder=\"Milestone: Go-Live\" style=\"font-weight: 600;\"><\/strong><\/td>\n <td><input type=\"text\" placeholder=\"PM\"><\/td>\n <td><input type=\"date\"><\/td>\n <td colspan=\"2\"><em>Milestone<\/em><\/td>\n <td>0%<\/td>\n <td>\n <div class=\"gantt-chart-area\">\n <div class=\"milestone-marker\" style=\"left: 98%;\"><\/div>\n <\/div>\n <\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n <\/div>\n\n <div class=\"section-title\">\ud83d\udccb Detailed Task List<\/div>\n\n <table>\n <thead>\n <tr>\n <th style=\"width: 5%;\">ID<\/th>\n <th style=\"width: 25%;\">Task Name<\/th>\n <th style=\"width: 15%;\">Assigned To<\/th>\n <th style=\"width: 10%;\">Start Date<\/th>\n <th style=\"width: 10%;\">End Date<\/th>\n <th style=\"width: 8%;\">Duration<\/th>\n <th style=\"width: 10%;\">Status<\/th>\n <th style=\"width: 17%;\">Dependencies<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td><input type=\"text\" placeholder=\"1\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"5 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"2\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"10 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"3\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"7 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"4\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"15 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"5\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"8 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"6\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"12 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"7\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"6 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"8\"><\/td>\n <td><input type=\"text\" placeholder=\"Task name\"><\/td>\n <td><input type=\"text\" placeholder=\"Team member\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"date\"><\/td>\n <td><input type=\"text\" placeholder=\"10 days\"><\/td>\n <td>\n <select>\n <option value=\"\">Status<\/option>\n <option value=\"not-started\">Not Started<\/option>\n <option value=\"in-progress\">In Progress<\/option>\n <option value=\"completed\">Completed<\/option>\n <option value=\"on-hold\">On Hold<\/option>\n <option value=\"blocked\">Blocked<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Task IDs\"><\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n\n <div class=\"section-title\">\ud83c\udfaf Key Milestones<\/div>\n\n <table>\n <thead>\n <tr>\n <th style=\"width: 10%;\">Milestone #<\/th>\n <th style=\"width: 35%;\">Milestone Description<\/th>\n <th style=\"width: 15%;\">Target Date<\/th>\n <th style=\"width: 15%;\">Status<\/th>\n <th style=\"width: 25%;\">Deliverables<\/th>\n <\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td><input type=\"text\" placeholder=\"M1\"><\/td>\n <td><input type=\"text\" placeholder=\"Milestone name\"><\/td>\n <td><input type=\"date\"><\/td>\n <td>\n <select>\n <option value=\"\">Select<\/option>\n <option value=\"upcoming\">Upcoming<\/option>\n <option value=\"achieved\">Achieved<\/option>\n <option value=\"at-risk\">At Risk<\/option>\n <option value=\"missed\">Missed<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Key deliverables\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"M2\"><\/td>\n <td><input type=\"text\" placeholder=\"Milestone name\"><\/td>\n <td><input type=\"date\"><\/td>\n <td>\n <select>\n <option value=\"\">Select<\/option>\n <option value=\"upcoming\">Upcoming<\/option>\n <option value=\"achieved\">Achieved<\/option>\n <option value=\"at-risk\">At Risk<\/option>\n <option value=\"missed\">Missed<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Key deliverables\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"M3\"><\/td>\n <td><input type=\"text\" placeholder=\"Milestone name\"><\/td>\n <td><input type=\"date\"><\/td>\n <td>\n <select>\n <option value=\"\">Select<\/option>\n <option value=\"upcoming\">Upcoming<\/option>\n <option value=\"achieved\">Achieved<\/option>\n <option value=\"at-risk\">At Risk<\/option>\n <option value=\"missed\">Missed<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Key deliverables\"><\/td>\n <\/tr>\n <tr>\n <td><input type=\"text\" placeholder=\"M4\"><\/td>\n <td><input type=\"text\" placeholder=\"Milestone name\"><\/td>\n <td><input type=\"date\"><\/td>\n <td>\n <select>\n <option value=\"\">Select<\/option>\n <option value=\"upcoming\">Upcoming<\/option>\n <option value=\"achieved\">Achieved<\/option>\n <option value=\"at-risk\">At Risk<\/option>\n <option value=\"missed\">Missed<\/option>\n <\/select>\n <\/td>\n <td><input type=\"text\" placeholder=\"Key deliverables\"><\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n\n <div class=\"notes-section\">\n <h3 style=\"margin-bottom: 10px; color: #92400e;\">\ud83d\udcdd Timeline Notes & Updates<\/h3>\n <textarea style=\"width: 100%; min-height: 100px; border: 2px dashed #f59e0b; padding: 12px; border-radius: 5px; font-family: inherit;\" placeholder=\"Schedule changes, delays, adjustments, critical path updates, resource changes, etc.\"><\/textarea>\n <\/div>\n\n <div style=\"margin-top: 40px; padding: 20px; background: linear-gradient(135deg, #f8f7ff 0%, #f0f9ff 100%); border-radius: 8px; text-align: center; font-size: 12px; color: #64748b;\">\n <p><strong>AiPro Institute\u2122<\/strong> | Project Management Excellence & Operations<\/p>\n <p style=\"margin-top: 5px;\">Project Timeline Template Version 1.0 | \u00a9 2026 AiPro Institute. All Rights Reserved.<\/p>\n <\/div>\n <\/div>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Project Timeline\/Gantt Chart – AiPro Institute\u2122 AiProInstitute\u2122 AiPro Institute\u2122 Project Timeline \/ Gantt Chart Project Name Project Manager Start Date End Date Task\/Activity Completed In Progress Milestone Critical Path \ud83d\udcca Visual Gantt Chart # Task Name Owner Start End Duration Progress Timeline (Visual) 1 0%25%50%75%100% Phase 1 2 0%25%50%75%100% Done 3 0%25%50%75%100% In Progress 4…<\/p>","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[81],"tags":[],"class_list":["post-2812","post","type-post","status-publish","format-standard","hentry","category-operations-project-management"],"acf":[],"_links":{"self":[{"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/posts\/2812","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/comments?post=2812"}],"version-history":[{"count":4,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/posts\/2812\/revisions"}],"predecessor-version":[{"id":2822,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/posts\/2812\/revisions\/2822"}],"wp:attachment":[{"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/media?parent=2812"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/categories?post=2812"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/teen.aiproinstitute.com\/zh\/wp-json\/wp\/v2\/tags?post=2812"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}