"Gerenciador de Clientes"
Bootstrap 4.1.1 Snippet by joceilton.g@gmail.com

Post to Facebook Tweet this

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<div class="container-fluid">
<div class="row">
<div class="col-sm-3 aside-left">
<div class="nav-side-menu">
<div class="brand"><i class="fa fa-sliders fa-lg"></i> Gerenciador de Clientes </div>
<i class="fa fa-bars fa-2x toggle-btn" data-toggle="collapse" data-target="#menu-content"></i>
<div class="menu-list">
<ul id="menu-content" class="menu-content collapse out">
<li>
<a href="#">
<i class="fa fa-dashboard fa-lg"></i> Painel
</a>
</li>
<li data-toggle="collapse" data-target="#cadastros" class="collapsed">
<a href="#"><i class="fa fa-plus fa-lg"></i> Cadastros <span class="arrow"></span></a>
</li>
<ul class="sub-menu collapse" id="cadastros">
<li>Clientes</li>
</ul>
<ul class="sub-menu collapse" id="cadastros">
<li>Funcionários</li>
</ul>
<ul class="sub-menu collapse" id="cadastros">
<li>Fornecedores</li>
</ul>
<ul class="sub-menu collapse" id="cadastros">
<li>Transportadoras</li>
</ul>
<li data-toggle="collapse" data-target="#produtos" class="collapsed">
<a href="#"><i class="fa fa-list fa-lg"></i> Produtos <span class="arrow"></span></a>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
.nav-side-menu {
overflow: auto;
font-family: verdana;
font-size: 12px;
font-weight: 200;
background-color: #2e353d;
position: fixed;
top: 0px;
width: 24%;
height: 100%;
color: #e1ffff;
margin-left: -15px;
}
.nav-side-menu .brand {
background-color: #23282e;
line-height: 50px;
display: block;
text-align: center;
font-size: 14px;
}
.nav-side-menu .toggle-btn {
display: none;
}
.nav-side-menu ul,
.nav-side-menu li {
list-style: none;
padding: 0px;
margin: 0px;
line-height: 35px;
cursor: pointer;
/*
.collapsed{
.arrow:before{
font-family: FontAwesome;
content: "\f053";
display: inline-block;
padding-left:10px;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Now UI Kit Angular

Questions / Comments: