mirror of https://github.com/ColorlibHQ/gentelella
responsive tables experiment ~ need a second opinion
razvanaldea89
parent
4f284007e3
commit
2084f14fd2
|
|
@ -4868,3 +4868,65 @@ ul.notifications {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Experiment for responsive tables - from https://codepen.io/AllThingsSmitty/pen/MyqmdM */
|
||||||
|
@media screen and (max-width: 600px) {
|
||||||
|
table.responsive-experimental {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.responsive-experimental caption {
|
||||||
|
font-size: 1.3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.responsive-experimental thead {
|
||||||
|
border: none;
|
||||||
|
clip: rect(0 0 0 0);
|
||||||
|
height: 1px;
|
||||||
|
margin: -1px;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 0;
|
||||||
|
position: absolute;
|
||||||
|
width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.responsive-experimental tr {
|
||||||
|
border-bottom: 3px solid #ddd;
|
||||||
|
display: block;
|
||||||
|
margin-bottom: .625em;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.responsive-experimental td {
|
||||||
|
border-bottom: 1px solid #ddd;
|
||||||
|
display: block;
|
||||||
|
font-size: .8em;
|
||||||
|
text-align: right;
|
||||||
|
clear:both;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.responsive-experimental td::before {
|
||||||
|
/*
|
||||||
|
* aria-label has no advantage, it won't be read inside a table
|
||||||
|
content: attr(aria-label);
|
||||||
|
*/
|
||||||
|
content: attr(data-label);
|
||||||
|
float: left;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size:13px;
|
||||||
|
width: 30%;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.responsive-experimental td:last-child {
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.responsive-experimental ul {
|
||||||
|
float:right;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.responsive-experimental .td-wrapper {
|
||||||
|
width:70%;
|
||||||
|
float:right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -332,7 +332,7 @@
|
||||||
<p>Simple table with project listing with progress and editing options</p>
|
<p>Simple table with project listing with progress and editing options</p>
|
||||||
|
|
||||||
<!-- start project list -->
|
<!-- start project list -->
|
||||||
<table class="table table-striped projects">
|
<table class="table table-striped projects responsive-experimental">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th style="width: 1%">#</th>
|
<th style="width: 1%">#</th>
|
||||||
|
|
@ -345,369 +345,488 @@
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
<td>#</td>
|
<td data-label="#">#</td>
|
||||||
<td>
|
<td data-label="Project Name" class="clearfix">
|
||||||
|
<div class="td-wraper">
|
||||||
<a>Pesamakini Backend UI</a>
|
<a>Pesamakini Backend UI</a>
|
||||||
<br/>
|
<br/>
|
||||||
<small>Created 01.01.2015</small>
|
<small>Created 01.01.2015</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Team Members" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="project_progress">
|
<td class="project_progress clearfix" data-label="Project Progress">
|
||||||
|
<div class="td-wrapper">
|
||||||
<div class="progress progress_sm">
|
<div class="progress progress_sm">
|
||||||
<div class="progress-bar bg-green" role="progressbar"
|
<div class="progress-bar bg-green" role="progressbar"
|
||||||
data-transitiongoal="57"></div>
|
data-transitiongoal="57"></div>
|
||||||
</div>
|
</div>
|
||||||
<small>57% Complete</small>
|
<small>57% Complete</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Status" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<button type="button" class="btn btn-success btn-xs">Success
|
<button type="button" class="btn btn-success btn-xs">Success
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Edit" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a href="#" class="btn btn-primary btn-xs"><i
|
<a href="#" class="btn btn-primary btn-xs"><i
|
||||||
class="fa fa-folder"></i> View </a>
|
class="fa fa-folder"></i> View </a>
|
||||||
<a href="#" class="btn btn-info btn-xs"><i
|
<a href="#" class="btn btn-info btn-xs"><i
|
||||||
class="fa fa-pencil"></i> Edit </a>
|
class="fa fa-pencil"></i> Edit </a>
|
||||||
<a href="#" class="btn btn-danger btn-xs"><i
|
<a href="#" class="btn btn-danger btn-xs"><i
|
||||||
class="fa fa-trash-o"></i> Delete </a>
|
class="fa fa-trash-o"></i> Delete </a>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>#</td>
|
<td data-label="#">#</td>
|
||||||
<td>
|
<td data-label="Project Name" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a>Pesamakini Backend UI</a>
|
<a>Pesamakini Backend UI</a>
|
||||||
<br/>
|
<br/>
|
||||||
<small>Created 01.01.2015</small>
|
<small>Created 01.01.2015</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Team Members" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="project_progress">
|
<td class="project_progress clearfix" data-label="Project Progress">
|
||||||
|
<div class="td-wrapper">
|
||||||
<div class="progress progress_sm">
|
<div class="progress progress_sm">
|
||||||
<div class="progress-bar bg-green" role="progressbar"
|
<div class="progress-bar bg-green" role="progressbar"
|
||||||
data-transitiongoal="47"></div>
|
data-transitiongoal="47"></div>
|
||||||
</div>
|
</div>
|
||||||
<small>47% Complete</small>
|
<small>47% Complete</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Status" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<button type="button" class="btn btn-success btn-xs">Success
|
<button type="button" class="btn btn-success btn-xs">Success
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Edit" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a href="#" class="btn btn-primary btn-xs"><i
|
<a href="#" class="btn btn-primary btn-xs"><i
|
||||||
class="fa fa-folder"></i> View </a>
|
class="fa fa-folder"></i> View </a>
|
||||||
<a href="#" class="btn btn-info btn-xs"><i
|
<a href="#" class="btn btn-info btn-xs"><i
|
||||||
class="fa fa-pencil"></i> Edit </a>
|
class="fa fa-pencil"></i> Edit </a>
|
||||||
<a href="#" class="btn btn-danger btn-xs"><i
|
<a href="#" class="btn btn-danger btn-xs"><i
|
||||||
class="fa fa-trash-o"></i> Delete </a>
|
class="fa fa-trash-o"></i> Delete </a>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>#</td>
|
<td data-label="#">#</td>
|
||||||
<td>
|
<td data-label="Project Name" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a>Pesamakini Backend UI</a>
|
<a>Pesamakini Backend UI</a>
|
||||||
<br/>
|
<br/>
|
||||||
<small>Created 01.01.2015</small>
|
<small>Created 01.01.2015</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-abel="Team Members" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="project_progress">
|
<td class="project_progress clearfix" da ta-label="Project Progress">
|
||||||
|
<div class="td-wrapper">
|
||||||
<div class="progress progress_sm">
|
<div class="progress progress_sm">
|
||||||
<div class="progress-bar bg-green" role="progressbar"
|
<div class="progress-bar bg-green" role="progressbar"
|
||||||
data-transitiongoal="77"></div>
|
data-transitiongoal="77"></div>
|
||||||
</div>
|
</div>
|
||||||
<small>77% Complete</small>
|
<small>77% Complete</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Status" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<button type="button" class="btn btn-success btn-xs">Success
|
<button type="button" class="btn btn-success btn-xs">Success
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Edit" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a href="#" class="btn btn-primary btn-xs"><i
|
<a href="#" class="btn btn-primary btn-xs"><i
|
||||||
class="fa fa-folder"></i> View </a>
|
class="fa fa-folder"></i> View </a>
|
||||||
<a href="#" class="btn btn-info btn-xs"><i
|
<a href="#" class="btn btn-info btn-xs"><i
|
||||||
class="fa fa-pencil"></i> Edit </a>
|
class="fa fa-pencil"></i> Edit </a>
|
||||||
<a href="#" class="btn btn-danger btn-xs"><i
|
<a href="#" class="btn btn-danger btn-xs"><i
|
||||||
class="fa fa-trash-o"></i> Delete </a>
|
class="fa fa-trash-o"></i> Delete </a>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>#</td>
|
<td data-label="#">#</td>
|
||||||
<td>
|
<td data-label="Project Name" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a>Pesamakini Backend UI</a>
|
<a>Pesamakini Backend UI</a>
|
||||||
<br/>
|
<br/>
|
||||||
<small>Created 01.01.2015</small>
|
<small>Created 01.01.2015</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Team Members" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="project_progress">
|
<td class="project_progress clearfix" data-label="Project Progress">
|
||||||
|
<div class="td-wrapper">
|
||||||
<div class="progress progress_sm">
|
<div class="progress progress_sm">
|
||||||
<div class="progress-bar bg-green" role="progressbar"
|
<div class="progress-bar bg-green" role="progressbar"
|
||||||
data-transitiongoal="60"></div>
|
data-transitiongoal="60"></div>
|
||||||
</div>
|
</div>
|
||||||
<small>60% Complete</small>
|
<small>60% Complete</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Status" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<button type="button" class="btn btn-success btn-xs">Success
|
<button type="button" class="btn btn-success btn-xs">Success
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Edit" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a href="#" class="btn btn-primary btn-xs"><i
|
<a href="#" class="btn btn-primary btn-xs"><i
|
||||||
class="fa fa-folder"></i> View </a>
|
class="fa fa-folder"></i> View </a>
|
||||||
<a href="#" class="btn btn-info btn-xs"><i
|
<a href="#" class="btn btn-info btn-xs"><i
|
||||||
class="fa fa-pencil"></i> Edit </a>
|
class="fa fa-pencil"></i> Edit </a>
|
||||||
<a href="#" class="btn btn-danger btn-xs"><i
|
<a href="#" class="btn btn-danger btn-xs"><i
|
||||||
class="fa fa-trash-o"></i> Delete </a>
|
class="fa fa-trash-o"></i> Delete </a>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>#</td>
|
<td data-label="#">#</td>
|
||||||
<td>
|
<td data-label="Project Name" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a>Pesamakini Backend UI</a>
|
<a>Pesamakini Backend UI</a>
|
||||||
<br/>
|
<br/>
|
||||||
<small>Created 01.01.2015</small>
|
<small>Created 01.01.2015</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Team Members" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="project_progress">
|
<td class="project_progress clearfix" data-label="Project Progress">
|
||||||
|
<div class="td-wrapper">
|
||||||
<div class="progress progress_sm">
|
<div class="progress progress_sm">
|
||||||
<div class="progress-bar bg-green" role="progressbar"
|
<div class="progress-bar bg-green" role="progressbar"
|
||||||
data-transitiongoal="12"></div>
|
data-transitiongoal="12"></div>
|
||||||
</div>
|
</div>
|
||||||
<small>12% Complete</small>
|
<small>12% Complete</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Status" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<button type="button" class="btn btn-success btn-xs">Success
|
<button type="button" class="btn btn-success btn-xs">Success
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Edit" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a href="#" class="btn btn-primary btn-xs"><i
|
<a href="#" class="btn btn-primary btn-xs"><i
|
||||||
class="fa fa-folder"></i> View </a>
|
class="fa fa-folder"></i> View </a>
|
||||||
<a href="#" class="btn btn-info btn-xs"><i
|
<a href="#" class="btn btn-info btn-xs"><i
|
||||||
class="fa fa-pencil"></i> Edit </a>
|
class="fa fa-pencil"></i> Edit </a>
|
||||||
<a href="#" class="btn btn-danger btn-xs"><i
|
<a href="#" class="btn btn-danger btn-xs"><i
|
||||||
class="fa fa-trash-o"></i> Delete </a>
|
class="fa fa-trash-o"></i> Delete </a>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>#</td>
|
<td data-label="#">#</td>
|
||||||
<td>
|
<td data-label="Project Name" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a>Pesamakini Backend UI</a>
|
<a>Pesamakini Backend UI</a>
|
||||||
<br/>
|
<br/>
|
||||||
<small>Created 01.01.2015</small>
|
<small>Created 01.01.2015</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Team Members" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="project_progress">
|
<td class="project_progress clearfix" data-label="Project Progress">
|
||||||
|
<div class="td-wrapper">
|
||||||
<div class="progress progress_sm">
|
<div class="progress progress_sm">
|
||||||
<div class="progress-bar bg-green" role="progressbar"
|
<div class="progress-bar bg-green" role="progressbar"
|
||||||
data-transitiongoal="35"></div>
|
data-transitiongoal="35"></div>
|
||||||
</div>
|
</div>
|
||||||
<small>35% Complete</small>
|
<small>35% Complete</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Status" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<button type="button" class="btn btn-success btn-xs">Success
|
<button type="button" class="btn btn-success btn-xs">Success
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Edit" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a href="#" class="btn btn-primary btn-xs"><i
|
<a href="#" class="btn btn-primary btn-xs"><i
|
||||||
class="fa fa-folder"></i> View </a>
|
class="fa fa-folder"></i> View </a>
|
||||||
<a href="#" class="btn btn-info btn-xs"><i
|
<a href="#" class="btn btn-info btn-xs"><i
|
||||||
class="fa fa-pencil"></i> Edit </a>
|
class="fa fa-pencil"></i> Edit </a>
|
||||||
<a href="#" class="btn btn-danger btn-xs"><i
|
<a href="#" class="btn btn-danger btn-xs"><i
|
||||||
class="fa fa-trash-o"></i> Delete </a>
|
class="fa fa-trash-o"></i> Delete </a>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>#</td>
|
<td data-label="#">#</td>
|
||||||
<td>
|
<td data-label="Project Name" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a>Pesamakini Backend UI</a>
|
<a>Pesamakini Backend UI</a>
|
||||||
<br/>
|
<br/>
|
||||||
<small>Created 01.01.2015</small>
|
<small>Created 01.01.2015</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Team Members" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="project_progress">
|
<td class="project_progress clearfix" data-label="Project Progress">
|
||||||
|
<div class="td-wrapper">
|
||||||
<div class="progress progress_sm">
|
<div class="progress progress_sm">
|
||||||
<div class="progress-bar bg-green" role="progressbar"
|
<div class="progress-bar bg-green" role="progressbar"
|
||||||
data-transitiongoal="87"></div>
|
data-transitiongoal="87"></div>
|
||||||
</div>
|
</div>
|
||||||
<small>87% Complete</small>
|
<small>87% Complete</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Status" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<button type="button" class="btn btn-success btn-xs">Success
|
<button type="button" class="btn btn-success btn-xs">Success
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Edit" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a href="#" class="btn btn-primary btn-xs"><i
|
<a href="#" class="btn btn-primary btn-xs"><i
|
||||||
class="fa fa-folder"></i> View </a>
|
class="fa fa-folder"></i> View </a>
|
||||||
<a href="#" class="btn btn-info btn-xs"><i
|
<a href="#" class="btn btn-info btn-xs"><i
|
||||||
class="fa fa-pencil"></i> Edit </a>
|
class="fa fa-pencil"></i> Edit </a>
|
||||||
<a href="#" class="btn btn-danger btn-xs"><i
|
<a href="#" class="btn btn-danger btn-xs"><i
|
||||||
class="fa fa-trash-o"></i> Delete </a>
|
class="fa fa-trash-o"></i> Delete </a>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>#</td>
|
<td data-label="#">#</td>
|
||||||
<td>
|
<td data-label="Project Name" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a>Pesamakini Backend UI</a>
|
<a>Pesamakini Backend UI</a>
|
||||||
<br/>
|
<br/>
|
||||||
<small>Created 01.01.2015</small>
|
<small>Created 01.01.2015</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Team Members" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="project_progress">
|
<td class="project_progress clearfix" data-label="Project Progress">
|
||||||
|
<div class="td-wrapper">
|
||||||
<div class="progress progress_sm">
|
<div class="progress progress_sm">
|
||||||
<div class="progress-bar bg-green" role="progressbar"
|
<div class="progress-bar bg-green" role="progressbar"
|
||||||
data-transitiongoal="77"></div>
|
data-transitiongoal="77"></div>
|
||||||
</div>
|
</div>
|
||||||
<small>77% Complete</small>
|
<small>77% Complete</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Status" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<button type="button" class="btn btn-success btn-xs">Success
|
<button type="button" class="btn btn-success btn-xs">Success
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Edit" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a href="#" class="btn btn-primary btn-xs"><i
|
<a href="#" class="btn btn-primary btn-xs"><i
|
||||||
class="fa fa-folder"></i> View </a>
|
class="fa fa-folder"></i> View </a>
|
||||||
<a href="#" class="btn btn-info btn-xs"><i
|
<a href="#" class="btn btn-info btn-xs"><i
|
||||||
class="fa fa-pencil"></i> Edit </a>
|
class="fa fa-pencil"></i> Edit </a>
|
||||||
<a href="#" class="btn btn-danger btn-xs"><i
|
<a href="#" class="btn btn-danger btn-xs"><i
|
||||||
class="fa fa-trash-o"></i> Delete </a>
|
class="fa fa-trash-o"></i> Delete </a>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>#</td>
|
<td data-label="#">#</td>
|
||||||
<td>
|
<td data-label="Project Name" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a>Pesamakini Backend UI</a>
|
<a>Pesamakini Backend UI</a>
|
||||||
<br/>
|
<br/>
|
||||||
<small>Created 01.01.2015</small>
|
<small>Created 01.01.2015</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Team Members" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<ul class="list-inline">
|
<ul class="list-inline">
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<img src="images/user.png" class="avatar" alt="Avatar">
|
<img src="images/user.png" class="avatar"
|
||||||
|
alt="Avatar">
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="project_progress">
|
<td class="project_progress clearfix" data-label="Project Progress">
|
||||||
|
<div class="td-wrapper">
|
||||||
<div class="progress progress_sm">
|
<div class="progress progress_sm">
|
||||||
<div class="progress-bar bg-green" role="progressbar"
|
<div class="progress-bar bg-green" role="progressbar"
|
||||||
data-transitiongoal="77"></div>
|
data-transitiongoal="77"></div>
|
||||||
</div>
|
</div>
|
||||||
<small>77% Complete</small>
|
<small>77% Complete</small>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Status" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<button type="button" class="btn btn-success btn-xs">Success
|
<button type="button" class="btn btn-success btn-xs">Success
|
||||||
</button>
|
</button>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td data-label="Edit" class="clearfix">
|
||||||
|
<div class="td-wrapper">
|
||||||
<a href="#" class="btn btn-primary btn-xs"><i
|
<a href="#" class="btn btn-primary btn-xs"><i
|
||||||
class="fa fa-folder"></i> View </a>
|
class="fa fa-folder"></i> View </a>
|
||||||
<a href="#" class="btn btn-info btn-xs"><i
|
<a href="#" class="btn btn-info btn-xs"><i
|
||||||
class="fa fa-pencil"></i> Edit </a>
|
class="fa fa-pencil"></i> Edit </a>
|
||||||
<a href="#" class="btn btn-danger btn-xs"><i
|
<a href="#" class="btn btn-danger btn-xs"><i
|
||||||
class="fa fa-trash-o"></i> Delete </a>
|
class="fa fa-trash-o"></i> Delete </a>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue