"My MUFG"
Bootstrap 3.3.0 Snippet by jindalv

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/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="no-gutter row">
<div class="col-xs-12 col-sm-12 col-md-2 col-lg-2 col-xl-2 navPanel ">
<div class="panel">
<div class="panel-heading">
<img src="https://secure.gravatar.com/avatar/de9b11d0f9c0569ba917393ed5e5b3ab?s=140&r=g&d=mm" class="img-responsive" alt="Cinque Terre">
</div>
<div class="panel-body">
<ul class="nav nav-pills nav-stacked">
<li class="active"><a href="#"><i class="fa fa-home fa-fw"></i>Welcome to MUFG</a></li>
<li><a href=""><i class="fa fa-list-alt fa-fw"></i>About Me</a></li>
<li><a href=""><i class="fa fa-file-o fa-fw"></i>Notifications</a></li>
<li><a href=""><i class="fa fa-bar-chart-o fa-fw"></i>Tasks</a></li>
<li><a href=""><i class="fa fa-newspaper-o fa-fw"></i>Newsfeed</a></li>
<li><a href=""><i class="fa fa-tasks fa-fw"></i>Followed Departments & Teams</a></li>
<li><a href=""><i class="fa fa-calendar fa-fw"></i>Followed Documents</a></li>
<li><a href=""><i class="fa fa-book fa-fw"></i>Applications</a></li>
<li><a href=""><i class="fa fa-pencil fa-fw"></i>Forms & Templates</a></li>
<li><a href=""><i class="fa fa-cogs fa-fw"></i>IT Help</a></li>
<li><a href=""><i class="fa fa-cogs fa-fw"></i>MUFG Calendars</a></li>
<li><a href=""><i class="fa fa-cogs fa-fw"></i>Managed Content</a></li>
</ul>
</div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-10 col-lg-10 col-xl-12">
<div class="row mysiteHeaders text-center">
<div class="col5 col-sm-6 boxes">
<div class="boxTitle">
<p class="text-center">My Blog</p>
</div>
<div class="boxIconText">
<i class="fa fa-rss fa-2x" aria-hidden="true"></i>
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
@import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');
@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation:landscape) {
/* For landscape layouts only */
.deviceOffset
{
margin-right: 100px;
margin-left: 100px;
}
.deviceOffset .twoColumnsGrid
{
width: 50%;
}
}
@media(min-width: 992px) {
.col5 {
width: 20%;
float: left;
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
}
}
a.eachbox {
font-weight: 300;
display: inline-block;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
$( document ).ready(function() {
$("#collapseCommonActionsSection a").each(function( index ) {
//var pickColors = "#" + Math.floor(Math.random()*16777215).toString(16);
var randomColor = ["#39aa33", "#40415b", "#81153d", "#d03f30", "#eea90f","#d40933"];
var pickColors = randomColor[Math.floor(Math.random() * 5)];
$("#collapseCommonActionsSection .boxLink"+index).css("background-color", pickColors);
//console.log( "#collapseCommonActionsSection a:nth-child("+ index +")" + " :" + randomColor);
});
});
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Login and Register Modal

Questions / Comments: