templates/tasks_list/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block body %}
  5.                             <!-- PAGE-HEADER -->
  6.                             <div class="page-header">
  7.                                 <div>
  8.                                     <h1 class="page-title">Tasks List</h1>
  9.                                 </div>
  10.                                 <div class="ms-auto pageheader-btn">
  11.                                     <ol class="breadcrumb">
  12.                                         <li class="breadcrumb-item">Apps</li>
  13.                                         <li class="breadcrumb-item"><a href="javascript:void(0);">Tasks</a></li>
  14.                                         <li class="breadcrumb-item active" aria-current="page">Task list</li>
  15.                                     </ol>
  16.                                 </div>
  17.                             </div>
  18.                             <!-- PAGE-HEADER END -->
  20.                             <!--ROW OPENED-->
  21.                             <div class="row">
  22.                                 <div class="col-md-12 col-xl-12">
  23.                                     <div class="row">
  24.                                         <div class="col-md-12 col-lg-6 col-xl-3">
  25.                                             <div class="card">
  26.                                                 <div class="card-body">
  27.                                                     <div class="row">
  28.                                                         <div class="col-8">
  29.                                                             <h4>Total Tasks</h4>
  30.                                                             <p>35</p>
  31.                                                         </div>
  32.                                                         <div class="col-4">
  33.                                                             <div class="hpx-50 wpx-50 bg-primary br-5 d-flex align-items-center justify-content-center ms-auto">
  34.                                                                 <svg xmlns="http://www.w3.org/2000/svg" class="text-white w-icn" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path d="M17,4h-1.1846313C15.4013672,2.8383179,14.3035889,2.0014648,13,2h-2C9.6964111,2.0014648,8.5986328,2.8383179,8.1846313,4H7C5.3438721,4.0018311,4.0018311,5.3438721,4,7v12c0.0018311,1.6561279,1.3438721,2.9981689,3,3h10c1.6561279-0.0018311,2.9981689-1.3438721,3-3V7C19.9981689,5.3438721,18.6561279,4.0018311,17,4z M9,5c0.0014038-1.1040039,0.8959961-1.9985962,2-2h2c1.1040039,0.0014038,1.9985962,0.8959961,2,2v2H9V5z M19,19c-0.0014038,1.1040039-0.8959961,1.9985962-2,2H7c-1.1040039-0.0014038-1.9985962-0.8959961-2-2V7c0.0014038-1.1040039,0.8959961-1.9985962,2-2h1v2.5006104C8.0001831,7.7765503,8.223999,8.0001831,8.5,8h7.0006104C15.7765503,7.9998169,16.0001831,7.776001,16,7.5V5h1c1.1040039,0.0014038,1.9985962,0.8959961,2,2V19z"/></svg>
  35.                                                             </div>
  36.                                                         </div>
  37.                                                     </div>
  38.                                                 </div>
  39.                                             </div>
  40.                                         </div>
  41.                                         <div class="col-md-12 col-lg-6 col-xl-3">
  42.                                             <div class="card">
  43.                                                 <div class="card-body">
  44.                                                     <div class="row">
  45.                                                         <div class="col-8">
  46.                                                             <h4>Completed Tasks</h4>
  47.                                                             <p>15</p>
  48.                                                         </div>
  49.                                                         <div class="col-4">
  50.                                                             <div class="hpx-50 wpx-50 br-5 d-flex align-items-center justify-content-center bg-secondary ms-auto">
  51.                                                                 <svg xmlns="http://www.w3.org/2000/svg" class="text-white w-icn" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path d="M17,4h-1.1846313C15.4013672,2.8383179,14.3035889,2.0014648,13,2h-2C9.6964111,2.0014648,8.5986328,2.8383179,8.1846313,4H7C5.3438721,4.0018311,4.0018311,5.3438721,4,7v12c0.0018311,1.6561279,1.3438721,2.9981689,3,3h10c1.6561279-0.0018311,2.9981689-1.3438721,3-3V7C19.9981689,5.3438721,18.6561279,4.0018311,17,4z M9,5c0.0014038-1.1040039,0.8959961-1.9985962,2-2h2c1.1040039,0.0014038,1.9985962,0.8959961,2,2v2H9V5z M19,19c-0.0014038,1.1040039-0.8959961,1.9985962-2,2H7c-1.1040039-0.0014038-1.9985962-0.8959961-2-2V7c0.0014038-1.1040039,0.8959961-1.9985962,2-2h1v2.5006104C8.0001831,7.7765503,8.223999,8.0001831,8.5,8h7.0006104C15.7765503,7.9998169,16.0001831,7.776001,16,7.5V5h1c1.1040039,0.0014038,1.9985962,0.8959961,2,2V19z"/></svg>
  52.                                                             </div>
  53.                                                         </div>
  54.                                                     </div>
  55.                                                 </div>
  56.                                             </div>
  57.                                         </div>
  58.                                         <div class="col-md-12 col-lg-6 col-xl-3">
  59.                                             <div class="card">
  60.                                                 <div class="card-body">
  61.                                                     <div class="row">
  62.                                                         <div class="col-8">
  63.                                                             <h4>In Progress</h4>
  64.                                                             <p>4</p>
  65.                                                         </div>
  66.                                                         <div class="col-4">
  67.                                                             <div class="hpx-50 wpx-50 br-5 d-flex align-items-center justify-content-center bg-info ms-auto">
  68.                                                                 <svg xmlns="http://www.w3.org/2000/svg" class="text-white w-icn" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path d="M17,4h-1.1846313C15.4013672,2.8383179,14.3035889,2.0014648,13,2h-2C9.6964111,2.0014648,8.5986328,2.8383179,8.1846313,4H7C5.3438721,4.0018311,4.0018311,5.3438721,4,7v12c0.0018311,1.6561279,1.3438721,2.9981689,3,3h10c1.6561279-0.0018311,2.9981689-1.3438721,3-3V7C19.9981689,5.3438721,18.6561279,4.0018311,17,4z M9,5c0.0014038-1.1040039,0.8959961-1.9985962,2-2h2c1.1040039,0.0014038,1.9985962,0.8959961,2,2v2H9V5z M19,19c-0.0014038,1.1040039-0.8959961,1.9985962-2,2H7c-1.1040039-0.0014038-1.9985962-0.8959961-2-2V7c0.0014038-1.1040039,0.8959961-1.9985962,2-2h1v2.5006104C8.0001831,7.7765503,8.223999,8.0001831,8.5,8h7.0006104C15.7765503,7.9998169,16.0001831,7.776001,16,7.5V5h1c1.1040039,0.0014038,1.9985962,0.8959961,2,2V19z"/></svg>
  69.                                                             </div>
  70.                                                         </div>
  71.                                                     </div>
  72.                                                 </div>
  73.                                             </div>
  74.                                         </div>
  75.                                         <div class="col-md-12 col-lg-6 col-xl-3">
  76.                                             <div class="card">
  77.                                                 <div class="card-body">
  78.                                                     <div class="row">
  79.                                                         <div class="col-8">
  80.                                                             <h4>On Hold</h4>
  81.                                                             <p>6</p>
  82.                                                         </div>
  83.                                                         <div class="col-4">
  84.                                                             <div class="hpx-50 wpx-50 br-5 d-flex align-items-center justify-content-center bg-warning ms-auto">
  85.                                                                 <svg xmlns="http://www.w3.org/2000/svg" class="text-white w-icn" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path d="M17,4h-1.1846313C15.4013672,2.8383179,14.3035889,2.0014648,13,2h-2C9.6964111,2.0014648,8.5986328,2.8383179,8.1846313,4H7C5.3438721,4.0018311,4.0018311,5.3438721,4,7v12c0.0018311,1.6561279,1.3438721,2.9981689,3,3h10c1.6561279-0.0018311,2.9981689-1.3438721,3-3V7C19.9981689,5.3438721,18.6561279,4.0018311,17,4z M9,5c0.0014038-1.1040039,0.8959961-1.9985962,2-2h2c1.1040039,0.0014038,1.9985962,0.8959961,2,2v2H9V5z M19,19c-0.0014038,1.1040039-0.8959961,1.9985962-2,2H7c-1.1040039-0.0014038-1.9985962-0.8959961-2-2V7c0.0014038-1.1040039,0.8959961-1.9985962,2-2h1v2.5006104C8.0001831,7.7765503,8.223999,8.0001831,8.5,8h7.0006104C15.7765503,7.9998169,16.0001831,7.776001,16,7.5V5h1c1.1040039,0.0014038,1.9985962,0.8959961,2,2V19z"/></svg>
  86.                                                             </div>
  87.                                                         </div>
  88.                                                     </div>
  89.                                                 </div>
  90.                                             </div>
  91.                                         </div>
  92.                                     </div>
  93.                                 </div>
  95.                                 <div class="col-md-12 mb-3">
  96.                                     <div class="btn-list">
  97.                                         <a href="{{ absolute_url(path('app_task_create')) }}" class="btn btn-primary">
  98.                                             <svg xmlns="http://www.w3.org/2000/svg" class="w-inner-icn text-white" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path d="M16,11.5h-3.5V8c0-0.276123-0.223877-0.5-0.5-0.5S11.5,7.723877,11.5,8v3.5H8c-0.276123,0-0.5,0.223877-0.5,0.5s0.223877,0.5,0.5,0.5h3.5v3.5005493C11.5001831,16.2765503,11.723999,16.5001831,12,16.5h0.0006104C12.2765503,16.4998169,12.5001831,16.276001,12.5,16v-3.5H16c0.276123,0,0.5-0.223877,0.5-0.5S16.276123,11.5,16,11.5z M12,2C6.4771729,2,2,6.4771729,2,12s4.4771729,10,10,10c5.5202026-0.0062866,9.9937134-4.4797974,10-10C22,6.4771729,17.5228271,2,12,2z M12,21c-4.9705811,0-9-4.0294189-9-9s4.0294189-9,9-9c4.9682617,0.0056152,8.9943848,4.0317383,9,9C21,16.9705811,16.9705811,21,12,21z"/></svg>
  99.                                             New Task
  100.                                         </a>
  101.                                         <a href="{{ absolute_url(path('app_task_edit')) }}" class="btn btn-info">
  102.                                             <svg xmlns="http://www.w3.org/2000/svg" class="w-inner-icn text-white" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path d="M21.5,21h-19C2.223877,21,2,21.223877,2,21.5S2.223877,22,2.5,22h19c0.276123,0,0.5-0.223877,0.5-0.5S21.776123,21,21.5,21z M4.5,18.0888672h5c0.1326294,0,0.2597656-0.0527344,0.3534546-0.1465454l10-10c0.000061,0,0.0001221-0.000061,0.0001831-0.0001221c0.1951294-0.1952515,0.1950684-0.5117188-0.0001831-0.7068481l-5-5c0-0.000061-0.000061-0.0001221-0.0001221-0.0001221c-0.1951904-0.1951904-0.5117188-0.1951294-0.7068481,0.0001221l-10,10C4.0526733,12.3291016,4,12.4562378,4,12.5888672v5c0,0.0001831,0,0.0003662,0,0.0005493C4.0001831,17.8654175,4.223999,18.0890503,4.5,18.0888672z M14.5,3.2958984l4.2930298,4.2929688l-2.121582,2.121582l-4.2926025-4.293396L14.5,3.2958984z M5,12.7958984l6.671814-6.671814l4.2926025,4.293396l-6.6713867,6.6713867H5V12.7958984z"/></svg>
  103.                                             Edit Task
  104.                                         </a>
  105.                                     </div>
  106.                                 </div>
  107.                                 <div class="col-md-12">
  108.                                     <div class="card">
  109.                                         <div class="card-body tasks-table-container">
  110.                                             <div class="table-responsive">
  111.                                                 <table id="tasks-table" class="table text-nowrap mb-0 table-bordered border-top border-bottom">
  112.                                                     <thead class="table-head">
  113.                                                         <tr>
  114.                                                             <th class="bg-transparent border-bottom-0 w-5">S.no</th>
  115.                                                             <th class="bg-transparent border-bottom-0">Task</th>
  116.                                                             <th class="bg-transparent border-bottom-0">Project</th>
  117.                                                             <th class="bg-transparent border-bottom-0">Due Date</th>
  118.                                                             <th class="bg-transparent border-bottom-0">Assigned To</th>
  119.                                                             <th class="bg-transparent border-bottom-0">Status</th>
  120.                                                             <th class="bg-transparent border-bottom-0 no-btn">Action</th>
  121.                                                         </tr>
  122.                                                     </thead>
  123.                                                     <tbody class="table-body">
  124.                                                         <tr>
  125.                                                             <td class="text-muted fs-15 fw-semibold text-center">01.</td>
  126.                                                             <td class="text-muted fs-15 fw-semibold"><a href="#" class="text-dark" data-bs-target="#Vertically" data-bs-toggle="modal" >Sit sed takimata sanctus invidunt</a></td>
  127.                                                             <td class="text-muted fs-15 fw-semibold"><a href="{{ absolute_url(path('app_project_details')) }}" class="text-dark">Noa Dashboard UI</a></td>
  128.                                                             <td class="text-danger fs-15 fw-semibold">31 Oct 21</td>
  129.                                                             <td>
  130.                                                                 <div class="d-flex align-items-center">
  131.                                                                     <div class="me-2">
  132.                                                                         <span class="data-image avatar avatar-md rounded-circle" style="background-image: url(../build/images/users/8.jpg)"></span>
  133.                                                                     </div>
  134.                                                                     <div>
  135.                                                                         <h6 class="mb-0">Skyler Hilda</h6>
  136.                                                                         <span class="text-muted fs-12">member@spruko.com</span>
  137.                                                                     </div>
  138.                                                                 </div>
  139.                                                             </td>
  140.                                                             <td>
  141.                                                                 <div class="form-group mb-0">
  142.                                                                     <ul>
  143.                                                                         <li class="select-status">
  144.                                                                             <select class="form-control select2-status-search" data-placeholder="Select Status">
  145.                                                                                 <option value="IP" selected>In Progress</option>
  146.                                                                                 <option value="OH">On Hold</option>
  147.                                                                                 <option value="CP">Completed</option>
  148.                                                                             </select>
  149.                                                                         </li>
  150.                                                                     </ul>
  151.                                                                 </div>
  152.                                                             </td>
  153.                                                             <td>
  154.                                                                 <div class="d-flex align-items-stretch">
  155.                                                                     <a class="btn btn-sm btn-outline-primary border me-2" data-bs-toggle="tooltip" data-bs-original-title="Mark As Completed">
  156.                                                                         <svg  xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="20" width="16" viewBox="0 0 24 24"><path d="M15.8085327,8.6464844l-5.6464233,5.6464844l-2.4707031-2.4697266c-0.0023804-0.0023804-0.0047607-0.0047607-0.0072021-0.0071411c-0.1972046-0.1932373-0.5137329-0.1900635-0.7069702,0.0071411c-0.1932983,0.1972656-0.1900635,0.5137939,0.0071411,0.7070312l2.8242188,2.8232422C9.9022217,15.4474487,10.02948,15.5001831,10.1621094,15.5c0.1326294,0.0001221,0.2598267-0.0525513,0.3534546-0.1464844l6-6c0.0023804-0.0023804,0.0047607-0.0046997,0.0071411-0.0071411c0.1932373-0.1972046,0.1900635-0.5137329-0.0071411-0.7069702C16.3183594,8.446106,16.0018311,8.4493408,15.8085327,8.6464844z M12,2C6.4771729,2,2,6.4771729,2,12s4.4771729,10,10,10c5.5201416-0.0064697,9.9935303-4.4798584,10-10C22,6.4771729,17.5228271,2,12,2z M12,21c-4.9705811,0-9-4.0294189-9-9s4.0294189-9,9-9c4.9683228,0.0054321,8.9945679,4.0316772,9,9C21,16.9705811,16.9705811,21,12,21z"/></svg>
  157.                                                                     </a>
  158.                                                                     <a class="btn btn-sm btn-outline-secondary border me-2" data-bs-toggle="tooltip" data-bs-original-title="Delete">
  159.                                                                         <svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="16"><path d="M0 0h24v24H0V0z" fill="none" /><path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM8 9h8v10H8V9zm7.5-5l-1-1h-5l-1 1H5v2h14V4h-3.5z" /></svg>
  160.                                                                     </a>
  161.                                                                     <a href="#" class="border br-5 px-2 py-1 d-flex align-items-center" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fe fe-more-vertical"></i></a>
  162.                                                                     <div class="dropdown-menu dropdown-menu-start">
  163.                                                                         <a class="dropdown-item" href="#"><i class="fe fe-edit-2 me-2"></i> Edit</a>
  164.                                                                         <a class="dropdown-item" href="#"><i class="fe fe-info me-2"></i> Info</a>
  165.                                                                     </div>
  166.                                                                 </div>
  167.                                                             </td>
  168.                                                         </tr>
  169.                                                         <tr>
  170.                                                             <td class="text-muted fs-15 fw-semibold text-center">02.</td>
  171.                                                             <td class="text-muted fs-15 fw-semibold"><a href="#" class="text-dark" data-bs-target="#Vertically" data-bs-toggle="modal" >Diam lorem dolor no lorem.</a></td>
  172.                                                             <td class="text-muted fs-15 fw-semibold"><a href="{{ absolute_url(path('app_project_details')) }}" class="text-dark">Noa Dashboard UI</a></td>
  173.                                                             <td class="text-danger fs-15 fw-semibold">01 Nov 21</td>
  174.                                                             <td>
  175.                                                                 <div class="d-flex align-items-center">
  176.                                                                     <div class="me-2">
  177.                                                                         <span class="data-image avatar avatar-md rounded-circle" style="background-image: url(../build/images/users/12.jpg)"></span>
  178.                                                                     </div>
  179.                                                                     <div>
  180.                                                                         <h6 class="mb-0">Daniel Obrien</h6>
  181.                                                                         <span class="text-muted fs-12">member@spruko.com</span>
  182.                                                                     </div>
  183.                                                                 </div>
  184.                                                             </td>
  185.                                                             <td>
  186.                                                                 <div class="form-group mb-0">
  187.                                                                     <ul>
  188.                                                                         <li class="select-status">
  189.                                                                             <select class="form-control select2-status-search" data-placeholder="Select Status">
  190.                                                                                 <option value="IP">In Progress</option>
  191.                                                                                 <option value="OH" selected>On Hold</option>
  192.                                                                                 <option value="CP">Completed</option>
  193.                                                                             </select>
  194.                                                                         </li>
  195.                                                                     </ul>
  196.                                                                 </div>
  197.                                                             </td>
  198.                                                             <td>
  199.                                                                 <div class="d-flex align-items-stretch">
  200.                                                                     <a class="btn btn-sm btn-outline-primary border me-2" data-bs-toggle="tooltip" data-bs-original-title="Mark As Completed">
  201.                                                                         <svg  xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="20" width="16" viewBox="0 0 24 24"><path d="M15.8085327,8.6464844l-5.6464233,5.6464844l-2.4707031-2.4697266c-0.0023804-0.0023804-0.0047607-0.0047607-0.0072021-0.0071411c-0.1972046-0.1932373-0.5137329-0.1900635-0.7069702,0.0071411c-0.1932983,0.1972656-0.1900635,0.5137939,0.0071411,0.7070312l2.8242188,2.8232422C9.9022217,15.4474487,10.02948,15.5001831,10.1621094,15.5c0.1326294,0.0001221,0.2598267-0.0525513,0.3534546-0.1464844l6-6c0.0023804-0.0023804,0.0047607-0.0046997,0.0071411-0.0071411c0.1932373-0.1972046,0.1900635-0.5137329-0.0071411-0.7069702C16.3183594,8.446106,16.0018311,8.4493408,15.8085327,8.6464844z M12,2C6.4771729,2,2,6.4771729,2,12s4.4771729,10,10,10c5.5201416-0.0064697,9.9935303-4.4798584,10-10C22,6.4771729,17.5228271,2,12,2z M12,21c-4.9705811,0-9-4.0294189-9-9s4.0294189-9,9-9c4.9683228,0.0054321,8.9945679,4.0316772,9,9C21,16.9705811,16.9705811,21,12,21z"/></svg>
  202.                                                                     </a>
  203.                                                                     <a class="btn btn-sm btn-outline-secondary border me-2" data-bs-toggle="tooltip" data-bs-original-title="Delete">
  204.                                                                         <svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="16"><path d="M0 0h24v24H0V0z" fill="none" /><path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM8 9h8v10H8V9zm7.5-5l-1-1h-5l-1 1H5v2h14V4h-3.5z" /></svg>
  205.                                                                     </a>
  206.                                                                     <a href="#" class="border br-5 px-2 py-1 d-flex align-items-center" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fe fe-more-vertical"></i></a>
  207.                                                                     <div class="dropdown-menu dropdown-menu-start">
  208.                                                                         <a class="dropdown-item" href="#"><i class="fe fe-edit-2 me-2"></i> Edit</a>
  209.                                                                         <a class="dropdown-item" href="#"><i class="fe fe-info me-2"></i> Info</a>
  210.                                                                     </div>
  211.                                                                 </div>
  212.                                                             </td>
  213.                                                         </tr>
  214.                                                         <tr>
  215.                                                             <td class="text-muted fs-15 fw-semibold text-center">03.</td>
  216.                                                             <td class="text-muted fs-15 fw-semibold"><a href="#" class="text-dark" data-bs-target="#Vertically" data-bs-toggle="modal" >Amet clita sea ut dolor consetetur, elitr.</a></td>
  217.                                                             <td class="text-muted fs-15 fw-semibold"><a href="{{ absolute_url(path('app_project_details')) }}" class="text-dark">Noa Dashboard UI</a></td>
  218.                                                             <td class="text-danger fs-15 fw-semibold">08 Nov 21</td>
  219.                                                             <td>
  220.                                                                 <div class="d-flex align-items-center">
  221.                                                                     <div class="me-2">
  222.                                                                         <span class="data-image avatar avatar-md rounded-circle" style="background-image: url(../build/images/users/13.jpg)"></span>
  223.                                                                     </div>
  224.                                                                     <div>
  225.                                                                         <h6 class="mb-0">William Turner</h6>
  226.                                                                         <span class="text-muted fs-12">member@spruko.com</span>
  227.                                                                     </div>
  228.                                                                 </div>
  229.                                                             </td>
  230.                                                             <td>
  231.                                                                 <div class="form-group mb-0">
  232.                                                                     <ul>
  233.                                                                         <li class="select-status">
  234.                                                                             <select class="form-control select2-status-search" data-placeholder="Select Status">
  235.                                                                                 <option value="IP">In Progress</option>
  236.                                                                                 <option value="OH" selected>On Hold</option>
  237.                                                                                 <option value="CP">Completed</option>
  238.                                                                             </select>
  239.                                                                         </li>
  240.                                                                     </ul>
  241.                                                                 </div>
  242.                                                             </td>
  243.                                                             <td>
  244.                                                                 <div class="d-flex align-items-stretch">
  245.                                                                     <a class="btn btn-sm btn-outline-primary border me-2" data-bs-toggle="tooltip" data-bs-original-title="Mark As Completed">
  246.                                                                         <svg  xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="20" width="16" viewBox="0 0 24 24"><path d="M15.8085327,8.6464844l-5.6464233,5.6464844l-2.4707031-2.4697266c-0.0023804-0.0023804-0.0047607-0.0047607-0.0072021-0.0071411c-0.1972046-0.1932373-0.5137329-0.1900635-0.7069702,0.0071411c-0.1932983,0.1972656-0.1900635,0.5137939,0.0071411,0.7070312l2.8242188,2.8232422C9.9022217,15.4474487,10.02948,15.5001831,10.1621094,15.5c0.1326294,0.0001221,0.2598267-0.0525513,0.3534546-0.1464844l6-6c0.0023804-0.0023804,0.0047607-0.0046997,0.0071411-0.0071411c0.1932373-0.1972046,0.1900635-0.5137329-0.0071411-0.7069702C16.3183594,8.446106,16.0018311,8.4493408,15.8085327,8.6464844z M12,2C6.4771729,2,2,6.4771729,2,12s4.4771729,10,10,10c5.5201416-0.0064697,9.9935303-4.4798584,10-10C22,6.4771729,17.5228271,2,12,2z M12,21c-4.9705811,0-9-4.0294189-9-9s4.0294189-9,9-9c4.9683228,0.0054321,8.9945679,4.0316772,9,9C21,16.9705811,16.9705811,21,12,21z"/></svg>
  247.                                                                     </a>
  248.                                                                     <a class="btn btn-sm btn-outline-secondary border me-2" data-bs-toggle="tooltip" data-bs-original-title="Delete">
  249.                                                                         <svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="16"><path d="M0 0h24v24H0V0z" fill="none" /><path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM8 9h8v10H8V9zm7.5-5l-1-1h-5l-1 1H5v2h14V4h-3.5z" /></svg>
  250.                                                                     </a>
  251.                                                                     <a href="#" class="border br-5 px-2 py-1 d-flex align-items-center" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fe fe-more-vertical"></i></a>
  252.                                                                     <div class="dropdown-menu dropdown-menu-start">
  253.                                                                         <a class="dropdown-item" href="#"><i class="fe fe-edit-2 me-2"></i> Edit</a>
  254.                                                                         <a class="dropdown-item" href="#"><i class="fe fe-info me-2"></i> Info</a>
  255.                                                                     </div>
  256.                                                                 </div>
  257.                                                             </td>
  258.                                                         </tr>
  259.                                                         <tr>
  260.                                                             <td class="text-muted fs-15 fw-semibold text-center">04.</td>
  261.                                                             <td class="text-muted fs-15 fw-semibold"><a href="#" class="text-dark" data-bs-target="#Vertically" data-bs-toggle="modal" >Est sea erat at kasd.</a></td>
  262.                                                             <td class="text-muted fs-15 fw-semibold"><a href="{{ absolute_url(path('app_project_details')) }}" class="text-dark">Noa Dashboard UI</a></td>
  263.                                                             <td class="text-danger fs-15 fw-semibold">04 Nov 21</td>
  264.                                                             <td>
  265.                                                                 <div class="d-flex align-items-center">
  266.                                                                     <div class="me-2">
  267.                                                                         <span class="data-image avatar avatar-md rounded-circle" style="background-image: url(../build/images/users/4.jpg)"></span>
  268.                                                                     </div>
  269.                                                                     <div>
  270.                                                                         <h6 class="mb-0">Olena Tyrell</h6>
  271.                                                                         <span class="text-muted fs-12">member@spruko.com</span>
  272.                                                                     </div>
  273.                                                                 </div>
  274.                                                             </td>
  275.                                                             <td>
  276.                                                                 <div class="form-group mb-0">
  277.                                                                     <ul>
  278.                                                                         <li class="select-status">
  279.                                                                             <select class="form-control select2-status-search" data-placeholder="Select Status">
  280.                                                                                 <option value="IP" selected>In Progress</option>
  281.                                                                                 <option value="OH">On Hold</option>
  282.                                                                                 <option value="CP">Completed</option>
  283.                                                                             </select>
  284.                                                                         </li>
  285.                                                                     </ul>
  286.                                                                 </div>
  287.                                                             </td>
  288.                                                             <td>
  289.                                                                 <div class="d-flex align-items-stretch">
  290.                                                                     <a class="btn btn-sm btn-outline-primary border me-2" data-bs-toggle="tooltip" data-bs-original-title="Mark As Completed">
  291.                                                                         <svg  xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="20" width="16" viewBox="0 0 24 24"><path d="M15.8085327,8.6464844l-5.6464233,5.6464844l-2.4707031-2.4697266c-0.0023804-0.0023804-0.0047607-0.0047607-0.0072021-0.0071411c-0.1972046-0.1932373-0.5137329-0.1900635-0.7069702,0.0071411c-0.1932983,0.1972656-0.1900635,0.5137939,0.0071411,0.7070312l2.8242188,2.8232422C9.9022217,15.4474487,10.02948,15.5001831,10.1621094,15.5c0.1326294,0.0001221,0.2598267-0.0525513,0.3534546-0.1464844l6-6c0.0023804-0.0023804,0.0047607-0.0046997,0.0071411-0.0071411c0.1932373-0.1972046,0.1900635-0.5137329-0.0071411-0.7069702C16.3183594,8.446106,16.0018311,8.4493408,15.8085327,8.6464844z M12,2C6.4771729,2,2,6.4771729,2,12s4.4771729,10,10,10c5.5201416-0.0064697,9.9935303-4.4798584,10-10C22,6.4771729,17.5228271,2,12,2z M12,21c-4.9705811,0-9-4.0294189-9-9s4.0294189-9,9-9c4.9683228,0.0054321,8.9945679,4.0316772,9,9C21,16.9705811,16.9705811,21,12,21z"/></svg>
  292.                                                                     </a>
  293.                                                                     <a class="btn btn-sm btn-outline-secondary border me-2" data-bs-toggle="tooltip" data-bs-original-title="Delete">
  294.                                                                         <svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="16"><path d="M0 0h24v24H0V0z" fill="none" /><path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM8 9h8v10H8V9zm7.5-5l-1-1h-5l-1 1H5v2h14V4h-3.5z" /></svg>
  295.                                                                     </a>
  296.                                                                     <a href="#" class="border br-5 px-2 py-1 d-flex align-items-center" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fe fe-more-vertical"></i></a>
  297.                                                                     <div class="dropdown-menu dropdown-menu-start">
  298.                                                                         <a class="dropdown-item" href="#"><i class="fe fe-edit-2 me-2"></i> Edit</a>
  299.                                                                         <a class="dropdown-item" href="#"><i class="fe fe-info me-2"></i> Info</a>
  300.                                                                     </div>
  301.                                                                 </div>
  302.                                                             </td>
  303.                                                         </tr>
  304.                                                         <tr>
  305.                                                             <td class="text-muted fs-15 fw-semibold text-center">05.</td>
  306.                                                             <td class="text-muted fs-15 fw-semibold"><a href="#" class="text-dark" data-bs-target="#Vertically" data-bs-toggle="modal" >Rebum gubergren at kasd takimata clita.</a></td>
  307.                                                             <td class="text-muted fs-15 fw-semibold"><a href="{{ absolute_url(path('app_project_details')) }}" class="text-dark">Noa Dashboard UI</a></td>
  308.                                                             <td class="text-danger fs-15 fw-semibold">29 Oct 21</td>
  309.                                                             <td>
  310.                                                                 <div class="d-flex align-items-center">
  311.                                                                     <div class="me-2">
  312.                                                                         <span class="data-image avatar avatar-md rounded-circle" style="background-image: url(../build/images/users/5.jpg)"></span>
  313.                                                                     </div>
  314.                                                                     <div>
  315.                                                                         <h6 class="mb-0">Emilie Benett</h6>
  316.                                                                         <span class="text-muted fs-12">member@spruko.com</span>
  317.                                                                     </div>
  318.                                                                 </div>
  319.                                                             </td>
  320.                                                             <td>
  321.                                                                 <div class="form-group mb-0">
  322.                                                                     <ul>
  323.                                                                         <li class="select-status">
  324.                                                                             <select class="form-control select2-status-search" data-placeholder="Select Status">
  325.                                                                                 <option value="IP">In Progress</option>
  326.                                                                                 <option value="OH">On Hold</option>
  327.                                                                                 <option value="CP" selected>Completed</option>
  328.                                                                             </select>
  329.                                                                         </li>
  330.                                                                     </ul>
  331.                                                                 </div>
  332.                                                             </td>
  333.                                                             <td>
  334.                                                                 <div class="d-flex align-items-stretch">
  335.                                                                     <a class="btn btn-sm btn-outline-primary border me-2" data-bs-toggle="tooltip" data-bs-original-title="Mark As Completed">
  336.                                                                         <svg  xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="20" width="16" viewBox="0 0 24 24"><path d="M15.8085327,8.6464844l-5.6464233,5.6464844l-2.4707031-2.4697266c-0.0023804-0.0023804-0.0047607-0.0047607-0.0072021-0.0071411c-0.1972046-0.1932373-0.5137329-0.1900635-0.7069702,0.0071411c-0.1932983,0.1972656-0.1900635,0.5137939,0.0071411,0.7070312l2.8242188,2.8232422C9.9022217,15.4474487,10.02948,15.5001831,10.1621094,15.5c0.1326294,0.0001221,0.2598267-0.0525513,0.3534546-0.1464844l6-6c0.0023804-0.0023804,0.0047607-0.0046997,0.0071411-0.0071411c0.1932373-0.1972046,0.1900635-0.5137329-0.0071411-0.7069702C16.3183594,8.446106,16.0018311,8.4493408,15.8085327,8.6464844z M12,2C6.4771729,2,2,6.4771729,2,12s4.4771729,10,10,10c5.5201416-0.0064697,9.9935303-4.4798584,10-10C22,6.4771729,17.5228271,2,12,2z M12,21c-4.9705811,0-9-4.0294189-9-9s4.0294189-9,9-9c4.9683228,0.0054321,8.9945679,4.0316772,9,9C21,16.9705811,16.9705811,21,12,21z"/></svg>
  337.                                                                     </a>
  338.                                                                     <a class="btn btn-sm btn-outline-secondary border me-2" data-bs-toggle="tooltip" data-bs-original-title="Delete">
  339.                                                                         <svg xmlns="http://www.w3.org/2000/svg" height="20" viewBox="0 0 24 24" width="16"><path d="M0 0h24v24H0V0z" fill="none" /><path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM8 9h8v10H8V9zm7.5-5l-1-1h-5l-1 1H5v2h14V4h-3.5z" /></svg>
  340.                                                                     </a>
  341.                                                                     <a href="#" class="border br-5 px-2 py-1 d-flex align-items-center" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fe fe-more-vertical"></i></a>
  342.                                                                     <div class="dropdown-menu dropdown-menu-start">
  343.                                                                         <a class="dropdown-item" href="#"><i class="fe fe-edit-2 me-2"></i> Edit</a>
  344.                                                                         <a class="dropdown-item" href="#"><i class="fe fe-info me-2"></i> Info</a>
  345.                                                                     </div>
  346.                                                                 </div>
  347.                                                             </td>
  348.                                                         </tr>
  349.                                                     </tbody>
  350.                                                 </table>
  351.                                             </div>
  352.                                         </div>
  353.                                     </div>
  354.                                 </div>
  355.                             </div>
  356.                             <!--ROW CLOSED-->
  357.                             
  358.                             <!--TASK MODAL-->
  359.                             <div class="modal fade" id="Vertically">
  360.                                 <div class="modal-dialog modal-dialog-centered task-view-modal" role="document">
  361.                                     <div class="modal-content modal-content-demo">
  363.                                         <div class="modal-header p-5">
  364.                                             <h4 class="modal-title text-dark">#1. Sit sed takimata sanctus invidunt</h4><button aria-label="Close" class="btn-close" data-bs-dismiss="modal" type="button"><span aria-hidden="true">&times;</span></button>
  365.                                         </div>
  367.                                         <div class="modal-body">
  368.                                             <div class="row">
  369.                                                 <div class="col-md-12 d-flex mb-4">
  370.                                                     <p class="m-0 wp-30 text-muted">Project Name</p>
  371.                                                     <p class="m-0 wp-70 text-dark">Noa Dashboard UI</p>
  372.                                                 </div>
  373.                                                 <div class="col-md-12 d-flex mb-4">
  374.                                                     <p class="m-0 wp-30 text-muted">Assigned To</p>
  375.                                                     <div class="m-0 wp-70 text-dark d-flex align-items-center">
  376.                                                         <div class="me-2">
  377.                                                             <img alt="User Avatar" class="rounded-circle avatar-sm" src="../build/images/users/7.jpg">
  378.                                                         </div>
  379.                                                         <div>
  380.                                                             <p class="mb-1">Daniel Obrien</p>
  381.                                                         </div>
  382.                                                     </div>
  383.                                                 </div>
  384.                                                 <div class="col-md-12 d-flex mb-4">
  385.                                                     <p class="m-0 wp-30 text-muted">Start Date</p>
  386.                                                     <p class="m-0 wp-70 text-dark">30-10-2021</p>
  387.                                                 </div>
  388.                                                 <div class="col-md-12 d-flex mb-4">
  389.                                                     <p class="m-0 wp-30 text-muted">Status</p>
  390.                                                     <div class="m-0 wp-70 text-dark">
  391.                                                         <span class="mb-0 mt-1 status-main in-progress">In Progress</span>
  392.                                                     </div>
  393.                                                 </div>
  394.                                                 <div class="col-md-12 d-flex mb-4">
  395.                                                     <p class="m-0 wp-30 text-muted">End Date</p>
  396.                                                     <p class="m-0 wp-70 text-dark">---</p>
  397.                                                 </div>
  398.                                                 <div class="col-md-12 d-flex mb-4">
  399.                                                     <p class="m-0 wp-30 text-muted">Description</p>
  400.                                                     <p class="m-0 wp-70 text-dark">Kasd dolore lorem eos stet at, dolor ipsum elitr sea amet amet stet justo, sed.</p>
  401.                                                 </div>
  402.                                             </div>
  403.                                         </div>
  405.                                         <div class="modal-footer p-0 border-top-0">
  407.                                             <!-- Tabs -->
  408.                                             <div class="tabs-menu4 w-100">
  409.                                                 <nav class="nav border-bottom px-4 d-block d-lg-flex flex-2">
  410.                                                     <a class="nav-link border border-bottom-0 py-1 br-5 mx-1 mx-md-1 active" data-bs-toggle="tab" href="#task-files">
  411.                                                         Files
  412.                                                     </a>
  413.                                                     <a class="nav-link border border-bottom-0 py-1 br-5 mx-1 mx-md-1" data-bs-toggle="tab" href="#task-subtask">
  414.                                                         Sub Task
  415.                                                     </a>
  416.                                                     <a class="nav-link border border-bottom-0 py-1 br-5 mx-1 mx-md-1" data-bs-toggle="tab" href="#task-tracktime">
  417.                                                         Track Time
  418.                                                     </a>
  419.                                                     <a class="nav-link border border-bottom-0 py-1 br-5 mx-1 mx-md-1" data-bs-toggle="tab" href="#task-comments">
  420.                                                         Comments
  421.                                                     </a>
  422.                                                 </nav>
  423.                                             </div><!-- /Tabs -->
  425.                                             <div class="tab-content w-100">
  426.                                                 <div class="tab-pane active task-files-tab" id="task-files">
  427.                                                     <div class="row">
  428.                                                         <div class="file-upload-text">
  429.                                                             <input type="file" id="task-file-input" multiple>
  430.                                                             <label for="task-file-input" class="text-primary">
  431.                                                                 <svg xmlns="http://www.w3.org/2000/svg" class="w-inner-icn text-primary" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path d="M16,11.5h-3.5V8c0-0.276123-0.223877-0.5-0.5-0.5S11.5,7.723877,11.5,8v3.5H8c-0.276123,0-0.5,0.223877-0.5,0.5s0.223877,0.5,0.5,0.5h3.5v3.5005493C11.5001831,16.2765503,11.723999,16.5001831,12,16.5h0.0006104C12.2765503,16.4998169,12.5001831,16.276001,12.5,16v-3.5H16c0.276123,0,0.5-0.223877,0.5-0.5S16.276123,11.5,16,11.5z M12,2C6.4771729,2,2,6.4771729,2,12s4.4771729,10,10,10c5.5202026-0.0062866,9.9937134-4.4797974,10-10C22,6.4771729,17.5228271,2,12,2z M12,21c-4.9705811,0-9-4.0294189-9-9s4.0294189-9,9-9c4.9682617,0.0056152,8.9943848,4.0317383,9,9C21,16.9705811,16.9705811,21,12,21z"/></svg>
  432.                                                                 Upload Files
  433.                                                                 <span class="text-muted"></span>
  434.                                                             </label>
  435.                                                             <i class="fa fa-times-circle remove"></i>
  436.                                                         </div>
  437.                                                     </div>
  438.                                                     <div class="row">
  439.                                                         <div class="mt-3">
  440.                                                             <table class="table table-bordered br-7">
  441.                                                                 <thead>
  442.                                                                     <tr class="row-first">
  443.                                                                         <th>File Name</th>
  444.                                                                         <th>Date</th>
  445.                                                                         <th>Type</th>
  446.                                                                         <th>Size</th>
  447.                                                                     </tr>
  448.                                                                 </thead>
  449.                                                                 <tbody>
  450.                                                                     <tr>
  451.                                                                         <td>
  452.                                                                             <div class="recent-files">
  453.                                                                                 <svg class="file-manager-icon w-icn me-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#b6dfff" d="M20,8.99969l-7-7H7a3,3,0,0,0-3,3v14a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3Z"/><path fill="#86cbff" d="M20 8.99969H15a2 2 0 0 1-2-2v-5zM19 22a.99974.99974 0 0 1-1-1V19a1 1 0 0 1 2 0v2A.99974.99974 0 0 1 19 22zM19 17a1.03391 1.03391 0 0 1-.71-.29.99108.99108 0 0 1-.21045-1.08984A1.14883 1.14883 0 0 1 18.29 15.29a1.02673 1.02673 0 0 1 .32959-.21.91433.91433 0 0 1 .76025 0 1.03418 1.03418 0 0 1 .33008.21 1.15772 1.15772 0 0 1 .21.33008A.98919.98919 0 0 1 19.71 16.71a1.15384 1.15384 0 0 1-.33008.21A.9994.9994 0 0 1 19 17zM15 18H9a1 1 0 0 1 0-2h6a1 1 0 0 1 0 2zM15 14H9a1 1 0 0 1 0-2h6a1 1 0 0 1 0 2zM10 10H9A1 1 0 0 1 9 8h1a1 1 0 0 1 0 2z"/></svg>
  454.                                                                                 <span class="mb-1 font-weight-semibold">noa documentation</span>
  455.                                                                             </div>
  456.                                                                         </td>
  457.                                                                         <td>
  458.                                                                             <span class="text-muted modified-date">07/10/21, 03:30</span>
  459.                                                                         </td>
  460.                                                                         <td>
  461.                                                                             <span>doc</span>
  462.                                                                         </td>
  463.                                                                         <td>
  464.                                                                             <span class="text-muted file-size">15kb</span>
  465.                                                                         </td>
  466.                                                                     </tr>
  467.                                                                     <tr>
  468.                                                                         <td>
  469.                                                                             <div class="recent-files">
  470.                                                                                 <svg class="file-manager-icon w-icn me-2" xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path fill="#f2c8db" d="M14,18H5c-1.65611-0.00181-2.99819-1.34389-3-3V9c0.00181-1.65611,1.34389-2.99819,3-3h9c1.65611,0.00181,2.99819,1.34389,3,3v6C16.99819,16.65611,15.65611,17.99819,14,18z"/><path fill="#eaa4c4" d="M21.89465,7.55359c-0.24683-0.49432-0.8476-0.69495-1.34192-0.44812l-3.56421,1.7821C16.98999,8.92572,16.99994,8.96149,17,9v6c-0.00006,0.03851-0.01001,0.07428-0.01147,0.11243l3.56421,1.7821C20.69165,16.96381,20.84479,16.99994,21,17c0.55212-0.00037,0.99969-0.44788,1-1V8C21.99994,7.84503,21.96387,7.6922,21.89465,7.55359z"/></svg>
  472.                                                                                 <span class="mb-1 font-weight-semibold">sample video</span>
  473.                                                                             </div>
  474.                                                                         </td>
  475.                                                                         <td>
  476.                                                                             <span class="text-muted modified-date">07/10/21, 03:30</span>
  477.                                                                         </td>
  478.                                                                         <td>
  479.                                                                             <span>mp4</span>
  480.                                                                         </td>
  481.                                                                         <td>
  482.                                                                             <span class="text-muted file-size">30mb</span>
  483.                                                                         </td>
  484.                                                                     </tr>
  485.                                                                     <tr class="row-last">
  486.                                                                         <td>
  487.                                                                             <div class="recent-files">
  488.                                                                                 <svg class="file-manager-icon w-icn me-2"  xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path fill="#c8e4a6" d="M13.5,9C12.67157,9,12,8.32843,12,7.5S12.67157,6,13.5,6S15,6.67157,15,7.5C14.9991,8.32805,14.32805,8.9991,13.5,9z"/><path fill="#add679" d="M19,2H5C3.34515,2.00483,2.00483,3.34515,2,5v8.86l3.88-3.88c1.18747-1.13,3.05253-1.13,4.24,0l2.87139,2.887l0.88752-0.88751c1.17344-1.16662,3.06874-1.16662,4.24218,0L22,15.8584V5C21.99517,3.34515,20.65485,2.00483,19,2z M13.5,9C12.67157,9,12,8.32843,12,7.5S12.67157,6,13.5,6S15,6.67157,15,7.5C14.9991,8.32805,14.32805,8.9991,13.5,9z"/><path fill="#77bc21" d="M10.12,9.98c-1.18747-1.13-3.05253-1.13-4.24,0L2,13.86V19c0.00484,1.65484,1.34516,2.99516,3,3h14c0.81512-0.00034,1.59497-0.3325,2.16-0.92L10.12,9.98z"/><path fill="#c8e4a6" d="M22,15.8584l-3.87891-3.87891c-1.17345-1.1666-3.06873-1.1666-4.24218,0L12.99139,12.867l8.16425,8.20856C21.69776,20.5208,22.00089,19.77567,22,19V15.8584z"/></svg>
  489.                                                                                 <span class="mb-1 font-weight-semibold">sample image</span>
  490.                                                                             </div>
  491.                                                                         </td>
  492.                                                                         <td>
  493.                                                                             <span class="text-muted modified-date">07/10/21, 03:30</span>
  494.                                                                         </td>
  495.                                                                         <td>
  496.                                                                             <span>jpeg</span>
  497.                                                                         </td>
  498.                                                                         <td>
  499.                                                                             <span class="text-muted file-size">15kb</span>
  500.                                                                         </td>
  501.                                                                     </tr>
  502.                                                                 </tbody>
  503.                                                             </table>
  504.                                                         </div>
  505.                                                     </div>
  506.                                                 </div>
  508.                                                 <div class="tab-pane" id="task-subtask">
  509.                                                     <div class="row">
  510.                                                         <div class="col-md-12">
  511.                                                             <div class="d-flex add-task-container">
  512.                                                                 <input type="text" class="form-control wp-40 subtask-input" placeholder="Type Task Here..." id="subTaskInput">
  513.                                                                 <a href="javascript:void(0)" role="button" class="text-teritary text-center ms-2 me-2" id="addTask">
  514.                                                                     <svg xmlns="http://www.w3.org/2000/svg" class="w-inner-icn text-teritary" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path d="M16,11.5h-3.5V8c0-0.276123-0.223877-0.5-0.5-0.5S11.5,7.723877,11.5,8v3.5H8c-0.276123,0-0.5,0.223877-0.5,0.5s0.223877,0.5,0.5,0.5h3.5v3.5005493C11.5001831,16.2765503,11.723999,16.5001831,12,16.5h0.0006104C12.2765503,16.4998169,12.5001831,16.276001,12.5,16v-3.5H16c0.276123,0,0.5-0.223877,0.5-0.5S16.276123,11.5,16,11.5z M12,2C6.4771729,2,2,6.4771729,2,12s4.4771729,10,10,10c5.5202026-0.0062866,9.9937134-4.4797974,10-10C22,6.4771729,17.5228271,2,12,2z M12,21c-4.9705811,0-9-4.0294189-9-9s4.0294189-9,9-9c4.9682617,0.0056152,8.9943848,4.0317383,9,9C21,16.9705811,16.9705811,21,12,21z"/></svg>
  515.                                                                     Add
  516.                                                                 </a>
  517.                                                                 <a href="javascript:void(0)" role="button" class="text-primary text-center ms-2" id="completedAll">
  518.                                                                     <svg xmlns="http://www.w3.org/2000/svg" class="w-inner-icn text-primary" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path d="M15.8085327,8.6464844l-5.6464233,5.6464844l-2.4707031-2.4697266c-0.0023804-0.0023804-0.0047607-0.0047607-0.0072021-0.0071411c-0.1972046-0.1932373-0.5137329-0.1900635-0.7069702,0.0071411c-0.1932983,0.1972656-0.1900635,0.5137939,0.0071411,0.7070312l2.8242188,2.8232422C9.9022217,15.4474487,10.02948,15.5001831,10.1621094,15.5c0.1326294,0.0001221,0.2598267-0.0525513,0.3534546-0.1464844l6-6c0.0023804-0.0023804,0.0047607-0.0046997,0.0071411-0.0071411c0.1932373-0.1972046,0.1900635-0.5137329-0.0071411-0.7069702C16.3183594,8.446106,16.0018311,8.4493408,15.8085327,8.6464844z M12,2C6.4771729,2,2,6.4771729,2,12s4.4771729,10,10,10c5.5201416-0.0064697,9.9935303-4.4798584,10-10C22,6.4771729,17.5228271,2,12,2z M12,21c-4.9705811,0-9-4.0294189-9-9s4.0294189-9,9-9c4.9683228,0.0054321,8.9945679,4.0316772,9,9C21,16.9705811,16.9705811,21,12,21z"/></svg>
  519.                                                                     Mark All
  520.                                                                 </a>
  521.                                                             </div>
  522.                                                             <label for="subTaskInput" class="w-100 d-block text-danger" id="errorNote"></label>
  523.                                                         </div>
  524.                                                     </div>
  525.                                                     <div class="row">
  526.                                                         <div class="col-md-12 mt-3">
  527.                                                             <ul class="sub-list-container">
  528.                                                                 <li class="sub-list-item task-completed">
  529.                                                                     <div class="sub-list-main">
  530.                                                                         <div class="check-btn"></div>
  531.                                                                         <span class="sub-list-text text-muted" onclick="taskCompleted(event)">Gubergren vero nonumy vero no.</span>
  532.                                                                     </div>
  533.                                                                     <i class="fe fe-trash delete-main text-muted"></i>
  534.                                                                 </li>
  535.                                                                 <li class="sub-list-item">
  536.                                                                     <div class="sub-list-main">
  537.                                                                         <div class="check-btn"></div>
  538.                                                                         <span class="sub-list-text text-muted" onclick="taskCompleted(event)">Duo no elitr diam labore sit invidunt. Magna gubergren erat.</span>
  539.                                                                     </div>
  540.                                                                     <i class="fe fe-trash delete-main text-muted"></i>
  541.                                                                 </li>
  542.                                                                 <li class="sub-list-item">
  543.                                                                     <div class="sub-list-main">
  544.                                                                         <div class="check-btn"></div>
  545.                                                                         <span class="sub-list-text text-muted" onclick="taskCompleted(event)">Consetetur clita diam est eos invidunt. Eirmod magna.</span>
  546.                                                                     </div>
  547.                                                                     <i class="fe fe-trash delete-main text-muted"></i>
  548.                                                                 </li>
  549.                                                             </ul>
  550.                                                         </div>
  551.                                                     </div>
  552.                                                     <div class="row">
  553.                                                         <div class="col-md-12 text-end mt-3">
  554.                                                             <a href="javascript:void(0)" role="button" class="text-danger" id="deleteAllTasks">
  555.                                                                 <svg xmlns="http://www.w3.org/2000/svg" class="w-inner-icn text-danger" enable-background="new 0 0 24 24" viewBox="0 0 24 24"><path d="M16,11.5h-3.5V8c0-0.276123-0.223877-0.5-0.5-0.5S11.5,7.723877,11.5,8v3.5H8c-0.276123,0-0.5,0.223877-0.5,0.5s0.223877,0.5,0.5,0.5h3.5v3.5005493C11.5001831,16.2765503,11.723999,16.5001831,12,16.5h0.0006104C12.2765503,16.4998169,12.5001831,16.276001,12.5,16v-3.5H16c0.276123,0,0.5-0.223877,0.5-0.5S16.276123,11.5,16,11.5z M12,2C6.4771729,2,2,6.4771729,2,12s4.4771729,10,10,10c5.5202026-0.0062866,9.9937134-4.4797974,10-10C22,6.4771729,17.5228271,2,12,2z M12,21c-4.9705811,0-9-4.0294189-9-9s4.0294189-9,9-9c4.9682617,0.0056152,8.9943848,4.0317383,9,9C21,16.9705811,16.9705811,21,12,21z"/></svg>
  556.                                                                 Delete All
  557.                                                             </a>
  558.                                                         </div>
  559.                                                     </div>
  560.                                                 </div>
  562.                                                 <div class="tab-pane" id="task-tracktime">
  563.                                                     <div class="row">
  564.                                                         <table class="table table-bordered">
  565.                                                             <thead>
  566.                                                                 <tr class="row-first">
  567.                                                                     <th class="bg-transparent border-bottom-0">Team Member</th>
  568.                                                                     <th class="bg-transparent border-bottom-0">Start Date & Time</th>
  569.                                                                     <th class="bg-transparent border-bottom-0">End Date & Time</th>
  570.                                                                     <th class="bg-transparent border-bottom-0">Total Time</th>
  571.                                                                 </tr>
  572.                                                             </thead>
  573.                                                             <tbody>
  574.                                                                 <tr>
  575.                                                                     <td>
  576.                                                                         <div class="d-flex align-items-center">
  577.                                                                             <div class="me-2">
  578.                                                                                 <img alt="User Avatar" class="rounded-circle avatar-md" src="../build/images/users/8.jpg">
  579.                                                                             </div>
  580.                                                                             <div>
  581.                                                                                 <h6 class="mb-1">Skyler Hilda</h6>
  582.                                                                                 <span class="text-muted fs-12">member@spruko.com</span>
  583.                                                                             </div>
  584.                                                                         </div>
  585.                                                                     </td>
  586.                                                                     <td class="text-muted fs-13 fw-semibold">31 Oct 21 & 14:56</td>
  587.                                                                     <td class="text-muted fs-13 fw-semibold">01 Nov 21 & 09:35</td>
  588.                                                                     <td class="text-dark fs-13 fw-semibold">Days: 4<br>Hours: 10<br>Minutes: 22</td>
  589.                                                                 </tr>
  590.                                                                 <tr>
  591.                                                                     <td>
  592.                                                                         <div class="d-flex align-items-center">
  593.                                                                             <div class="me-2">
  594.                                                                                 <img alt="User Avatar" class="rounded-circle avatar-md" src="../build/images/users/2.jpg">
  595.                                                                             </div>
  596.                                                                             <div>
  597.                                                                                 <h6 class="mb-1">Lisa Morgan</h6>
  598.                                                                                 <span class="text-muted fs-12">member@spruko.com</span>
  599.                                                                             </div>
  600.                                                                         </div>
  601.                                                                     </td>
  602.                                                                     <td class="text-muted fs-13 fw-semibold">30 Oct 21 & 12:56</td>
  603.                                                                     <td class="text-muted fs-13 fw-semibold">11 Nov 21 & 09:35</td>
  604.                                                                     <td class="text-dark fs-13 fw-semibold">Days: 15<br>Hours: 12<br>Minutes: 52</td>
  605.                                                                 </tr>
  606.                                                                 <tr>
  607.                                                                     <td>
  608.                                                                         <div class="d-flex align-items-center">
  609.                                                                             <div class="me-2">
  610.                                                                                 <img alt="User Avatar" class="rounded-circle avatar-md" src="../build/images/users/11.jpg">
  611.                                                                             </div>
  612.                                                                             <div>
  613.                                                                                 <h6 class="mb-1">Tyler Durder</h6>
  614.                                                                                 <span class="text-muted fs-12">member@spruko.com</span>
  615.                                                                             </div>
  616.                                                                         </div>
  617.                                                                     </td>
  618.                                                                     <td class="text-muted fs-13 fw-semibold">15 Oct 21 & 15:56</td>
  619.                                                                     <td class="text-muted fs-13 fw-semibold">01 Nov 21 & 16:40</td>
  620.                                                                     <td class="text-dark fs-13 fw-semibold">Days: 18<br>Hours: 8<br>Minutes: 52</td>
  621.                                                                 </tr>
  622.                                                                 <tr class="row-last">
  623.                                                                     <td>
  624.                                                                         <div class="d-flex align-items-center">
  625.                                                                             <div class="me-2">
  626.                                                                                 <img alt="User Avatar" class="rounded-circle avatar-lg" src="../build/images/users/14.jpg">
  627.                                                                             </div>
  628.                                                                             <div>
  629.                                                                                 <h6 class="mb-1">Jorah Randy</h6>
  630.                                                                                 <span class="text-muted fs-12">member@spruko.com</span>
  631.                                                                             </div>
  632.                                                                         </div>
  633.                                                                     </td>
  634.                                                                     <td class="text-muted fs-13 fw-semibold">18 Oct 21 & 10:30</td>
  635.                                                                     <td class="text-muted fs-13 fw-semibold">09 Nov 21 & 09:45</td>
  636.                                                                     <td class="text-dark fs-13 fw-semibold">Days: 22<br>Hours: 10<br>Minutes: 12</td>
  637.                                                                 </tr>
  638.                                                             </tbody>
  639.                                                         </table>
  640.                                                     </div>
  641.                                                 </div>
  643.                                                 <div class="tab-pane" id="task-comments">
  644.                                                     <div class="row">
  645.                                                         <div class="mt-5">
  646.                                                             <div class="media mb-5 overflow-visible">
  647.                                                                 <div class="me-3">
  648.                                                                     <a href="profile.html"> <img class="media-object rounded-circle thumb-sm" alt="64x64" src="../build/images/users/5.jpg"> </a>
  649.                                                                 </div>
  650.                                                                 <div class="media-body overflow-visible">
  651.                                                                     <div class="border mb-5 p-4 br-5">
  652.                                                                         <nav class="nav float-end">
  653.                                                                             <div class="dropdown">
  654.                                                                                 <a class="nav-link text-muted fs-16 p-0 ps-4" href="javascript:;" data-bs-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fe fe-more-vertical"></i></a>
  655.                                                                                 <div class="dropdown-menu dropdown-menu-start">
  656.                                                                                     <a class="dropdown-item" href="#"><i class="fe fe-edit me-1"></i> Edit</a>
  657.                                                                                     <a class="dropdown-item" href="#"><i class="fe fe-corner-up-left me-1"></i> Reply</a>
  658.                                                                                     <a class="dropdown-item" href="#"><i class="fe fe-flag me-1"></i> Report Abuse</a>
  659.                                                                                     <a class="dropdown-item" href="#"><i class="fe fe-trash-2 me-1"></i> Delete</a>
  660.                                                                                 </div>
  661.                                                                             </div>
  662.                                                                         </nav>
  663.                                                                         <h5 class="mt-0">Gavin Murray <span class="text-muted fs-12 ms-1">1 Day ago</span></h5>
  664.                                                                         <span><i class="fe fe-thumb-up text-danger"></i></span>
  665.                                                                         <p class="font-13 text-muted">Lorem ipsum dolor sit amet, quis Neque porro quisquam est, nostrud exercitation ullamco laboris commodo consequat. There’s an old maxim that states, “No fun for the writer, no fun for the reader.”No matter
  666.                                                                             what industry you’re working in, as a blogger, you should live and die by this statement.</p>
  667.                                                                         <a class="like" href="javascript:;">
  668.                                                                             <span class="badge btn-danger-light rounded-pill py-2 px-3">
  669.                                                                                 <i class="fe fe-heart me-1"></i>56</span>
  670.                                                                         </a>
  671.                                                                         <span class="reply" id="1">
  672.                                                                             <a href="javascript:;"><span class="badge btn-info-light rounded-pill py-2 px-3"><i class="fe fe-corner-up-left me-1"></i>Reply</span></a>
  673.                                                                         </span>
  674.                                                                     </div>
  675.                                                                     <div class="media mb-5 overflow-visible">
  676.                                                                         <div class="me-3">
  677.                                                                             <a href="profile.html"> <img class="media-object rounded-circle thumb-sm" alt="64x64" src="../build/images/users/2.jpg"> </a>
  678.                                                                         </div>
  679.                                                                         <div class="media-body border p-4 overflow-visible br-5">
  680.                                                                             <nav class="nav float-end">
  681.                                                                                 <div class="dropdown">
  682.                                                                                     <a class="nav-link text-muted fs-16 p-0 ps-4" href="javascript:;" data-bs-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fe fe-more-vertical"></i></a>
  683.                                                                                     <div class="dropdown-menu dropdown-menu-end start">
  684.                                                                                         <a class="dropdown-item" href="#"><i class="fe fe-edit me-1"></i> Edit</a>
  685.                                                                                         <a class="dropdown-item" href="#"><i class="fe fe-corner-up-left me-1"></i> Reply</a>
  686.                                                                                         <a class="dropdown-item" href="#"><i class="fe fe-flag me-1"></i> Report Abuse</a>
  687.                                                                                         <a class="dropdown-item" href="#"><i class="fe fe-trash-2 me-1"></i> Delete</a>
  688.                                                                                     </div>
  689.                                                                                 </div>
  690.                                                                             </nav>
  691.                                                                             <h5 class="mt-0">Mozelle Belt <span class="text-muted fs-12 ms-1 bg-normal-light">Reply to Gavin Murray</span><span class="text-muted fs-12 ms-1">2 min ago</span></h5>
  692.                                                                             <span><i class="fe fe-thumb-up text-danger"></i></span>
  693.                                                                             <p class="font-13 text-muted">Nostrud exercitation ullamco laboris commodo consequat. There’s an old maxim that states, “No fun for the writer, no fun for the reader.”No matter what industry you’re working in, as a blogger, you should
  694.                                                                                 live and die by this statement.</p>
  695.                                                                             <a class="like" href="javascript:;"><span class="badge btn-danger-light rounded-pill py-2 px-3"><i class="fe fe-heart me-1"></i>56</span></a>
  696.                                                                             <span class="reply" id="2">
  697.                                                                                 <a href="javascript:;"><span class="badge btn-info-light rounded-pill py-2 px-3"><i class="fe fe-corner-up-left me-1"></i>Reply</span></a>
  698.                                                                             </span>
  699.                                                                         </div>
  700.                                                                     </div>
  701.                                                                 </div>
  702.                                                             </div>
  703.                                                         </div>
  704.                                                     </div>
  705.                                                 </div>
  706.                                             </div>
  707.                                         </div>
  708.                                     </div>
  709.                                 </div>
  710.                             </div><!--TASK MODAL ENDS-->
  712. {% endblock %}
  714. {% block javascripts %}
  715.    {{parent()}}
  716.         <!-- INTERNAL Data tables js-->
  717.         <script src="{{absolute_url(asset('build/plugins/datatable/js/jquery.dataTables.min.js'))}}"></script>
  718.         <script src="{{absolute_url(asset('build/plugins/datatable/js/dataTables.bootstrap5.js'))}}"></script>
  719.         <script src="{{absolute_url(asset('build/plugins/datatable/dataTables.responsive.min.js'))}}"></script>
  721.         <!-- SELECT2 JS -->
  722.         <script src="{{absolute_url(asset('build/plugins/select2/select2.full.min.js'))}}"></script>
  724.         <!-- TASKS LIST JS-->
  725.         {{ encore_entry_script_tags('js/tasks-list') }}
  726. {% endblock %}