Skip to content

Commit

Permalink
done1
Browse files Browse the repository at this point in the history
  • Loading branch information
brunubarbosa committed Apr 7, 2019
1 parent da4de53 commit 9722376
Show file tree
Hide file tree
Showing 17 changed files with 2,589 additions and 479 deletions.
3 changes: 3 additions & 0 deletions css/dashboard.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
tbody tr {
cursor: pointer;
}
10 changes: 10 additions & 0 deletions css/perfil.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
.wrapper-options {
position: absolute;
background-color: red;
width: 100%;
}

.wrapper-options li {
list-style: none;

}
106 changes: 79 additions & 27 deletions css/progress.css
Original file line number Diff line number Diff line change
@@ -1,45 +1,97 @@
body{
font-family: 'Roboto', Arial , sans-serif;
padding: 0;
margin: 0;
height: 100vh;
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
}

.progress-bar-owner{
display: flex;
flex-direction: column;
}
.progress-bar-owner .line{
}

.progress-bar-owner .line{
height: 15px;
background: #e8e8e8;
border-radius: 7px;
position: relative;
}
.progress-bar-owner .label{
}

.progress-bar-owner .label{
font-size: 30px;
}
.progress-bar-owner > .line > span{
}

.progress-bar-owner > .line > .progress-quantidade-finish{
position: absolute;
left: 0;
top: 0;
height: 100%;
background: red;
background: #1a8aff;
border-radius: 10px;
}


@keyframes animationLoaded{
}


.progress-partida, .progress-tooltip-final {
color: rgb(251, 251, 251);
position: absolute;
top: 48px;
font-size: .6rem;
}

.progress-tooltip-final {
right: -53%;
top:13px;
}

img.progress-img-ship {
width: 74px;
height: 64px;
cursor: pointer;
}

.progress-tooltip-final, .progress-tooltip-ship {
background-color: rgb(149, 149, 149);
padding: 10px;
border-radius: 10px;

}

.progress-tooltip-ship {
position: absolute;
top: -21%;
font-size: .6rem;
color: #e8e8e8;
}

.progress-mark-ship {
left: -10px;
background-color: red;
}

@keyframes animationLoaded{
0%{
width: 0%;
width: 0%;
}
100%{
width: 100%;
width: 100%;
}
}
}

.progress-mark-final, .progress-mark-ship {
position: absolute;
width: 15px;
height: 15px;
border-radius: 50%;
background-color: rgb(0, 162, 255);
right: 0;
cursor: pointer;
}


.wrapper-progress-v2 {
background-color: rgb(199, 187, 187);
border-radius: 10px;
width: 100%;
height: 10px;
}
.wrapper-progress-v2 .progress-v2-inside {
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
background-color: rgb(56, 156, 61);
height: 100px;
height: 10px;
}
208 changes: 208 additions & 0 deletions detalhe-navio-v2.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,208 @@
<!DOCTYPE html>
<html>

<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>INSPINIA | Contacts 2</title>

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

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

</head>

<body>

<div id="wrapper">

<nav class="navbar-default navbar-static-side" role="navigation">
<div class="sidebar-collapse">
<ul class="nav metismenu" id="side-menu">
<li class="nav-header">
<div class="dropdown profile-element">
<img alt="image" class="rounded-circle w-25" src="img/profile_small.jpg">
<a data-toggle="dropdown" class="dropdown-toggle" href="#">
<span class="block m-t-xs font-bold">Example user</span>
<span class="text-muted text-xs block">menu <b class="caret"></b></span>
</a>
<ul class="dropdown-menu animated fadeInRight m-t-xs">
<li><a class="dropdown-item" href="login.html">Logout</a></li>
</ul>
</div>
<div class="logo-element">
IN+
</div>
</li>
<li class="active">
<a href="index.html"><i class="fa fa-th-large"></i> <span class="nav-label">Main view</span></a>
</li>
<li>
<a href="minor.html"><i class="fa fa-th-large"></i> <span class="nav-label">Minor view</span> </a>
</li>
</ul>

</div>
</nav>
<div id="page-wrapper" class="gray-bg">

