Fecino
/
Inspinia
Suivre 3
Favoriser 0
Bifurcation 0
Code Tickets 0 Demandes d'ajout 0 Versions 0 Wiki Activité
Theme Inspinia
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.
1 Commit
1 Branche
Aborescence: cded54dbee
Branches Tags
${ item.name }
Créer la branche ${ searchTerm }
de 'cded54dbee'
${ noResults }
Inspinia/projects.html

projects.html 44KB
Historique Brut

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743 
  1. <!DOCTYPE html>

  2. <html>

  3. 

  4. <head>

  5. 

  6.     <meta charset="utf-8">

  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">

  8. 

  9.     <title>INSPINIA | Projects list</title>

  10. 

  11.     <link href="css/bootstrap.min.css" rel="stylesheet">

  12.     <link href="font-awesome/css/font-awesome.css" rel="stylesheet">

  13. 

  14.     <link href="css/animate.css" rel="stylesheet">

  15.     <link href="css/style.css" rel="stylesheet">

  16. 

  17. </head>

  18. 

  19. <body>

  20. 

  21.     <div id="wrapper">

  22. 

  23.     <nav class="navbar-default navbar-static-side" role="navigation">

  24.         <div class="sidebar-collapse">

  25.             <ul class="nav metismenu" id="side-menu">

  26.                 <li class="nav-header">

  27.                     <div class="dropdown profile-element"> <span>

  28.                             <img alt="image" class="img-circle" src="img/profile_small.jpg" />

  29.                              </span>

  30.                         <a data-toggle="dropdown" class="dropdown-toggle" href="#">

  31.                             <span class="clear"> <span class="block m-t-xs"> <strong class="font-bold">David Williams</strong>

  32.                              </span> <span class="text-muted text-xs block">Art Director <b class="caret"></b></span> </span> </a>

  33.                         <ul class="dropdown-menu animated fadeInRight m-t-xs">

  34.                             <li><a href="profile.html">Profile</a></li>

  35.                             <li><a href="contacts.html">Contacts</a></li>

  36.                             <li><a href="mailbox.html">Mailbox</a></li>

  37.                             <li class="divider"></li>

  38.                             <li><a href="login.html">Logout</a></li>

  39.                         </ul>

  40.                     </div>

  41.                     <div class="logo-element">

  42.                         IN+

  43.                     </div>

  44.                 </li>

  45.                 <li>

  46.                     <a href="index.html"><i class="fa fa-th-large"></i> <span class="nav-label">Dashboards</span> <span class="fa arrow"></span></a>

  47.                     <ul class="nav nav-second-level collapse">

  48.                         <li><a href="index.html">Dashboard v.1</a></li>

  49.                         <li><a href="dashboard_2.html">Dashboard v.2</a></li>

  50.                         <li><a href="dashboard_3.html">Dashboard v.3</a></li>

  51.                         <li><a href="dashboard_4_1.html">Dashboard v.4</a></li>

  52.                         <li><a href="dashboard_5.html">Dashboard v.5 <span class="label label-primary pull-right">NEW</span></a></li>

  53.                     </ul>

  54.                 </li>

  55.                 <li>

  56.                     <a href="layouts.html"><i class="fa fa-diamond"></i> <span class="nav-label">Layouts</span></a>

  57.                 </li>

  58.                 <li>

  59.                     <a href="#"><i class="fa fa-bar-chart-o"></i> <span class="nav-label">Graphs</span><span class="fa arrow"></span></a>

  60.                     <ul class="nav nav-second-level collapse">

  61.                         <li><a href="graph_flot.html">Flot Charts</a></li>

  62.                         <li><a href="graph_morris.html">Morris.js Charts</a></li>

  63.                         <li><a href="graph_rickshaw.html">Rickshaw Charts</a></li>

  64.                         <li><a href="graph_chartjs.html">Chart.js</a></li>

  65.                         <li><a href="graph_chartist.html">Chartist</a></li>

  66.                         <li><a href="c3.html">c3 charts</a></li>

  67.                         <li><a href="graph_peity.html">Peity Charts</a></li>

  68.                         <li><a href="graph_sparkline.html">Sparkline Charts</a></li>

  69.                     </ul>

  70.                 </li>

  71.                 <li>

  72.                     <a href="mailbox.html"><i class="fa fa-envelope"></i> <span class="nav-label">Mailbox </span><span class="label label-warning pull-right">16/24</span></a>

  73.                     <ul class="nav nav-second-level collapse">

  74.                         <li><a href="mailbox.html">Inbox</a></li>

  75.                         <li><a href="mail_detail.html">Email view</a></li>

  76.                         <li><a href="mail_compose.html">Compose email</a></li>

  77.                         <li><a href="email_template.html">Email templates</a></li>

  78.                     </ul>

  79.                 </li>

  80.                 <li>

  81.                     <a href="metrics.html"><i class="fa fa-pie-chart"></i> <span class="nav-label">Metrics</span>  </a>

  82.                 </li>

  83.                 <li>

  84.                     <a href="widgets.html"><i class="fa fa-flask"></i> <span class="nav-label">Widgets</span></a>

  85.                 </li>

  86.                 <li>

  87.                     <a href="#"><i class="fa fa-edit"></i> <span class="nav-label">Forms</span><span class="fa arrow"></span></a>

  88.                     <ul class="nav nav-second-level collapse">

  89.                         <li><a href="form_basic.html">Basic form</a></li>

  90.                         <li><a href="form_advanced.html">Advanced Plugins</a></li>

  91.                         <li><a href="form_wizard.html">Wizard</a></li>

  92.                         <li><a href="form_file_upload.html">File Upload</a></li>

  93.                         <li><a href="form_editors.html">Text Editor</a></li>

  94.                         <li><a href="form_markdown.html">Markdown</a></li>

  95.                     </ul>

  96.                 </li>

  97.                 <li class="active">

  98.                     <a href="#"><i class="fa fa-desktop"></i> <span class="nav-label">App Views</span>  <span class="pull-right label label-primary">SPECIAL</span></a>

  99.                     <ul class="nav nav-second-level">

  100.                         <li><a href="contacts.html">Contacts</a></li>

  101.                         <li><a href="profile.html">Profile</a></li>

  102.                         <li><a href="profile_2.html">Profile v.2</a></li>

  103.                         <li><a href="contacts_2.html">Contacts v.2</a></li>

  104.                         <li class="active"><a href="projects.html">Projects</a></li>

  105.                         <li><a href="project_detail.html">Project detail</a></li>

  106.                         <li><a href="teams_board.html">Teams board</a></li>

  107.                         <li><a href="social_feed.html">Social feed</a></li>

  108.                         <li><a href="clients.html">Clients</a></li>

  109.                         <li><a href="full_height.html">Outlook view</a></li>

  110.                         <li><a href="vote_list.html">Vote list</a></li>

  111.                         <li><a href="file_manager.html">File manager</a></li>

  112.                         <li><a href="calendar.html">Calendar</a></li>

  113.                         <li><a href="issue_tracker.html">Issue tracker</a></li>

  114.                         <li><a href="blog.html">Blog</a></li>

  115.                         <li><a href="article.html">Article</a></li>

  116.                         <li><a href="faq.html">FAQ</a></li>

  117.                         <li><a href="timeline.html">Timeline</a></li>

  118.                         <li><a href="pin_board.html">Pin board</a></li>

  119.                     </ul>

  120.                 </li>

  121.                 <li>

  122.                     <a href="#"><i class="fa fa-files-o"></i> <span class="nav-label">Other Pages</span><span class="fa arrow"></span></a>

  123.                     <ul class="nav nav-second-level collapse">

  124.                         <li><a href="search_results.html">Search results</a></li>

  125.                         <li><a href="lockscreen.html">Lockscreen</a></li>

  126.                         <li><a href="invoice.html">Invoice</a></li>

  127.                         <li><a href="login.html">Login</a></li>

  128.                         <li><a href="login_two_columns.html">Login v.2</a></li>

  129.                         <li><a href="forgot_password.html">Forget password</a></li>

  130.                         <li><a href="register.html">Register</a></li>

  131.                         <li><a href="404.html">404 Page</a></li>

  132.                         <li><a href="500.html">500 Page</a></li>

  133.                         <li><a href="empty_page.html">Empty page</a></li>

  134.                     </ul>

  135.                 </li>

  136.                 <li>

  137.                     <a href="#"><i class="fa fa-globe"></i> <span class="nav-label">Miscellaneous</span><span class="label label-info pull-right">NEW</span></a>

  138.                     <ul class="nav nav-second-level collapse">

  139.                         <li><a href="toastr_notifications.html">Notification</a></li>

  140.                         <li><a href="nestable_list.html">Nestable list</a></li>

  141.                         <li><a href="agile_board.html">Agile board</a></li>

  142.                         <li><a href="timeline_2.html">Timeline v.2</a></li>

  143.                         <li><a href="diff.html">Diff</a></li>

  144.                         <li><a href="i18support.html">i18 support</a></li>

  145.                         <li><a href="sweetalert.html">Sweet alert</a></li>

  146.                         <li><a href="idle_timer.html">Idle timer</a></li>

  147.                         <li><a href="truncate.html">Truncate</a></li>

  148.                         <li><a href="spinners.html">Spinners</a></li>

  149.                         <li><a href="tinycon.html">Live favicon</a></li>

  150.                         <li><a href="google_maps.html">Google maps</a></li>

  151.                         <li><a href="code_editor.html">Code editor</a></li>

  152.                         <li><a href="modal_window.html">Modal window</a></li>

  153.                         <li><a href="clipboard.html">Clipboard</a></li>

  154.                         <li><a href="forum_main.html">Forum view</a></li>

  155.                         <li><a href="validation.html">Validation</a></li>

  156.                         <li><a href="tree_view.html">Tree view</a></li>

  157.                         <li><a href="loading_buttons.html">Loading buttons</a></li>

  158.                         <li><a href="chat_view.html">Chat view</a></li>

  159.                         <li><a href="masonry.html">Masonry</a></li>

  160.                         <li><a href="tour.html">Tour</a></li>

  161.                     </ul>

  162.                 </li>

  163.                 <li>

  164.                     <a href="#"><i class="fa fa-flask"></i> <span class="nav-label">UI Elements</span><span class="fa arrow"></span></a>

  165.                     <ul class="nav nav-second-level collapse">

  166.                         <li><a href="typography.html">Typography</a></li>

  167.                         <li><a href="icons.html">Icons</a></li>

  168.                         <li><a href="draggable_panels.html">Draggable Panels</a></li> <li><a href="resizeable_panels.html">Resizeable Panels</a></li>

  169.                         <li><a href="buttons.html">Buttons</a></li>

  170.                         <li><a href="video.html">Video</a></li>

  171.                         <li><a href="tabs_panels.html">Panels</a></li>

  172.                         <li><a href="tabs.html">Tabs</a></li>

  173.                         <li><a href="notifications.html">Notifications & Tooltips</a></li>

  174.                         <li><a href="badges_labels.html">Badges, Labels, Progress</a></li>

  175.                     </ul>

  176.                 </li>

  177. 

  178.                 <li>

  179.                     <a href="grid_options.html"><i class="fa fa-laptop"></i> <span class="nav-label">Grid options</span></a>

  180.                 </li>

  181.                 <li>

  182.                     <a href="#"><i class="fa fa-table"></i> <span class="nav-label">Tables</span><span class="fa arrow"></span></a>

  183.                     <ul class="nav nav-second-level collapse">

  184.                         <li><a href="table_basic.html">Static Tables</a></li>

  185.                         <li><a href="table_data_tables.html">Data Tables</a></li>

  186.                         <li><a href="table_foo_table.html">Foo Tables</a></li>

  187.                         <li><a href="jq_grid.html">jqGrid</a></li>

  188.                     </ul>

  189.                 </li>

  190.                 <li>

  191.                     <a href="#"><i class="fa fa-shopping-cart"></i> <span class="nav-label">E-commerce</span><span class="fa arrow"></span></a>

  192.                     <ul class="nav nav-second-level collapse">

  193.                         <li><a href="ecommerce_products_grid.html">Products grid</a></li>

  194.                         <li><a href="ecommerce_product_list.html">Products list</a></li>

  195.                         <li><a href="ecommerce_product.html">Product edit</a></li>

  196.                         <li><a href="ecommerce_product_detail.html">Product detail</a></li>

  197.                         <li><a href="ecommerce-cart.html">Cart</a></li>

  198.                         <li><a href="ecommerce-orders.html">Orders</a></li>

  199.                         <li><a href="ecommerce_payments.html">Credit Card form</a></li>

  200.                     </ul>

  201.                 </li>

  202.                 <li>

  203.                     <a href="#"><i class="fa fa-picture-o"></i> <span class="nav-label">Gallery</span><span class="fa arrow"></span></a>

  204.                     <ul class="nav nav-second-level collapse">

  205.                         <li><a href="basic_gallery.html">Lightbox Gallery</a></li>

  206.                         <li><a href="slick_carousel.html">Slick Carousel</a></li>

  207.                         <li><a href="carousel.html">Bootstrap Carousel</a></li>

  208. 

  209.                     </ul>

  210.                 </li>

  211.                 <li>

  212.                     <a href="#"><i class="fa fa-sitemap"></i> <span class="nav-label">Menu Levels </span><span class="fa arrow"></span></a>

  213.                     <ul class="nav nav-second-level collapse">

  214.                         <li>

  215.                             <a href="#">Third Level <span class="fa arrow"></span></a>

  216.                             <ul class="nav nav-third-level">

  217.                                 <li>

  218.                                     <a href="#">Third Level Item</a>

  219.                                 </li>

  220.                                 <li>

  221.                                     <a href="#">Third Level Item</a>

  222.                                 </li>

  223.                                 <li>

  224.                                     <a href="#">Third Level Item</a>

  225.                                 </li>

  226. 

  227.                             </ul>

  228.                         </li>

  229.                         <li><a href="#">Second Level Item</a></li>

  230.                         <li>

  231.                             <a href="#">Second Level Item</a></li>

  232.                         <li>

  233.                             <a href="#">Second Level Item</a></li>

  234.                     </ul>

  235.                 </li>

  236.                 <li>

  237.                     <a href="css_animation.html"><i class="fa fa-magic"></i> <span class="nav-label">CSS Animations </span><span class="label label-info pull-right">62</span></a>

  238.                 </li>

  239.                 <li class="landing_link">

  240.                     <a target="_blank" href="landing.html"><i class="fa fa-star"></i> <span class="nav-label">Landing Page</span> <span class="label label-warning pull-right">NEW</span></a>

  241.                 </li>

  242.                 <li class="special_link">

  243.                     <a href="package.html"><i class="fa fa-database"></i> <span class="nav-label">Package</span></a>

  244.                 </li>

  245.             </ul>

  246. 

  247.         </div>

  248.     </nav>

  249. 

  250.         <div id="page-wrapper" class="gray-bg">

  251.         <div class="row border-bottom">

  252.         <nav class="navbar navbar-static-top  " role="navigation" style="margin-bottom: 0">

  253.         <div class="navbar-header">

  254.             <a class="navbar-minimalize minimalize-styl-2 btn btn-primary " href="#"><i class="fa fa-bars"></i> </a>

  255.             <form role="search" class="navbar-form-custom" action="search_results.html">

  256.                 <div class="form-group">

  257.                     <input type="text" placeholder="Search for something..." class="form-control" name="top-search" id="top-search">

  258.                 </div>

  259.             </form>

  260.         </div>

  261.             <ul class="nav navbar-top-links navbar-right">

  262.                 <li>

  263.                     <span class="m-r-sm text-muted welcome-message">Welcome to INSPINIA+ Admin Theme.</span>

  264.                 </li>

  265.                 <li class="dropdown">

  266.                     <a class="dropdown-toggle count-info" data-toggle="dropdown" href="#">

  267.                         <i class="fa fa-envelope"></i>  <span class="label label-warning">16</span>

  268.                     </a>

  269.                     <ul class="dropdown-menu dropdown-messages">

  270.                         <li>

  271.                             <div class="dropdown-messages-box">

  272.                                 <a href="profile.html" class="pull-left">

  273.                                     <img alt="image" class="img-circle" src="img/a7.jpg">

  274.                                 </a>

  275.                                 <div class="media-body">

  276.                                     <small class="pull-right">46h ago</small>

  277.                                     <strong>Mike Loreipsum</strong> started following <strong>Monica Smith</strong>. <br>

  278.                                     <small class="text-muted">3 days ago at 7:58 pm - 10.06.2014</small>

  279.                                 </div>

  280.                             </div>

  281.                         </li>

  282.                         <li class="divider"></li>

  283.                         <li>

  284.                             <div class="dropdown-messages-box">

  285.                                 <a href="profile.html" class="pull-left">

  286.                                     <img alt="image" class="img-circle" src="img/a4.jpg">

  287.                                 </a>

  288.                                 <div class="media-body ">

  289.                                     <small class="pull-right text-navy">5h ago</small>

  290.                                     <strong>Chris Johnatan Overtunk</strong> started following <strong>Monica Smith</strong>. <br>

  291.                                     <small class="text-muted">Yesterday 1:21 pm - 11.06.2014</small>

  292.                                 </div>

  293.                             </div>

  294.                         </li>

  295.                         <li class="divider"></li>

  296.                         <li>

  297.                             <div class="dropdown-messages-box">

  298.                                 <a href="profile.html" class="pull-left">

  299.                                     <img alt="image" class="img-circle" src="img/profile.jpg">

  300.                                 </a>

  301.                                 <div class="media-body ">

  302.                                     <small class="pull-right">23h ago</small>

  303.                                     <strong>Monica Smith</strong> love <strong>Kim Smith</strong>. <br>

  304.                                     <small class="text-muted">2 days ago at 2:30 am - 11.06.2014</small>

  305.                                 </div>

  306.                             </div>

  307.                         </li>

  308.                         <li class="divider"></li>

  309.                         <li>

  310.                             <div class="text-center link-block">

  311.                                 <a href="mailbox.html">

  312.                                     <i class="fa fa-envelope"></i> <strong>Read All Messages</strong>

  313.                                 </a>

  314.                             </div>

  315.                         </li>

  316.                     </ul>

  317.                 </li>

  318.                 <li class="dropdown">

  319.                     <a class="dropdown-toggle count-info" data-toggle="dropdown" href="#">

  320.                         <i class="fa fa-bell"></i>  <span class="label label-primary">8</span>

  321.                     </a>

  322.                     <ul class="dropdown-menu dropdown-alerts">

  323.                         <li>

  324.                             <a href="mailbox.html">

  325.                                 <div>

  326.                                     <i class="fa fa-envelope fa-fw"></i> You have 16 messages

  327.                                     <span class="pull-right text-muted small">4 minutes ago</span>

  328.                                 </div>

  329.                             </a>

  330.                         </li>

  331.                         <li class="divider"></li>

  332.                         <li>

  333.                             <a href="profile.html">

  334.                                 <div>

  335.                                     <i class="fa fa-twitter fa-fw"></i> 3 New Followers

  336.                                     <span class="pull-right text-muted small">12 minutes ago</span>

  337.                                 </div>

  338.                             </a>

  339.                         </li>

  340.                         <li class="divider"></li>

  341.                         <li>

  342.                             <a href="grid_options.html">

  343.                                 <div>

  344.                                     <i class="fa fa-upload fa-fw"></i> Server Rebooted

  345.                                     <span class="pull-right text-muted small">4 minutes ago</span>

  346.                                 </div>

  347.                             </a>

  348.                         </li>

  349.                         <li class="divider"></li>

  350.                         <li>

  351.                             <div class="text-center link-block">

  352.                                 <a href="notifications.html">

  353.                                     <strong>See All Alerts</strong>

  354.                                     <i class="fa fa-angle-right"></i>

  355.                                 </a>

  356.                             </div>

  357.                         </li>

  358.                     </ul>

  359.                 </li>

  360. 

  361. 

  362.                 <li>

  363.                     <a href="login.html">

  364.                         <i class="fa fa-sign-out"></i> Log out

  365.                     </a>

  366.                 </li>

  367.             </ul>

  368. 

  369.         </nav>

  370.         </div>

  371.             <div class="row wrapper border-bottom white-bg page-heading">

  372.                 <div class="col-sm-4">

  373.                     <h2>Project list</h2>

  374.                     <ol class="breadcrumb">

  375.                         <li>

  376.                             <a href="index.html">Home</a>

  377.                         </li>

  378.                         <li class="active">

  379.                             <strong>Project list</strong>

  380.                         </li>

  381.                     </ol>

  382.                 </div>

  383.             </div>

  384.         <div class="row">

  385.             <div class="col-lg-12">

  386.                 <div class="wrapper wrapper-content animated fadeInUp">

  387. 

  388.                     <div class="ibox">

  389.                         <div class="ibox-title">

  390.                             <h5>All projects assigned to this account</h5>

  391.                             <div class="ibox-tools">

  392.                                 <a href="" class="btn btn-primary btn-xs">Create new project</a>

  393.                             </div>

  394.                         </div>

  395.                         <div class="ibox-content">

  396.                             <div class="row m-b-sm m-t-sm">

  397.                                 <div class="col-md-1">

  398.                                     <button type="button" id="loading-example-btn" class="btn btn-white btn-sm" ><i class="fa fa-refresh"></i> Refresh</button>

  399.                                 </div>

  400.                                 <div class="col-md-11">

  401.                                     <div class="input-group"><input type="text" placeholder="Search" class="input-sm form-control"> <span class="input-group-btn">

  402.                                         <button type="button" class="btn btn-sm btn-primary"> Go!</button> </span></div>

  403.                                 </div>

  404.                             </div>

  405. 

  406.                             <div class="project-list">

  407. 

  408.                                 <table class="table table-hover">

  409.                                     <tbody>

  410.                                     <tr>

  411.                                         <td class="project-status">

  412.                                             <span class="label label-primary">Active</span>

  413.                                         </td>

  414.                                         <td class="project-title">

  415.                                             <a href="project_detail.html">Contract with Zender Company</a>

  416.                                             <br/>

  417.                                             <small>Created 14.08.2014</small>

  418.                                         </td>

  419.                                         <td class="project-completion">

  420.                                                 <small>Completion with: 48%</small>

  421.                                                 <div class="progress progress-mini">

  422.                                                     <div style="width: 48%;" class="progress-bar"></div>

  423.                                                 </div>

  424.                                         </td>

  425.                                         <td class="project-people">

  426.                                             <a href=""><img alt="image" class="img-circle" src="img/a3.jpg"></a>

  427.                                             <a href=""><img alt="image" class="img-circle" src="img/a1.jpg"></a>

  428.                                             <a href=""><img alt="image" class="img-circle" src="img/a2.jpg"></a>

  429.                                             <a href=""><img alt="image" class="img-circle" src="img/a4.jpg"></a>

  430.                                             <a href=""><img alt="image" class="img-circle" src="img/a5.jpg"></a>

  431.                                         </td>

  432.                                         <td class="project-actions">

  433.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  434.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  435.                                         </td>

  436.                                     </tr>

  437.                                     <tr>

  438.                                         <td class="project-status">

  439.                                             <span class="label label-primary">Active</span>

  440.                                         </td>

  441.                                         <td class="project-title">

  442.                                             <a href="project_detail.html">There are many variations of passages</a>

  443.                                             <br/>

  444.                                             <small>Created 11.08.2014</small>

  445.                                         </td>

  446.                                         <td class="project-completion">

  447.                                             <small>Completion with: 28%</small>

  448.                                             <div class="progress progress-mini">

  449.                                                 <div style="width: 28%;" class="progress-bar"></div>

  450.                                             </div>

  451.                                         </td>

  452.                                         <td class="project-people">

  453.                                             <a href=""><img alt="image" class="img-circle" src="img/a7.jpg"></a>

  454.                                             <a href=""><img alt="image" class="img-circle" src="img/a6.jpg"></a>

  455.                                             <a href=""><img alt="image" class="img-circle" src="img/a3.jpg"></a>

  456.                                         </td>

  457.                                         <td class="project-actions">

  458.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  459.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  460.                                         </td>

  461.                                     </tr>

  462.                                     <tr>

  463.                                         <td class="project-status">

  464.                                             <span class="label label-default">Unactive</span>

  465.                                         </td>

  466.                                         <td class="project-title">

  467.                                             <a href="project_detail.html">Many desktop publishing packages and web</a>

  468.                                             <br/>

  469.                                             <small>Created 10.08.2014</small>

  470.                                         </td>

  471.                                         <td class="project-completion">

  472.                                             <small>Completion with: 8%</small>

  473.                                             <div class="progress progress-mini">

  474.                                                 <div style="width: 8%;" class="progress-bar"></div>

  475.                                             </div>

  476.                                         </td>

  477.                                         <td class="project-people">

  478.                                             <a href=""><img alt="image" class="img-circle" src="img/a5.jpg"></a>

  479.                                             <a href=""><img alt="image" class="img-circle" src="img/a3.jpg"></a>

  480.                                         </td>

  481.                                         <td class="project-actions">

  482.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  483.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  484.                                         </td>

  485.                                     </tr>

  486.                                     <tr>

  487.                                         <td class="project-status">

  488.                                             <span class="label label-primary">Active</span>

  489.                                         </td>

  490.                                         <td class="project-title">

  491.                                             <a href="project_detail.html">Letraset sheets containing</a>

  492.                                             <br/>

  493.                                             <small>Created 22.07.2014</small>

  494.                                         </td>

  495.                                         <td class="project-completion">

  496.                                             <small>Completion with: 83%</small>

  497.                                             <div class="progress progress-mini">

  498.                                                 <div style="width: 83%;" class="progress-bar"></div>

  499.                                             </div>

  500.                                         </td>

  501.                                         <td class="project-people">

  502.                                             <a href=""><img alt="image" class="img-circle" src="img/a2.jpg"></a>

  503.                                             <a href=""><img alt="image" class="img-circle" src="img/a3.jpg"></a>

  504.                                             <a href=""><img alt="image" class="img-circle" src="img/a1.jpg"></a>

  505.                                             <a href=""><img alt="image" class="img-circle" src="img/a7.jpg"></a>

  506.                                         </td>

  507.                                         <td class="project-actions">

  508.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  509.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  510.                                         </td>

  511.                                     </tr>

  512.                                     <tr>

  513.                                         <td class="project-status">

  514.                                             <span class="label label-primary">Active</span>

  515.                                         </td>

  516.                                         <td class="project-title">

  517.                                             <a href="project_detail.html">Contrary to popular belief</a>

  518.                                             <br/>

  519.                                             <small>Created 14.07.2014</small>

  520.                                         </td>

  521.                                         <td class="project-completion">

  522.                                             <small>Completion with: 97%</small>

  523.                                             <div class="progress progress-mini">

  524.                                                 <div style="width: 97%;" class="progress-bar"></div>

  525.                                             </div>

  526.                                         </td>

  527.                                         <td class="project-people">

  528.                                             <a href=""><img alt="image" class="img-circle" src="img/a4.jpg"></a>

  529.                                         </td>

  530.                                         <td class="project-actions">

  531.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  532.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  533.                                         </td>

  534.                                     </tr>

  535.                                     <tr>

  536.                                         <td class="project-status">

  537.                                             <span class="label label-primary">Active</span>

  538.                                         </td>

  539.                                         <td class="project-title">

  540.                                             <a href="project_detail.html">Contract with Zender Company</a>

  541.                                             <br/>

  542.                                             <small>Created 14.08.2014</small>

  543.                                         </td>

  544.                                         <td class="project-completion">

  545.                                             <small>Completion with: 48%</small>

  546.                                             <div class="progress progress-mini">

  547.                                                 <div style="width: 48%;" class="progress-bar"></div>

  548.                                             </div>

  549.                                         </td>

  550.                                         <td class="project-people">

  551.                                             <a href=""><img alt="image" class="img-circle" src="img/a1.jpg"></a>

  552.                                             <a href=""><img alt="image" class="img-circle" src="img/a2.jpg"></a>

  553.                                             <a href=""><img alt="image" class="img-circle" src="img/a4.jpg"></a>

  554.                                             <a href=""><img alt="image" class="img-circle" src="img/a5.jpg"></a>

  555.                                         </td>

  556.                                         <td class="project-actions">

  557.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  558.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  559.                                         </td>

  560.                                     </tr>

  561.                                     <tr>

  562.                                         <td class="project-status">

  563.                                             <span class="label label-primary">Active</span>

  564.                                         </td>

  565.                                         <td class="project-title">

  566.                                             <a href="project_detail.html">There are many variations of passages</a>

  567.                                             <br/>

  568.                                             <small>Created 11.08.2014</small>

  569.                                         </td>

  570.                                         <td class="project-completion">

  571.                                             <small>Completion with: 28%</small>

  572.                                             <div class="progress progress-mini">

  573.                                                 <div style="width: 28%;" class="progress-bar"></div>

  574.                                             </div>

  575.                                         </td>

  576.                                         <td class="project-people">

  577.                                             <a href=""><img alt="image" class="img-circle" src="img/a7.jpg"></a>

  578.                                             <a href=""><img alt="image" class="img-circle" src="img/a6.jpg"></a>

  579.                                             <a href=""><img alt="image" class="img-circle" src="img/a3.jpg"></a>

  580.                                         </td>

  581.                                         <td class="project-actions">

  582.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  583.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  584.                                         </td>

  585.                                     </tr>

  586.                                     <tr>

  587.                                         <td class="project-status">

  588.                                             <span class="label label-default">Unactive</span>

  589.                                         </td>

  590.                                         <td class="project-title">

  591.                                             <a href="project_detail.html">Many desktop publishing packages and web</a>

  592.                                             <br/>

  593.                                             <small>Created 10.08.2014</small>

  594.                                         </td>

  595.                                         <td class="project-completion">

  596.                                             <small>Completion with: 8%</small>

  597.                                             <div class="progress progress-mini">

  598.                                                 <div style="width: 8%;" class="progress-bar"></div>

  599.                                             </div>

  600.                                         </td>

  601.                                         <td class="project-people">

  602.                                             <a href=""><img alt="image" class="img-circle" src="img/a5.jpg"></a>

  603.                                             <a href=""><img alt="image" class="img-circle" src="img/a3.jpg"></a>

  604.                                         </td>

  605.                                         <td class="project-actions">

  606.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  607.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  608.                                         </td>

  609.                                     </tr>

  610.                                     <tr>

  611.                                         <td class="project-status">

  612.                                             <span class="label label-primary">Active</span>

  613.                                         </td>

  614.                                         <td class="project-title">

  615.                                             <a href="project_detail.html">Letraset sheets containing</a>

  616.                                             <br/>

  617.                                             <small>Created 22.07.2014</small>

  618.                                         </td>

  619.                                         <td class="project-completion">

  620.                                             <small>Completion with: 83%</small>

  621.                                             <div class="progress progress-mini">

  622.                                                 <div style="width: 83%;" class="progress-bar"></div>

  623.                                             </div>

  624.                                         </td>

  625.                                         <td class="project-people">

  626.                                             <a href=""><img alt="image" class="img-circle" src="img/a2.jpg"></a>

  627.                                             <a href=""><img alt="image" class="img-circle" src="img/a3.jpg"></a>

  628.                                             <a href=""><img alt="image" class="img-circle" src="img/a1.jpg"></a>

  629.                                         </td>

  630.                                         <td class="project-actions">

  631.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  632.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  633.                                         </td>

  634.                                     </tr>

  635.                                     <tr>

  636.                                         <td class="project-status">

  637.                                             <span class="label label-primary">Active</span>

  638.                                         </td>

  639.                                         <td class="project-title">

  640.                                             <a href="project_detail.html">Contrary to popular belief</a>

  641.                                             <br/>

  642.                                             <small>Created 14.07.2014</small>

  643.                                         </td>

  644.                                         <td class="project-completion">

  645.                                             <small>Completion with: 97%</small>

  646.                                             <div class="progress progress-mini">

  647.                                                 <div style="width: 97%;" class="progress-bar"></div>

  648.                                             </div>

  649.                                         </td>

  650.                                         <td class="project-people">

  651.                                             <a href=""><img alt="image" class="img-circle" src="img/a4.jpg"></a>

  652.                                         </td>

  653.                                         <td class="project-actions">

  654.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  655.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  656.                                         </td>

  657.                                     </tr>

  658.                                     <tr>

  659.                                         <td class="project-status">

  660.                                             <span class="label label-primary">Active</span>

  661.                                         </td>

  662.                                         <td class="project-title">

  663.                                             <a href="project_detail.html">There are many variations of passages</a>

  664.                                             <br/>

  665.                                             <small>Created 11.08.2014</small>

  666.                                         </td>

  667.                                         <td class="project-completion">

  668.                                             <small>Completion with: 28%</small>

  669.                                             <div class="progress progress-mini">

  670.                                                 <div style="width: 28%;" class="progress-bar"></div>

  671.                                             </div>

  672.                                         </td>

  673.                                         <td class="project-people">

  674.                                             <a href=""><img alt="image" class="img-circle" src="img/a7.jpg"></a>

  675.                                             <a href=""><img alt="image" class="img-circle" src="img/a6.jpg"></a>

  676.                                             <a href=""><img alt="image" class="img-circle" src="img/a3.jpg"></a>

  677.                                         </td>

  678.                                         <td class="project-actions">

  679.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-folder"></i> View </a>

  680.                                             <a href="#" class="btn btn-white btn-sm"><i class="fa fa-pencil"></i> Edit </a>

  681.                                         </td>

  682.                                     </tr>

  683.                                     </tbody>

  684.                                 </table>

  685.                             </div>

  686.                         </div>

  687.                     </div>

  688.                 </div>

  689.             </div>

  690.         </div>

  691.         <div class="footer">

  692.             <div class="pull-right">

  693.                 10GB of <strong>250GB</strong> Free.

  694.             </div>

  695.             <div>

  696.                 <strong>Copyright</strong> Example Company &copy; 2014-2015

  697.             </div>

  698.         </div>

  699. 

  700.         </div>

  701.         </div>

  702. 

  703.     <!-- Mainly scripts -->

  704.     <script src="js/jquery-2.1.1.js"></script>

  705.     <script src="js/bootstrap.min.js"></script>

  706.     <script src="js/plugins/metisMenu/jquery.metisMenu.js"></script>

  707.     <script src="js/plugins/slimscroll/jquery.slimscroll.min.js"></script>

  708. 

  709.     <!-- Custom and plugin javascript -->

  710.     <script src="js/inspinia.js"></script>

  711.     <script src="js/plugins/pace/pace.min.js"></script>

  712. 

  713.     <script>

  714.         $(document).ready(function(){

  715. 

  716.             $('#loading-example-btn').click(function () {

  717.                 btn = $(this);

  718.                 simpleLoad(btn, true)

  719. 

  720.                 // Ajax example

  721. //                $.ajax().always(function () {

  722. //                    simpleLoad($(this), false)

  723. //                });

  724. 

  725.                 simpleLoad(btn, false)

  726.             });

  727.         });

  728. 

  729.         function simpleLoad(btn, state) {

  730.             if (state) {

  731.                 btn.children().addClass('fa-spin');

  732.                 btn.contents().last().replaceWith(" Loading");

  733.             } else {

  734.                 setTimeout(function () {

  735.                     btn.children().removeClass('fa-spin');

  736.                     btn.contents().last().replaceWith(" Refresh");

  737.                 }, 2000);

  738.             }

  739.         }

  740.     </script>

  741. </body>

  742. 

  743. </html>