<div class="row border-bottom">
<nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">
<div class="navbar-header">
<a class="navbar-minimalize minimalize-styl-2 btn btn-primary " href="#"><i class="fa fa-bars"></i> </a>
<form role="search" class="navbar-form-custom" action="search_results.html">
<div class="form-group">
<input type="text" placeholder="Pesquisar..." class="form-control" name="top-search" id="top-search">
</div>
</form>
</div>
<ul class="nav navbar-top-links navbar-right">
<li class="dropdown">
<a class="dropdown-toggle count-info" data-toggle="dropdown" href="#">
<i class="fa fa-envelope"></i> <span class="label label-warning">16</span>
</a>
</li>
<li>
<a href="#">
<i class="fa fa-sign-out"></i> Log out
</a>
</li>
</ul>

</nav>
</div>
<div class="wrapper wrapper-content animated fadeInRight">








<div class="row d-flex justify-content-center mt-3">
<div class="col-lg-9">
<div class="ibox">
<div class="ibox-content">
<div class="d-flex justify-content-center mb-3">
<h1>Status do navio</h1>
</div>
<div class="row">
<div class="col-lg-6">
<dl class="row mb-0">
<div class="col-sm-4 text-sm-right" style="white-space: nowrap"><dt>Horario previsto:</dt> </div>
<div class="col-sm-8 text-sm-left"><dd class="mb-1"><span class="label label-danger">12:04</span></dd></div>
</dl>
<dl class="row mb-0">
<div class="col-sm-4 text-sm-right" style="white-space: nowrap"><dt>Velocidade média:</dt> </div>
<div class="col-sm-8 text-sm-left"><dd class="mb-1">40kn/h</dd> </div>
</dl>
<dl class="row mb-0">
<div class="col-sm-4 text-sm-right"><dt>Containers:</dt> </div>
<div class="col-sm-8 text-sm-left"> <dd class="mb-1"> 162</dd></div>
</dl>


</div>
<div class="col-lg-6" id="cluster_info">

<dl class="row mb-0">
<div class="col-sm-4 text-sm-right" style="white-space: nowrap;">
<dt>Ultima atualização:</dt>
</div>
<div class="col-sm-8 text-sm-left">
<dd class="mb-1">07/04/2019 12:39</dd>
</div>
</dl>
</div>
</div>


<div class="ibox w-50 ">

<div class="position-relative">
<div class="ibox-content">
<div class="progress-bar-owner">
<div class="progress-partida">0</div>
<div class="js--wrapper-img-ship" data-count="60">
<div class="js--tooltip-progress progress-tooltip-ship d-none" data-tooltip="1">
<div><span class="mb-0">Velocidade:</span><span class="text-center mb-0">120km/h</span></div>
<div><span class="mb-0">Containers: </span><span class="text-center mb-0">300</span></div>
</div>
<img data-tooltip="1" src="/img/ship.png" class="js--progress-hover progress-img-ship d-absolute" alt="">
</div>
<div class="js--line line" style="width:500px">
<span class="progress-quantidade-finish"></span>
<span class="js--progress-hover progress-mark-final" data-tooltip="2"></span>
</div>
<div class="js--tooltip-progress js--progress-final progress-tooltip-final d-none" data-tooltip="2"><p class="mb-0">Chegada prevista na barra:</p><p class="text-center mb-0">12:00</p></div>
</div>
</div>
</div>
</div>



</div>
</div>
</div>
</div>












<div class="row">
<div class="col-lg-3">
<div class="contact-box center-version">
<a href="profile.html">
<img alt="image" class="rounded-circle" src="img/profile_small.jpg">
<h3 class="m-b-xs"><strong>Michael Zimber</strong></h3>

<div class="font-bold">Sales manager</div>
</a>
<div class="contact-box-footer">
<span>Engajamento</span>
<div class="wrapper-progress-v2">
<div style="width: 20%;" class="progress-v2-inside"></div>
</div>
</div>

</div>
</div>


</div>
</div>

</div>
</div>

<!-- Mainly scripts -->
<script src="js/jquery-3.1.1.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="js/plugins/slimscroll/jquery.slimscroll.min.js"></script>

<!-- Custom and plugin javascript -->
<script src="js/inspinia.js"></script>
<script src="js/plugins/pace/pace.min.js"></script>
<script src="js/progress.js"></script>


</body>

</html>
Loading

0 comments on commit 9722376

Please sign in to comment.